懸停值標簽上的Google圖表工具提示觸發器

Question

我對Google圖表有疑問。 我有一些大小值的條形圖。 這些條也有一個值標簽。 如果將鼠標懸停在條形圖上，將顯示工具提示。 但是，當我將值標簽懸停在條形圖的內部或外部時，沒有顯示工具提示。 因此，我無法在很小的欄上顯示工具提示。

簡化示例： https : //jsfiddle.net/2d0kbLnm/40/

您知道如何告訴Google圖表在懸浮值標簽時顯示工具提示嗎？

focusTarget: 'category'強制在工具提示上提供我不想要的其他信息。 x軸值（帶有藍色圓點）和y軸標題插入工具提示中。 我可以預防嗎？ 我只想顯示我的html值。 此外，工具提示也會隱藏在值標簽上。

感謝您的幫助和想法。

heiwil

Answer 1

還有一個列角色將在注釋的懸停時顯示其他文本，
它是-> role: 'annotationText'

它不一定是工具提示，也不會顯示html，
但是當懸停注釋時確實會出現。

這是唯一可用的“標准”選項。

請參閱以下工作片段，
在數據視圖計算列中添加了'annotationText' ，
因此內容可以動態構建。
將鼠標懸停在注釋上即可查看結果。

 google.charts.load('current', { packages: ['corechart'] }).then(function () { var data = google.visualization.arrayToDataTable([ ['Element', 'Saldo', {role: 'style', type: 'string'}, {role: 'annotation', type: 'string'}], ['Element 1', 60000.15, '#3949AB', '60,000.15 CHF'], ['Element 2', 14.87, '#3D5AFE', '14.87 EUR'], ['Element 3', -13451.31, '#cc0000', '-13,451.31 EUR'], ['Element 4', 0, '#42A5F5', '0 CHF'] ]); var view = new google.visualization.DataView(data); view.setColumns([0, 1, 2, 3, { calc: function (dt, row) { return dt.getValue(row, 0) + ' - ' + dt.getColumnLabel(1) + ': ' + dt.getFormattedValue(row, 1); }, role: 'annotationText', type: 'string' }]); var options = { legend: { position: 'none' }, hAxis: { logscale: true }, vAxis: { gridlines: { color: 'transparent' }, textPosition: 'none' } }; var chart = new google.visualization.ColumnChart( document.getElementById('chart_div') ); chart.draw(view, options); // <-- use view to draw chart }); 

 <script src="https://www.gstatic.com/charts/loader.js"></script> <div id="chart_div"></div>