Google Visualization完整的浏览器窗口

时间:2013-01-22 18:06:08

标签: javascript html google-visualization

我有这个谷歌可视化,我想在浏览器窗口全屏播放:http://cl.ly/image/1y0U1m1o2m0m

代码是:

<html>
  <head>
    <meta charset="utf-8">
    <title>

    </title>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("jquery", "1.4.2");
      google.load('visualization', '1', {packages: ['corechart']});
    </script>
    <script type="text/javascript">
      function drawVisualization() {
        // Create and populate the data table.
        var a = <?=$elos?>;
        var data = google.visualization.arrayToDataTable(a);

        var options = {
          title: 'blah blah blah',
          //curveType: "function",
          width: $(window).width(),
          height: $(window).height(),
          vAxis: {
            minValue:800,
            maxValue:2000,
            textStyle: {color: 'black'}
          },
          legend:{position: 'none'}
        };



        // Create and draw the visualization.
        new google.visualization.LineChart(document.getElementById('visualization')).
            draw(data, options);
      }

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

即使设置为窗口大小并且它为窗口大小创建了一个矩形,图表周围也有很多可用空间

1 个答案:

答案 0 :(得分:0)

使图表成为整页尺寸:

chartArea: {width: '90%', height: '90%'}