GeoChart:格式化工具提示

时间:2017-05-18 20:41:25

标签: google-visualization

我正在绘制GeoChart直接从Google表格中获取数据。电子表格具有以下结构:

ISO 3166-2  NumValue1   NumValue2   Country name
XX          XX          XX          XX
XX          XX          XX          XX

我想将Col0用作区域标识符,使用Col1作为值,我想将Col3显示为工具提示标题,并Col1&工具提示中的Col2(col标题为标签)。

以下代码有效(区域使用Col0显示,值取自Col1),但我需要更改它,以便工具提示显示其他列的数据(而不是来自其他列) Col0)。

  google.setOnLoadCallback(drawRegionsMap);

  function drawRegionsMap() {
      var query = new google['visualization'].Query('https://docs.google.com/spreadsheets/d/____&headers=1&range=A1:C')
      query.send(handleQueryResponseTR);
  }

  function handleQueryResponseTR(response) {
      if (response.isError()) {
          alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
          return;
      }

      var options = {
          displayMode: 'regions',
          sizeAxis: {
              minValue: 0,
              maxValue: 5
          },
          colorAxis: {
              colors: ['#fff', '#000']
          },
          legend: 'none'
      };

      var data = response.getDataTable();

      var chart = new google.visualization.GeoChart(document.getElementById('geochart-colors'));
      var table = new google.visualization.Table(document.getElementById('table_div'));

      chart.draw(data, options);
      table.draw(data, {
          width: '100%',
          height: '100%'
      });
  };

我已阅读文档,似乎最好的方法是将chart.draw(data, options);更改为chart.draw(view, options);,然后再添加:

// defines the data for the tooltip
var formatter = new google.visualization.PatternFormat('{0}');
formatter.format( data, [0,1], 1 );
var formatter = new google.visualization.PatternFormat('{2}');
formatter.format( data, [0,1,2], 0 );

// defines the data for the chart values
var view = new google.visualization.DataView(data);
view.setColumns([0, 1]);

但我真的不明白如何使用格式化工具将工具提示显示为:

Col3 (Title)
Col1 (label): Col1 value
Col2 (label): Col2 value

此外,每当我更改查询网址以包含第四列(&range=A1:D)时,我都会收到Incompatible data table: Error: Table contains more columns than expected (Expecting 3 columns)错误。

0 个答案:

没有答案