如何在WebView中对齐Google图表?

时间:2017-09-18 20:12:39

标签: android html css

我的Android图表未在我的Android模拟器屏幕中心对齐。当活动加载时,我明白了:

android emulator image

如何将图表放在屏幕中央?我尝试了一些css,并在堆栈上找到了xml解决方案,但它们没有带来任何结果。

以下是我使用的代码:

<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">

  google.load('visualization', '1.0', {'packages':['corechart']});

  google.setOnLoadCallback(drawChart);

  function drawChart() {

  // Create the data table.
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'ITEM');
  data.addColumn('number', 'VALUE');
  data.addRows([
    [Android.getName(0), Android.getPoint(0)],
    [Android.getName(1), Android.getPoint(1)],
    [Android.getName(2), Android.getPoint(2)],
    [Android.getName(3), Android.getPoint(3)],
    [Android.getName(4), Android.getPoint(4)]
  ]);

  // Set chart options
  var options = {'title':'You Have a GREAT Music Taste',
                 pieHole: 0.4,
                 width: '100%',
                 height: '750'
                 };

  // Instantiate and draw our chart, passing in some options.
  var chart = new 
 google.visualization.PieChart(document.getElementById('chart_div'));
  chart.draw(data, options);
  google.visualization.events.addListener(chart, 'select', selectHandler);

  function selectHandler() {
      var selection = chart.getSelection();
      var message = '';
      for (var i = 0; i < selection.length; i++) {
        var item = selection[i];
        if (item.row != null && item.column != null) {
          var str = data.getFormattedValue(item.row, item.column);
          message += '{row:' + item.row + ',column:' + item.column + '} = ' 
+ str + '\n';
        } else if (item.row != null) {
          var str = data.getFormattedValue(item.row, 0);
          message += '{row:' + item.row + ', column:none}; value (col 0) = ' 
+ str + '\n';
        } else if (item.column != null) {
          var str = data.getFormattedValue(0, item.column);
          message += '{row:none, column:' + item.column + '}; value (row 0) 
= ' + str + '\n';
        }
      }
      if (message == '') {
        message = 'nothing';
      }
      Android.sendData('You selected ' + message);
   }

}
</script>
</head>

<body>
<!--Div that will hold the pie chart-->
<div id="chart_div" style="width:500; height:500"></div>
</body>
</html>

0 个答案:

没有答案