jqPlot日期轴 - 在错误的日子绘制的条形图? [英] jqPlot date axis - bars drawn on wrong day?
问题描述
非常简单的东西:
var dataHits = [['2011-10-16',1],['2011-11-05',7],['2011-11-06',1],['2011-11-09',2],['2011-11-12',5]];
var plot1 = $.jqplot('chartHits', [dataHits], {
title:'Zobrazenia profilu spolu',
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions: {
barPadding: 0, // number of pixels between adjacent bars in the same
// group (same category or bin).
barMargin: 0, // number of pixels between adjacent groups of bars.
barDirection: 'vertical', // vertical or horizontal.
barWidth: 10
}
},
axes:{
xaxis:{
renderer:$.jqplot.DateAxisRenderer,
min: '2011-10-15',
max: '2011-11-13',
tickInterval: "2 day",
tickOptions:{
formatString:'%d.%m'
}
},
yaxis:
{
min: 0,
tickInterval: 1
}
},
highlighter: {
show: true,
sizeAdjust: 7.5
},
cursor: {
show: false
}
});
但生成的图表错误 - 第一个值被绘制好 - 在16.10.2011,但所有其他值(条形图)定位不正确 - 比他们应该更早一天(即使他们的工具提示突出显示是好的,他们只是在x轴上的错误位置)。知道怎么解决这个问题吗?
But generated graph is wrong - first value is drawn OK - on 16.10.2011, but all other values (bars) are positioned incorrectly - one day sooner than they should be (even their "tooltip" when highlighted is OK, they are just in wrong place on x-axis). Any idea how to fix this?
见图:
推荐答案
我认为一般来说,在处理条形图时,您应该始终使用刻度线有一个更好的情节。
另外针对您的问题,使用这种方法时,您会看到有趣的结果,请参阅此处。在这里你需要记住,如果你想要在 dataHits
中未指定的日期显示任何内容,你需要提供它们以及给它们赋值0。
I think that in general, when dealing with barcharts you should always use ticks to have a nicer plot.
Also for your problem you obtain interesting results when using this approach, please see here. Here you would need to remember that if you care on showing nothing for the days that are not specified in the dataHits
you would need to provide them as well just giving them value of 0.
当您同时使用 ticks时,您获得的有趣结果(希望这是您想要的)
和 dateAxisRenderer
功能。 我在以下示例中显示。这里是间隙,显示读数之间的时间距离,保留,所有值都正确绘制。同样重要的是要注意 min
, max
和 tickInterval
因为我们使用刻度线没有效果。
Interesting results you obtain (hope this is what you want) when you use both ticks
and dateAxisRenderer
capabilities. This I show in the following sample. Here the gaps, showing time distance between the readings, are preserved and all values are correctly painted. Also important to notice the min
, max
and tickInterval
have no effect since we use ticks.
顺便说一句如果你仍想在图表周围留下一些空白,你可以申请编辑本回答中提出的方法。
BTW: If you still want to have some gaps around the chart you could apply the approach presented in EDIT of this answer.
这篇关于jqPlot日期轴 - 在错误的日子绘制的条形图?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!