0

使用 Google Charts API 创建以 Google Fusion 表为数据源的柱形图。

http://clairemiller.net/TableTest.html

但是,为了让它识别查询中的列,我不得不将它们重命名为一个单词,这意味着我的图例看起来有点无用。

<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>

有没有办法自定义图例,使显示的文本与列标题不同?

4

1 回答 1

0

您应该能够查询名称中带有空格的列。

在你的字符串周围使用 "

在列名周围使用 '

  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: ''
    }
  }
});
于 2013-05-23T23:24:58.570 回答