如何以编程方式隐藏highcharts中的工具提示？

我正在尝试在移动应用程序中实现高级图表，一切正常但有一个问题，即在从potrait更改方向到横向时，为所选的任何点显示的工具提示不会隐藏方向更改。

请建议我如何在highcharts中以编程方式隐藏工具提示..

我尝试了下面的代码：

$('#tankActualUsagechart').highcharts().tooltip.hide();

但这并没有隐藏我正在显示的标记……

如果有办法隐藏标记我也很好..

请帮我解决这个问题

Answer 1

请看http://jsfiddle.net/St84H/

你可以隐藏工具提示

 tooltip: { enabled: false } 

Answer 2

只要您有对Highcharts Chart对象的引用，就可以隐藏工具提示，如下所示：

 // create chart var myChart = new Highcharts.Chart({ /* snip */ }); // hide tooltip myChart.tooltip.hide(); 

Answer 3

你必须提供格式化function。 诀窍是当你不想显示任何东西时返回false

这是一个小测试

HTML页面 –

  
 Toggle tooltip 

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'); } }); }); 

看到这里住

Answer 4

我浏览了很多论坛，无处可查，显示/隐藏工具提示非常简单，如tooltip.enable = true / false。 我得到的好方法是在图表初始化中通过Formatter设置工具提示设置。

var barsShowen – 是一个具有必要状态的全局变量 – true / false – 是否显示工具提示。

这个例子将在2014年12月初之后在我的项目www.tanks-vs.com中使用。你可以看到。

 tooltip: { shared: true, useHTML: true, formatter: function() { if (barsShowen) { var s = '' + this.x + ''; $.each(this.points, function () { s += '' + '' ; }); return s+'
' + this.series.name + ': ' +'
'+ this.y +'
'; } else { return false; } } 

Answer 5

您需要设置标记/点默认状态。

像这样的东西：

 chart.series[0].data[index_of_tooltip_point].setState(""); 

Answer 6

尝试使用以下代码：

 $(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); }; }); 

希望这对你有用

Answer 7

这是jenky但是符合我的目的

 $(document).ready(function(){ $('.highcharts-container text:last').hide() }) 

Answer 8

如果您在运行时需要，请尝试此操作。

chart.tooltip.hide（）;

它对我有用http://forum.highcharts.com/highcharts-usage/tooltip-how-to-show-hide-tooltips-onblur-t5926/

Answer 9

我使用chart.pointer.reset()在legendItemClick期间删除标记和工具提示，它就像一个魅力

jsfiddle样本

Answer 10

尝试使用false enabled选项，例如：

 tooltip: { enabled: false, } 

试试这个FIDDLE

Answer 11

您可以使用chart.myTooltip.destroy()方法手动删除工具提示。 例如：

 var myChart = new Highcharts.Chart({ /* ... */ }); myChart.myTooltip.destroy(); 

这将删除当前实例，并在下次将鼠标hover在一个点上时（或用户显示工具提示所采取的任何操作）重新出现。