在饼图的特殊切片上禁用悬停 [英] disable hover on special slice of pie chart

查看:65
本文介绍了在饼图的特殊切片上禁用悬停的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道如何在高图上禁用悬停,并且我编辑答案以禁用hove像这样演示一样,但是它不起作用.

I know how to disable hover on highcharts, and I edit the answer to disable hove on special slice as this demo, but it doesn't work.

我将系列属性编辑如下:

I edit series attribute as the following:

series: [{
  showInLegend: false,
  type: 'pie',
  name: 'Pie Chart',
  data: [
    ['Mobile', 65], // first half of pie
    {
       name: 'Other', 
       y: 35, 
       tooltip: { enabled: false }
    } // second half of pie
  ]

如何使用highcharts禁用饼图上特殊切片的悬停?

How can I disable hover for special slices on pie charts using highcharts ?

推荐答案

您与自定义工具提示属性的想法非常接近.我个人也希望使用自定义名称,因此,与其添加tooltip数据对象,不如使用名为tooltipDisabled的自定义属性:

You were pretty close with your custom tooltip property idea. I personally rather using custom names as well, therefor instead of adding a tooltip data object, i'd use a custom property named tooltipDisabled:

{name: 'Other', y: 35, tooltipDisabled:true} // second half of pie

然后,使用工具提示formatter函数(将鼠标悬停在某个点上时可以完全重写的回调函数),使用该属性来区分这些点:

And then, using a tooltip formatter function (a callback function called when a point is hoverd, which is totally override-able), I'd discriminate the points with this property:

    tooltip: {
        useHTML:true,
        formatter: function(){
            return this.point.tooltipDisabled ? false : this.point.name +"<br><span style='font-size:18px;vertical-align:middle'>&#8226;</span>"+this.series.name+": <b>"+this.y+"</b>";
        }

您可能已经猜到了

返回false会禁用工具提示. (如您所见,我还添加了useHTML:true,因此高点图在点名称旁边显示了项目符号.

returning false, as you have probably guessed, disables the tooltip. (as you can see I also added useHTML:true, so highcharts renders the bullet next to the point name.

请参阅小提琴: http://jsfiddle.net/e7brd9do/2/

这篇关于在饼图的特殊切片上禁用悬停的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆