首页 > javascript > 如何在饼图工具提示中显示特定类别的自定义文本

如何在饼图工具提示中显示特定类别的自定义文本 (How to display custom text for a specific category in pie chart tool tip)

问题

我有一个饼图,我想在用户将鼠标悬停在该类别上时专门为特定类别显示自定义文本。

JS Fiddle Link:https//jsfiddle.net/mewohraz/1/

tooltip: {
    pointFormat: '{point.custom} (point.category == 'Internet Explorer) ? 'display customtext'
},

例如,当用户将鼠标悬停在Internet Explorer上时,我想显示版本的项目符号列表。文本将被硬编码,因此它不是来自数据系列。

我该怎么做呢?

解决方法

您可以使用formattertooltip选项的功能来定义自己的文本: tooltip.formatter

tooltip: {
    formatter: function(){
        if(this.point.name == "Internet Explorer")
            return "my custom text" ;
        else
            return '<span style="color: ' + this.point.color + '">' + this.point.name + '</span><br/>' + this.point.custom ;
    }
}

问题

I have a pie chart and I want to display custom text specifically for a specific category when the user hovers over the category.

JS Fiddle Link: https://jsfiddle.net/mewohraz/1/

tooltip: {
    pointFormat: '{point.custom} (point.category == 'Internet Explorer) ? 'display customtext'
},

e.g when the user hovers over Internet Explorer, I want to display a bullet list of versions. The text will be hard coded so it's not coming from data series.

How do I do this?

解决方法

You can user the formatter function of the tooltip option to defined your own text : tooltip.formatter

tooltip: {
    formatter: function(){
        if(this.point.name == "Internet Explorer")
            return "my custom text" ;
        else
            return '<span style="color: ' + this.point.color + '">' + this.point.name + '</span><br/>' + this.point.custom ;
    }
}
相似信息