如何将href纳入谷歌可视化库的JavaScript?

in_ut 发布于 2019-03-09 javascript 最后更新 2019-03-09 14:34 3 浏览

我正在使用Google的可视化库在我的Rails应用程序中绘制图表。我现在的代码是:

    var data = google.visualization.arrayToDataTable([
      ['Phrase', 'Frequency'],
        <% @frequency.each do |key,value| %>
            ['<%= key %>', <%= value %>],
        <% end %>
    ]);
这工作。但是,我想启用一个功能,允许用户点击y轴上的值,然后触发一个事件(例如打开链接)。我尝试了下面的代码,但它不起作用。有关如何将href整合到上面的js代码片段中的任何建议?
    var data = google.visualization.arrayToDataTable([
      ['Phrase', 'Frequency'],
        <% @frequency.each do |key,value| %>
            [<a href = "#"'<%= key %>'</a>, <%= value %>],
        <% end %>
    ]);
我也打开在显示在图表上的工具提示中包含一个href。 链接到API是:https://developers.google.com/chart/interactive/docs/gallery/barchart
已邀请:

zomnis

赞同来自:

有两种方法可以做到这一点。

HTML工具提示 第一种是使用html tooltips在鼠标悬停栏时显示URL。 这是最简单的方法,但它是您的第二选择。

自定义事件处理程序 要在单击图表项时发生某些事情,您需要创建一个自定义事件处理程序。 首先在条形图上查看events的文档。在这种情况下,您需要使用select事件。 调用select事件时,可以使用getSelection()函数查看正在选择哪一行数据。如果您在第三列中有要使用的URL,则只需对所选行使用data.getValue(),并使用javascript根据需要打开链接。 您可以根据需要对其进行配置,但这应该为您设置正确的路径以便能够找到它。