谷歌图表获得了行悬停

时间:2018-03-16 11:48:06

标签: javascript charts google-visualization

在获取用户将鼠标悬停在条形图上的事件(onmouseover)时,我遇到了问题。它通过的项目与在控制台上打印的项目不同。这是因为它使用了图表中的索引,并且它不等于项目在数据表中的顺序。有什么想法吗?

我将代码留在下面。

function drawChart() {
//var data = google.visualization.arrayToDataTable(dataToHistogram(response));
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({'type': 'string', 'role': 'tooltip', 'p': {'html': true}});
dataTable.addColumn({ type: 'number', id: 'precio' });


for (var i = datos.length - 1; i >= 0; i--) {
  dataTable.addRow(["<strike>"+datos[i].titulo+"</strike>", datos[i].valor]);
}


var options = {
  title: '',
  legend: { position: 'none' },
  bar: {groupWidth : 20},
  width: 1200,
  series: [
    {color: '#007d00', visibleInLegend: true}, {}, {},
  ],
  isStacked: 'absolute',
  tooltip:{isHtml: true}
};

var chart = new google.visualization.Histogram(document.getElementById('chart_div'));
chart.draw(dataTable, options);


google.visualization.events.addListener(chart, 'onmouseover', function(e) {
    setTooltipContent(dataTable,e.row);
    //setTooltipContent(dataTable,e.row);
});
    function setTooltipContent(dataTable,row) {
if (row != null) {
      console.log(dataTable.getValue(row, 0));
  }}}

JSFiddle

0 个答案:

没有答案