チャート用の Google の視覚化ライブラリを使用した以下のコードがあります。現在、selectHandler
列行のアラートを返す関数があります。
列番号のアラートの代わりに、以下に示す項目の「キー」のアラートを送信する Javascript を実装しようとしています。どうすれば入手できますか?
<% @frequency.each do |key,value| %>
['<%= key %>', <%= value %>],
<% end %>
Javascript
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
// OPTIONS
var options = {
title: 'Most common phrases in pro-Microsoft Reviews (<%= @reviews.count %> reviews analyzed)',
vAxis: {title: 'Phrases', titleTextStyle: {color: 'red'}},
tooltip: {isHtml: true},
animation:{
duration: 2000,
easing: 'out',
}
};
// DATA
var data = google.visualization.arrayToDataTable([
['Phrase', 'Frequency'],
<% @frequency.each do |key,value| %>
['<%= key %>', <%= value %>],
<% end %>
]);
// CHART DRAWING
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
//setup listener
google.visualization.events.addListener(chart, 'select', selectHandler);
// The select handler. Call the chart's getSelection() method
function selectHandler() {
var selection = chart.getSelection();
alert('That\'s column no. '+selection[0].row);
}
}
</script>