Google visualization 在谷歌图表中设置x轴范围

Google visualization 在谷歌图表中设置x轴范围,google-visualization,Google Visualization,我尝试使用谷歌图表示例创建条形图 var data = new google.visualization.DataTable(); data.addColumn('string', 'Topping'); data.addColumn('number', 'Slices'); data.addRows([ ['Mushrooms', 5], ['Onions', 4], ['Olives', 3] ['Zucch

我尝试使用谷歌图表示例创建条形图

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Topping');

    data.addColumn('number', 'Slices');

    data.addRows([
      ['Mushrooms', 5],
      ['Onions', 4],
      ['Olives', 3]
      ['Zucchini', 2],
      ['Pepperoni', 1]
    ]);
图表已成功创建,但在X轴上显示0到6之间的值。 当我将所有值传递为0时,它显示从-1到+1的X轴


是否可以将X轴设置为始终从0%到100%开始。通过设置
hAxis.viewWindow.min
hAxis.viewWindow.max
选项,可以强制条形图的X轴始终显示特定范围:

hAxis: {
    viewWindow: {
        min: 0,
        max: 100
    },
    ticks: [0, 25, 50, 75, 100] // display labels every 25
}

设置
勾选
值:

vAxis: { 
         ticks: [{v:0, f:'0%'},{v:10, f:'10%'},{v:20, f:'20%'},{v:30, f:'30%'}]
}

u可以通过修改计数值来设置x轴,因为我们使用的是DataTable()

var databmi=new google.visualization.DataTable()


我在chrome和firefox中测试了它,在max:100上它显示的范围高达80,当我将其设置为max:100.1时,它显示的范围高达100。我假设您指的是轴标签,因为在示例中,轴的实际范围应该是0-100。如果希望更改API默认选择的标签,可以使用
hAxis.ticks
选项覆盖它们;我将用一个例子来更新答案。有没有办法创建带有日期范围的viewWindow?我尝试了
viewWindow:{min:new Date(2016,1,1),max:new Date(2016,1,8)}
,但是x轴上的结果范围不是1月1日到8日。。好像是关了……哦。我的坏习惯本该如此。一月指数为0。因此,
viewWindow:{min:new Date(2016,0,1),max:new Date(2016,0,8)}
的范围应为1月1日至1月8日。也请确保不要以前导零开始月份或天数,例如
012
,因为JS会将其解释为八进制常数。
 data.addColumn('string', 'Country');
      data.addColumn('number', 'GDP');
      data.addRows([
        ['US', 16768100],
        ['China', 9181204],
        ['Japan', 4898532],
        ['Germany', 3730261],
        ['France', 2678455]
      ]);

     var options = {
       title: 'GDP of selected countries, in US $millions',
       width: 500,
       height: 300,
       legend: 'none',
       bar: {groupWidth: '95%'},
       vAxis: { 
             title :'your choice',
             gridlines: { count: 4 } 
              },
        hAxis: {
               title :'your choice',
                gridlines: {count: 4}
              }
     };