javascript - 如何同步和显示不同谷歌图表的工具提示？

Question

我正在两个 iframe 上创建不同的谷歌图表以进行比较。为了实现这一点，我需要同步鼠标在两个图表上的单击，并在单击的特定位置显示工具提示。

尽管我已经通过使用 chart_2.setSelection(chart_1.getSelection()); 方法实现了鼠标点击同步。

但是工具提示不会显示在第二个图表的特定位置上:

在第二个图表上显示工具提示的唯一方法是单击该图表，然后激活工具提示:

激活后，工具提示将与第一个图表同步，并且每次点击都能完美运行:

我想要实现的是在第二个图表上显示工具提示，而无需手动激活它，而是在第一个图表上每次单击时都会显示它。

Answer 1

设置以下选项以使工具提示显示在 --> setSelection

var options = {
  tooltip: {
    trigger: 'both'
  }
};

请参阅以下工作片段，
当 'ready' 事件触发时，将进行选择，
演示显示工具提示

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['x', 'y0', 'y1', 'y2', 'y3'],
    [1, 10, 15, 20, 25],
    [2, 12, 18, 24, 30],
    [3, 14, 21, 28, 35],
    [4, 16, 24, 32, 40]
  ]);

  var options = {
    pointSize: 4,
    tooltip: {
      trigger: 'both'
    },
    width: 360
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  google.visualization.events.addListener(chart, 'ready', function () {
    chart.setSelection([{row: 2, column: 1}]);
  });
  chart.draw(data, options);
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>