Question

我是highcharts的新手。默认情况下，Highchart会在图表内部显示工具提示。这是否可以在图表外显示工具提示，并在与用于显示内部相同的位置显示。任何帮助？

Answer 1

您可以定义自己的div，然后使用工具提示格式化程序在其中显示信息。

tooltip: {
        formatter:function(){
            $('#tooltip').html('Point Y: '+this.y);
        }
    },

Answer 2

是的，您可以使用Tooltip.positioner更改它，以下是API的链接：http://api.highcharts.com/highcharts#tooltip

Answer 3

Default tooltip and custom tooltip at the same time

上面是一个示例，您可以在其中显示默认工具提示和自己的自定义工具提示。感谢@Ricardo Lohmann，他展示了如何在以下帖子中创建自定义工具提示：

Highchart - tooltip for legends

// first of all we've to build a group to put the elements
this.SVGElements = this.chartVar.renderer.g().attr({'zIndex': 11}).add();

// build tooltip text
var textContainer = this.chartVar.renderer.text(text, coord[0], coord[1])
                .attr({
                    'zIndex': 10
                })
                .add(this.SVGElements);

// get text 'box'
var box = textContainer.getBBox();

// build  tooltip square according to the text location, then place the container behind the text
this.chartVar.renderer.rect(box.x - 5, box.y - 5, box.width + 10, box.height + 10, 5)
                .attr({
                    'stroke-width': 2,            // border width
                    'stroke': '#a8a8a8',        // border color
                    'zIndex': 9,
                    'fill': 'white',            // background color
                    'fill-opacity': 0.85,        // background opacity
                    'isShadow': true
                })
                .add(this.SVGElements);

Answer 4

tooltip: {
              positioner: function () {
                    return { x: 45, y: 60 };
                }
            }

使用此

HighChart Tooltip位置可以更改吗？

4 个答案: