Question

使用Google Charts API创建一个包含Google Fusion表作为数据源的柱形图。

但是，要让它识别查询中的列，我必须将它们重命名为单个单词，这意味着我的图例看起来有点无用。

<html>
  <head>
    <meta charset="UTF-8">

    <title>Fusion Tables API Example: Google Chart Tools Bar Chart</title>

    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', { packages: ['corechart'] });

      function drawVisualization() {
        google.visualization.drawChart({
          containerId: 'visualization',
          dataSourceUrl: 'http://www.google.com/fusiontables/gvizdata?tq=',
          query: 'SELECT Name, GCSE09, GCSE10, GCSE11, GCSE12 FROM 16XitWt9yCjRFVGFj4h109dGA_9wLgqExVrF9sAk WHERE URN="100049"',
      chartType: 'ColumnChart',
      options: {
        title: '% gaining 5 A*-C GCSEs including English and Maths',
        vAxis: {
          title: 'Percentage'
        },
        hAxis: {
          title: ''
        }
      }
    });
  }

  google.setOnLoadCallback(drawVisualization);
</script>
  </head>
  <body>
    <div id="visualization"></div>
  </body>
</html>

有没有办法自定义图例，以便显示的文字与列标题不同？

Answer 1

您应该能够查询名称中包含空格的列。

在你的字符串周围使用“

在列名称周围使用'

  function drawVisualization() {
    google.visualization.drawChart({
      containerId: 'visualization',
      dataSourceUrl: 'http://www.google.com/fusiontables/gvizdata?tq=',
      query: "SELECT Name, 'GCSE09', 'GCSE10', 'GCSE11', 'GCSE12' FROM 16XitWt9yCjRFVGFj4h109dGA_9wLgqExVrF9sAk WHERE URN='100049'",
  chartType: 'ColumnChart',
  options: {
    title: '% gaining 5 A*-C GCSEs including English and Maths',
    vAxis: {
      title: 'Percentage'
    },
    hAxis: {
      title: ''
    }
  }
});

使用Fusion Table作为数据源使用Google Charts API时自定义图例

1 个答案: