1

Google ChartWrapper テーブルの選択を Google Chartwrapper BarChart の選択に接続しようとしています。リスナーは機能していますが、次の時点で停止します。

orgchart.setSelection(table.getSelection());

(この行にコメントすると、次の行が実行されます)。手がかりにとても感謝しています!ここの HTML セクションでテストできます。私のコードは次のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>
  Google Visualization API Sample
</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {packages: ['orgchart', 'table']});
        google.load('visualization', '1', {packages: ['table']});
  google.load('visualization', '1.1', {packages: ['controls']});
  google.load('visualization', '1', {packages: ['barchart']});
  google.load('visualization', '1');
</script>
<script type="text/javascript">
var map;
var table;
var data;

function drawOrgChartAndTable() {
  var test = [
    ['Name',  'Manager'],
    ['Mike',  1],
    ['Jim',   3],
    ['Alice', 4],
    ['Bob',   1],
    ['Carol', 5]
  ];
  var data = google.visualization.arrayToDataTable(test);

  var orgchart = new google.visualization.ChartWrapper({
      chartType: 'BarChart',
    dataTable: test,
      options: {'title': 'Countries'},
      containerId: 'orgchart'
    });
  orgchart.draw();

  var table = new google.visualization.ChartWrapper({
      chartType: 'Table',
    dataTable: test,
      options: {'title': 'Countries'},
      containerId: 'table'
    });
  table.draw();

  // When the table is selected, update the orgchart.
  google.visualization.events.addListener(table, 'select', function() {
    orgchart.setSelection(table.getSelection());
    alert("Table event!");
  });

  // When the orgchart is selected, update the table visualization.
  google.visualization.events.addListener(orgchart, 'select', function() {
    table.setSelection(orgchart.getSelection());
    alert("Chart event!");
  });
}


google.setOnLoadCallback(drawOrgChartAndTable);
</script>
</head>


<body style="font-family: Arial;border: 0 none;">
    <table>
      <tr>
        <td>
          <div id="orgchart" style="width: 300px; height: 300px;"></div>
        </td>
        <td>
          <div id="table" style="width: 300px; height: 300px;"></div>
        </td>
      </tr>
    </table>
  </body>
</html>
​
4

1 に答える 1