【问题标题】:How to enable "selected" tooltip on Google Timelines?如何在 Google 时间轴上启用“选定”工具提示?
【发布时间】:2018-04-10 11:44:35
【问题描述】:

我使用 Google Charts API 创建了一个时间线。

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
  google.charts.load("current", {packages:["timeline"]});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {

    var today = new Date();
    var datenow= today.getFullYear()+','+(today.getMonth()+1)+','+today.getDate();
    var container = document.getElementById('example3.1');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn({ type: 'string', id: 'Position' });
    dataTable.addColumn({ type: 'string', id: 'Name' });
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows([
      [ 'Arrgh\'s Era', 'Arrgh\'s Era', new Date(2014, 11, 19), new Date(datenow)],
      [ 'Grand Admiral', 'Ogaden', new Date(2014, 11, 19), new Date(2015, 4, 18) ],
      [ 'Grand Admiral', 'Warpool', new Date(2015, 4, 19), new Date(2015, 5, 18) ],
      [ 'Grand Admiral', 'Ogaden', new Date(2015, 5, 19), new Date(2015, 11, 18) ],
      [ 'Grand Admiral', 'Jacob Hanson', new Date(2015, 11, 19), new Date(2016, 3, 18)],
      [ 'Grand Admiral', 'Ogaden', new Date(2016, 3, 19), new Date(2016, 10, 18)],
      [ 'Grand Admiral', 'DragonK', new Date(2016, 10, 19), new Date(2017, 3, 18)],
      [ 'Grand Admiral', 'Bluebear', new Date(2017, 3, 19), new Date(2017, 9, 18)],
      [ 'Grand Admiral', 'Ripper', new Date(2017, 9, 19), new Date(datenow)],
    ]);

    chart.draw(dataTable);
  }
</script>


  </head>
  <body>
    <div id="example3.1" style="height: 200px;"></div>
  </body>
</html>

The resulting Timeline

我想要实现的是,只有在选择栏时才应该看到工具提示(不悬停)。我尝试在图表options 中使用tooltip: { trigger: 'selection' }。这将导致一个空白页。

我做错了什么?我在 Google Chart API 页面上看到了其他方式,但它们似乎适用于其他图表类型,而不是时间线。

【问题讨论】:

    标签: javascript gwt charts google-visualization timeline


    【解决方案1】:

    时间线图只能设置trigger的值为'focus'或none,默认值为'focus',只能悬停。另一个问题是时间线图的工具提示不是持久的

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-04-03
      • 1970-01-01
      • 2019-07-26
      • 1970-01-01
      • 1970-01-01
      • 2022-08-03
      • 1970-01-01
      • 2014-07-29
      相关资源
      最近更新 更多