highcharts - 悬停时向 Highcharts 中的图例添加工具提示

Question

我想让用户知道，他只需单击即可从图例中删除项目。对于某些人来说，这可能很直观，但其他人可能不知道他们可以做到这一点。我想让用户知道他们何时超过图例项目，然后可以单击将其删除。

我正在使用 GWT 包装类来处理 Highcharts 。

谢谢。

Answer 1

Highcharts 没有用于项目图例的内置工具提示，但您仍然可以为此创建自己的工具提示。向 legendItem 添加自定义事件(例如鼠标悬停和鼠标移出)并显示该工具提示非常简单。

查看如何向 Highcharts 中的元素添加事件的示例:http://jsfiddle.net/rAsRP/129/

        events: {
            load: function () {
                var chart = this,
                    legend = chart.legend;

                for (var i = 0, len = legend.allItems.length; i < len; i++) {
                    (function(i) {
                        var item = legend.allItems[i].legendItem;
                        item.on('mouseover', function (e) {
                            //show custom tooltip here
                            console.log("mouseover" + i);
                        }).on('mouseout', function (e) {
                            //hide tooltip
                            console.log("mouseout" + i);
                        });
                    })(i);
                }

            }
        }