首页 文章

谷歌图表垂直轴奇怪的标签

提问于
浏览 次
1

我制作了一个Google柱形图 . 它显示确定 . 但垂直轴标签显示的是我从未设置过的单位 . 这是屏幕截图 .

enter image description here

我不明白 why it displays "1 td" instead of 1000 , "1,2 td" instead of 1200.

这是我的代码：

google.load("visualization", "1.1", {packages:["bar"]});

google.setOnLoadCallback(drawChart);

function drawChart() {
     var data = google.visualization.arrayToDataTable([
            ….
            ….
]);

var options = {
          title: 'My Test',
 };

var chart = new google.charts.Bar(document.getElementById('columnchart_material'));
chart.draw(data, options);

<div id="columnchart_material" style="width: 900px; height: 500px;"></div>

我的代码没有任何特殊的垂直轴部分，我使用谷歌图表库 . why it gets 'td' unit for vertical axis even I didn't set myself? Is it Google column chart default option? 我尝试用 vAxis: 操纵垂直轴值 . 但没有运气 . 有什么建议吗？

charts google-visualization material-design

1 回答

  • 3

    显然，当使用material bar charts时， y -axis（vAxis）默认格式为 short ，意味着显示数千的 td 等等 . 要将此设置 format 重置为 '' ：

    var options = {
  axes : {
    y : {
      all : {
        format : {
           pattern : ''
        }
      }
    }
  }
}    
var chart = new google.charts.Bar(document.getElementById('columnchart_material'));
chart.draw(data, options);

    演示 - > http://jsfiddle.net/sfc9aLd4/

    但是材料图表仍处于测试阶段，许多选项尚未记录或记录不佳 . 幸运的是，我们可以使用谷歌可视化选项对象布局并将其转换为 convertOptions(options) ：

    var options = {
    vAxis : {
        format : '' //or #####
    }
}    
var chart = new google.charts.Bar(document.getElementById('columnchart_material'));
chart.draw(data, google.charts.Bar.convertOptions(options));

    将导致与上述相同 axes : { ... }
    演示 - > http://jsfiddle.net/3aq7gucd/

    有了材料图表， format 似乎存在一些差异 . 'none' 现在 '' . decimal 应更改为 ####.## 或同样 . scientific ， currency 和 percent 像以前一样工作 .

    回复于

相关问题