【发布时间】:2016-05-03 06:05:35
【问题描述】:
google.charts.load('current', { packages: ['corechart', 'line'] });
function DrawChart(){
var data = new google.visualization.DataTable();
data.addColumn('number', 'X');
data.addColumn('number', '%97');
data.addColumn('number', '%85');
data.addColumn('number', '%50');
data.addColumn('number', '%15');
data.addColumn('number', '%3');
data.addColumn('number', 'Points');
data.addColumn({ type: 'string', role: 'tooltip', p: { 'html': true } });
data.addRow([1, 10, 8, 7, 4, 3, null, null]);
data.addRow([2, 8, 7, 6, 3, 1, null, null]);
data.addRow([3, 11, 9, 7, 5, 2, null, null]);
data.addRow([4, 12, 8, 6.5, 4, 2, null, null]);
data.addRow([5, 10, 9, 8, 2, 1, null, null]);
data.addRow([1.5, null, null, null, null, null, 8, '<b style=color:red>tooltip</b>']);
data.addRow([2.7, null, null, null, null, null, 3, '<b style=color:green>tooltip</b>']);
data.addRow([5.2, null, null, null, null, null, 2, '<b style=color:blue>tooltip</b>']);
var options = {
explorer: {
actions: ['dragToZoom', 'rightClickToReset'],
keepInBounds: true,
},
crosshair: {
color: '#330066',
trigger: 'selection'
},
tooltip: {
isHtml: true,
},
colors: ['#ff2727', '#ffcc00', '#2c962c', '#ffcc00', '#ff2727', '#000000'],
series: {
5: {
lineWidth: 1,
pointSize: 4,
visibleInLegend: false,
enableInteractivity: true
}
},
// enableInteractivity: false,
pointSize: 0,
lineWidth: 1,
};
var chart = new window.google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
};
<script src="https://www.gstatic.com/charts/loader.js"></script>
<input type="button" value="Draw Chart" onclick="DrawChart()"/>
<div id="chart_div"></div>
我使用的是谷歌折线图,选项如下:
var options = {
explorer: {
actions: ['dragToZoom', 'rightClickToReset'],
keepInBounds: true,
},
crosshair: {
color: '#330066',
trigger: 'selection'
},
tooltip: {
isHtml: true,
},
series = {
7: {
lineWidth: 1,
pointSize: 3,
visibleInLegend: false,
}
},
pointSize: 0,
lineWidth: 1,
};
我尝试从特定系列中删除自动工具提示, 我看到了Remove hover tooltip from Google Visualization pie chart (core chart) 的问题,但答案不适合我,我无法设置:
enableInteractivity = false
因为我不想禁用系列选择。
你能帮忙吗?
【问题讨论】:
-
请在 jsfiddle.net 中提供您的全部代码
-
我尝试简化我的代码,请参阅附加的 jsfiddle.net,如果我设置 enableInteractivity: false 工具提示隐藏,但系列选择操作被阻止。
标签: javascript charts google-visualization