谷歌可视化完整的浏览器窗口

Google Visualization full browser window

本文关键字:浏览器 窗口 可视化 谷歌      更新时间:2023-09-26

我有这个谷歌可视化,我想在我的浏览器窗口上全屏显示它: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>

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

要使图表为整页大小:

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