Google 条形图条形图和轴与数据不相关答案

【问题标题】：Google Bar chart bars & axis do not correlate to dataGoogle 条形图条形图和轴与数据不相关
【发布时间】：2018-07-15 11:49:26
【问题描述】：

https://i.imgur.com/qKcSRjS.png

条形图的值从上到下分别为 66、77、91、0

如您所见，X 轴上的标签没有按比例缩放，似乎只是指示每个条形的值，并且条形也没有按比例缩放到它们的值，它们似乎只是以阶梯方式堆叠。底栏应为“空”，因为它是 0。

数据是动态生成的，但结果代码如下：

 function drawRightY() {
    var data = google.visualization.arrayToDataTable([ ['Date', 'Received'], ['1/15/2018', '66'],['1/22/2018', '77'],['1/29/2018', '91'],['2/5/2018', '0'] ]);

    var materialOptions = {
        chart: {

        hAxis: {
            title: 'Date',
            minValue: 0,
    scaleType: 'log'
        },
        vAxis: {
            title: 'Received'
        },
        bars: 'horizontal',
        legend: {
            position: 'none'
        },
        axes: {
            y: {
                0: { side: 'left' }
            }
        }
    };

【问题讨论】：

标签： charts google-visualization

【解决方案1】：

数据中的值应该是数字，而不是字符串（去掉单引号）

['1/15/2018', '66'] // <-- string

['1/15/2018', 66] // <-- number

请参阅以下工作 sn-p...

google.charts.load('current', {
  packages:['corechart']
}).then(function () {
    var data = google.visualization.arrayToDataTable([ ['Date', 'Received'], ['1/15/2018', 66],['1/22/2018', 77],['1/29/2018', 91],['2/5/2018', 0] ]);

    var materialOptions = {
        hAxis: {
            title: 'Date',
            minValue: 0,
            scaleType: 'log'
        },
        vAxis: {
            title: 'Received'
        },
        bars: 'horizontal',
        legend: {
            position: 'none'
        },
        axes: {
            y: {
                0: { side: 'left' }
            }
        }
    };

    var chart = new google.visualization.BarChart(document.getElementById('chart'));
    chart.draw(data);
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>

【讨论】：