这里很简单:
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 } });
但是生成的图形是错误的 - 第一个值被绘制好 - 在2011年10月16日,但是所有其他值(条形图)定位不正确 - 比它们应该更早一天(即使它们的“工具提示”突出显示是正常的,它们也是在x轴上只是在错误的位置)。知道如何解决这个问题吗?
见图:
答案 0 :(得分:1)
我认为一般来说,在处理条形图时,你应该总是使用刻度线来获得更好的情节。
同样针对您的问题,您在使用this approach, please see here.时获得了有趣的结果。在这里您需要记住,如果您不想在dataHits
中未指定的日期显示任何内容,则还需要提供它们只给它们0的值。
当您同时使用ticks
和dateAxisRenderer
功能时,您获得了有趣的结果(希望这是您想要的)。 This I show in the following sample.此处显示读数之间显示时间距离的间隙,并正确绘制所有值。同样重要的是要注意min
,max
和tickInterval
没有任何效果,因为我们使用刻度线。
BTW:如果您仍想在图表周围留下一些空白,可以申请the approach presented in EDIT of this answer。