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',
},
问题是当我绘制图表时,最后一个 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',
},