我想控制显示的x轴间隔(并且垂直网格线与每个标签点相关联)但我无法找到这样做的方法。 Dygraphs默认情况下基于全部x范围填充x标签,但我想要更多粒度。 例如,如果我想为7月和14日提供一个月的数据,我使用dateWindow来设置我的界限。默认情况下,Dygraphs在7 / 6,7 / 13,7 / 20和7/27(每周开始)给出x间隔。但我想要更多的标签和相应的垂直线;例如,每3天,而不是一周开始。
这可能吗?我对每个x标签的显示方式感到满意(所以我不认为它是标签格式化程序)。我只想要更多。
答案 0 :(得分:2)
在实际的dygraph-combined.js文件(2327)中更改此部分:
checkout#edit
更改设置图表的选项块中的x: {
pixelsPerLabel: 70, <----- change this value!!
axisLabelWidth: 60,
axisLabelFormatter: Dygraph.dateAxisLabelFormatter,
valueFormatter: Dygraph.dateValueFormatter,
drawGrid: true,
drawAxis: true,
independentTicks: true,
ticker: null // will be set in dygraph-tickers.js
},
值似乎不起作用。我不确定为什么。
答案 1 :(得分:2)
现在Dygraph实例中有一个名为getDateAxis
的公开方法。
在dygraph-tickers.js
找到有关它的更多信息。
如果您愿意,也可以从datePicker
所以,你可以对待你想要的&#34;频率&#34; (每3天,每1天一次),基于x轴的maximum
和minimum
值。
我的下面的例子找不到&#34;最佳频率&#34;,而是将其修复为总是每小时显示一个滴答。
出于测试目的,将Dygraph.HOURLY
更改为Dygraph.TWO_DAILY
,无论您有什么缩放,每两天都会有一个勾号。
g = new Dygraph(
document.getElementById("graphdiv"),
graph_data,
{ // other options......
axes: {
x: {
ticker: function(min, max, pixels, opts, dygraph, vals) {
return Dygraph.getDateAxis(min, max, Dygraph.HOURLY, opts, dygraph);
},
},
}
}
);
答案 2 :(得分:1)
看起来轴对象提供了ticker属性,这是一个可以设置的函数,用于返回所需的标记(http://dygraphs.com/options.html#Axis显示)。
查看内置自动收报机功能的Dygraph:http://dygraphs.com/dygraph-tickers.js
您可以将这些作为开发自己的起点。