Google visualization Google Chartwrapper中水平轴上的标签数

在GoogleCharts中，

'hAxis'：{'gridlines'：{'count'：3}

语句似乎可以工作，但当我将chartWrapper用作交互式绘图的一部分时，它不能工作。我并不真正关心垂直网格线，但我想控制X轴上有多少标签。我认为标签通常被附加到网格线上——每个网格线一个标签

我有一个来自Google Charts网站的例子，我唯一改变的是将try和put放在3个网格线中：

---

图表选项

勾号

仅受

在您共享的小提琴中，

视图

放在图表上，
将第一列从类型

'date'

转换为

'string'

，
结果是

---

要控制X轴上的标签数量，请删除

视图

要在此处动态构建

标记

，请使用范围筛选器的

状态

，
了解图表上当前显示的日期范围

当控件的

'statechange'

事件触发时，需要重新绘制图表

请参阅以下工作片段，每5天创建一个轴标签

google.charts.load（'current'{
回调：drawChartRangeFilter，
包：['corechart'，'controls']
});
函数drawChartRangeFilter（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'date'，'date'）；
data.addColumn（'number'，'Stock low'）；
data.addColumn（'number'，'Stock open'）；
data.addColumn（'number'，'Stock close'）；
data.addColumn（'number'，'Stock high'）；
var开启，关闭=300；
var低、高；
对于（var日=1；日<121；++日）{
var变化=（Math.sin（day/2.5+Math.PI）+Math.sin（day/3）-Math.cos（day*0.7））*150；
变更=变更>=0？变更+10：变更-10；
打开=关闭；
关闭=数学最大值（50，打开+更改）；
低=数学最小值（打开、关闭）-（数学最小值（第1.7天）+1）*15；
低=数学最大值（0，低）；
高=数学最大值（开放、关闭）+（数学cos（第1天*1.3）+1）*15；
var日期=新日期（2012年，0日）；
addRow（[date，Math.round（低），Math.round（开），Math.round（关），Math.round（高）]；
}
var dashboard=new google.visualization.dashboard(
document.getElementById（'仪表板'）
);
var control=new google.visualization.ControlWrapper({
controlType:“ChartRangeFilter”，
集装箱：“控制”，
选项：{
filterColumnIndex:0，
用户界面：{
图表类型：“线条图”，
图表选项：{
图表区：{
宽度：“92%”
},
哈克斯：{
基线颜色：“无”
},
身高：72
},
图表视图：{
列：[0,3]
},
最小范围大小：86400000
}
},
声明：{
范围：{
开始日期：新日期（2012年1月9日），
结束：新日期（2012年2月20日）
}
}
});
var chart=new google.visualization.ChartWrapper({
图表类型：'CandlestickChart'，
集装箱船：“海图”，
选项：{
图表区：{
高度：“100%”，
宽度：“100%”，
前12名，
左：48，
底图：48，
右：48
},
言辞：{
视图窗口：{
分:0,，
最高：2000
}
},
图例：{
位置：“无”
}
}
});
google.visualization.events.addListener（控件'statechange'，setAxisTicks）；
函数setAxisTicks（）{
var一天=（1000*60*60*24）；
var dateRange=control.getState（）.range；
var ticksAxisH=[]；
for（var i=dateRange.start.getTime（）；i 0）{
push（新日期（ticksAxisH[ticksAxisH.length-1].getTime（）+（oneDay*5））；
}
chart.setOption（'hAxis.ticks'，ticksAxisH）；
if（chart.getDataTable（）！==null）{
chart.draw（）；
}
}
setAxisTicks（）；
仪表板绑定（控件、图表）；
drawDashboard（）；
$（窗口）。调整大小（drawDashboard）；
函数drawDashboard（）{
仪表盘.绘图（数据）；
}
}

若要控制轴上显示的标签，请在

hAxis

或

vAxis

上使用选项-->

ticks

--请参阅此答案中的最后一次编辑-->该选项允许我通过将刻度线作为数组放入来控制刻度线，但我不想这样做，因为我有一个动态数据源。我真的只想要5个或10个刻度，然后让谷歌来决定放在哪里。到目前为止，我还不知道该怎么做。我共享的答案显示了如何使用数据表方法-->

getColumnRange

--如果需要，我可以在这里添加另一个示例，这将有助于获得数据样本（请参见答案中的编辑）…我明白您现在所说的。但我还是不能让它正常工作。我这里有一个jfiddle示例：删除日期到字符串的转换修复了我所有的问题！这正是我从一开始就期望的工作方式。非常感谢。

 // Convert the first column from 'date' to 'string'.
 'view': {
   'columns': [{
     'calc': function(dataTable, rowIndex) {
       return dataTable.getFormattedValue(rowIndex, 0);
     },
     'type': 'string'
   }, 1, 2, 3, 4]
 }