javascript - 将谷歌表格加载到仪表板中的谷歌图表

Question

我在仪表板上显示 google 表格信息时遇到问题。 x 和 y 轴标签显示为 Generalxxx .数据来自here .

 var laptimeChart = new google.visualization.ChartWrapper({
            'chartType': 'ColumnChart',
            'containerId': 'chart_div',
            'width': '500',
            'height': '500',
            'view': { 'columns': [1,2] }
        });

Answer 1

图表似乎默认使用“常规”格式

要更正，请为每个轴设置特定的格式...

      options: {
        hAxis: {
          format: '0'
        },
        vAxis: {
          format: '#,##0'
        }
      },

请参阅以下工作片段...

google.charts.load('current', {
  packages: ['controls', 'corechart', 'table']
}).then(function () {
  var query = new google.visualization.Query('https://docs.google.com/spreadsheets/d/1PlT8k6qXsCkOCEEJFn7apKYgDunLi1Lzmnmo_AKQBXc/edit#gid=0');
  query.send(handleQueryResponse);

  function handleQueryResponse(response) {
    if (response.isError()) {
      console.log('Error: ' + response.getMessage() + ' ' + response.getDetailedMessage());
      return;
    }

    var data = response.getDataTable();

    var control = new google.visualization.ControlWrapper({
      controlType: 'NumberRangeFilter',
      containerId: 'control',
      options: {
        filterColumnIndex: 1,
        ui: {
          format: {
            pattern: '0'
          }
        }
      }
    });

    var chart = new google.visualization.ChartWrapper({
      chartType: 'ColumnChart',
      containerId: 'chart',
      options: {
        hAxis: {
          format: '0'
        },
        vAxis: {
          format: '#,##0'
        }
      },
      view: {
        columns: [1, 2]
      }
    });

    var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard'));
    dashboard.bind(control, chart);
    dashboard.draw(data);
  }
});

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