簡體   English   中英

jQuery Flot Time缺少最后的x軸標簽

[英]jQuery Flot Time missing last x-axis label

問題在於,當我繪制圖形時,最后的x軸標簽未顯示在軸上(即使正確繪制了值)。

我想我已經將它縮小到'minTickSize'值為1天,但我需要它為1天所以我不知道如何解決這個問題。 我把它放在一個jsfiddle: http//jsfiddle.net/s7x5ef0p/1/

JS:

function plotGraph(graphData){

    var graphData = [{
        data: graphData.sort(),
        color: '#FFF'
    }];

    $.plot($('#graph'), graphData, {
        series: {
            points: {
                show: true,
                radius: 5
            },
            lines: {
                show: true
            },
            shadowSize: 3
        },
        grid: {
            color: '#FFF',
            borderColor: 'transparent',
            borderWidth: 20,
            hoverable: true
        },
        xaxis: {
            mode: "time",
            timeformat: "%d/%m/%y",
            minTickSize: [1,"day"],
            tickColor: 'transparent'
        },
        yaxis: {
            tickSize: 1
        }
    });
}

var graphData = [[1430953200000,107],[1430953200000,107],    [1430953200000,107],[1430953200000,107],[1430953200000,107]
,[1430953200000,107],[1430866800000,107],[1430780400000,107]];

plotGraph(graphData);

最后一個標簽將以圖表邊緣為中心,因此延伸到容器div之外。
最簡單的解決方法是將x軸的最大值設置為更大的值,以便可以將標簽安全地放置在圖表和容器中。

xaxis: {
    mode: "time",
    timeformat: "%d/%m/%y",
    minTickSize: [1,"day"],
    tickColor: 'transparent',
    max: 1430957400000 // max value from your data + 2 hours
},

更新小提琴

或者,您可以手動指定刻度:

xaxis: {
    mode: "time",
    timeformat: "%d/%m/%y",
    ticks: [1430780400000, 1430866800000, 1430953200000],
    tickColor: 'transparent',
},

更新小提琴

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM