1

Google のスキャッターがあり、マウスが円の上にあるときに、カスタム文字列を含む情報ウィンドウを開きたいと思います。

たとえば、チュートリアル https://developers.google.com/chart/interactive/docs/events#Event_Listeners で円をクリックすると、カスタム文字列で情報ウィンドウが開きます。

ありがとう

編集：

私はこのコードを試します:

function drawChart() {
  var dataTable = new google.visualization.DataTable();
  dataTable.addColumn('number', 'SVD1');
  dataTable.addColumn('number', 'SVD2');
  dataTable.addColumn('number', 'SVD3');
  // A column for custom tooltip content
  dataTable.addColumn({type: 'string', role: 'tooltip'});
  dataTable.addRows([
    [2010, 600, null ,'test1'],
    [2011, 1500, null , 'test2'],
    [2012, null, 800, 'test3'],
    [2013, null, 1000, 'test4']
  ]);

  var options = {
    tooltip: {isHtml: true},
    legend: 'none'
  };
  var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
  chart.draw(dataTable, options);
}

ツールチップを使用すると、文字列「test 3」と「test4」が正しく表示されます。文字列 "test1" と " "test2" が消えます。なぜですか???

4

1 に答える 1

1

見つけた！！！以下、問題の解決策を示します。

サンプルコード:

function drawChart() {
  var dataTable = new google.visualization.DataTable();
  dataTable.addColumn('number', 'SVD1');
  dataTable.addColumn('number', 'SVD2');
  dataTable.addColumn({type: 'string', role: 'tooltip'});
  dataTable.addColumn('number', 'SVD3');
  // A column for custom tooltip content
  dataTable.addColumn({type: 'string', role: 'tooltip'});
  dataTable.addRows([
    [2010,  600, 'test1' ,null, null],
    [2011, 1500, 'test2' ,null, null ],
    [2012, null, null, 800, 'test3'],
    [2013, null, null, 1000, 'test4']
  ]);

  var options = {
    tooltip: {isHtml: true},
    legend: 'none'
  };
  var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
  chart.draw(dataTable, options);
}
于 2013-09-08T12:11:00.530 に答える