我正在尝试在移动应用程序中实现 highcharts，一切正常，但是有一个问题是，在将方向从纵向更改为横向时，为所选任何点显示的工具提示不会在方向更改时隐藏。
请建议我如何在 highcharts 中以编程方式隐藏工具提示..
我尝试了以下代码：
$('#tankActualUsagechart').highcharts().tooltip.hide();
但这并没有隐藏我正在显示的标记......
如果有办法隐藏标记我也很好..
请帮我解决这个问题
问问题
23548 次
12 回答
6
于 2013-07-12T10:20:15.503 回答
4
只要您有对 Highcharts Chart 对象的引用，您就可以像这样隐藏工具提示：
// create chart
var myChart = new Highcharts.Chart({ /* snip */ });
// hide tooltip
myChart.tooltip.hide();
于 2014-01-08T06:08:54.330 回答
2
您必须提供格式化程序功能。诀窍是当您不想显示任何内容时返回 false
这是一个小测试
HTML 页面 -
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
<button id='toggleTooltip'>Toggle tooltip</button>
JS代码 -
$(function () {
$('#container').highcharts({
title: {
text: 'tooltip enabled is set to false'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}, {
data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4]
}]
});
$('#toggleTooltip').click(function () {
var tooltipOptions = $('#container').highcharts().tooltip.options;
if ($(this).hasClass('enabled')) {
tooltipOptions.formatter = null;
$(this).removeClass('enabled');
} else {
tooltipOptions.formatter = function () {
return false;
}
$(this).addClass('enabled');
}
});
});
在这里观看直播
于 2015-02-28T04:53:16.583 回答
2
我浏览了很多论坛，但没有找到非常简单的方法来显示/隐藏工具提示，如 tooltip.enable = true/false。我想到的一个好方法是在图表的初始化中通过 Formatter 设置工具提示设置。
var barShowen - 是一个具有必要状态的全局变量 - true/false - 是否显示工具提示。
此示例将在 2014 年 12 月开始后在我的项目 www.tanks-vs.com 中运行。您可以看到。
tooltip: {
shared: true,
useHTML: true,
formatter: function() {
if (barsShowen) {
var s = '<span><b>' + this.x + '</b></span><table>';
$.each(this.points, function () {
s += '<tr><td align = "left" style = "color:' + this.series.color + ';">' + this.series.name + ': ' +'</td>' +
'<td><b>'+ this.y +'</b></td></tr>' ;
});
return s+'</table>';
} else {
return false;
}
}
于 2014-11-28T10:26:27.490 回答
1
您需要设置该标记/点默认状态。
像这样的东西：
chart.series[0].data[index_of_tooltip_point].setState("");
于 2013-07-12T10:50:29.563 回答
1
尝试并使用以下代码：
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
plotOptions: {
series: {
events: {
click: function(e) {
enabledTooltip();
}
}
}
},
tooltip: {
crosshairs: [{
dashStyle: "Solid"
}, false],
enabled: false
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]
});
var enabledTooltip = function(){
alert(567);
var options = chart.options;
options.tooltip.enabled = true;
chart = new Highcharts.Chart(options);
};
});
希望这对你有用
于 2013-08-23T12:31:44.260 回答
1
我用它chart.pointer.reset()来删除标记和工具提示legendItemClick，它就像一个魅力
于 2017-04-04T05:52:09.757 回答
0
这很笨拙，但符合我的目的
$(document).ready(function(){
$('.highcharts-container text:last').hide()
})
于 2015-09-05T19:32:11.727 回答
0
如果您在运行时需要，请尝试此操作。
chart.tooltip.hide();
它对我有用 http://forum.highcharts.com/highcharts-usage/tooltip-how-to-show-hide-tooltips-onblur-t5926/
于 2016-06-11T08:00:00.417 回答
0
您可以使用更新功能
var mychart = $('#container').highcharts();
对于禁用工具提示：
mychart.update({tooltip: {enabled: false}});
对于启用工具提示：
mychart.update({tooltip: {enabled: true}});
检查这个jsfiddle：
于 2019-05-29T17:59:28.727 回答
-1
于 2013-07-12T10:17:48.827 回答
-1
您可以使用该chart.myTooltip.destroy()方法手动删除工具提示。例如：
var myChart = new Highcharts.Chart({ /* ... */ });
myChart.myTooltip.destroy();
这将删除当前实例，并在下次您将鼠标悬停在某个点上时重新出现（或用户为显示工具提示而采取的任何操作）。
于 2017-04-25T18:02:07.887 回答