如何將href合並到Google可視化庫JavaScript中？

Question

我正在使用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

Answer 1

有兩種方法可以執行此操作。

HTML工具提示

第一種是將鼠標懸停在欄上時使用html工具提示來顯示URL。

這是最簡單的方法，但這是您的第二選擇。

自定義事件處理程序

為了在單擊圖表項目時發生某些事情，您將需要創建一個自定義事件處理程序。

首先查看條形圖上事件的文檔。 在這種情況下，您將需要使用select事件。

調用select事件時，可以使用getSelection()函數查看正在選擇的數據行。 如果在第三列中有要使用的URL，則可以僅對選定的行使用data.getValue() ，然后根據需要使用javascript打開鏈接。

您可以根據自己的喜好進行配置，但這應該使您能夠正確地進行設置。