Question

我想在mouseover事件中添加每个dataLabel（只是称它为“highlightPoint（）”）函数。如果我将此功能添加到单个点，它可以工作。

chartObj.series[0].data[1].dataLabel.on("mouseover", function () {
                chartObj.series[0].data[1].setState('hover');
            });

如果我循环扔掉我的数据点，它就不起作用。我想每个点的引用都是不正确的或类似的。

jsfiddle-link

Answer 1

在遍历两个数据集之后，i = 2且k = 1.因此鼠标事件总是尝试使用i = 2和k = 1来访问数据点，这当然是超出范围的。看到这个小提琴：http://jsfiddle.net/bLvfS/1/

for (var i = 0; i < chartObj.series.length; i++) {
    for (var k = 0; k < chartObj.series[i].data.length; k++) {
        var onmouseover = function(u, j) {
            return function() {chartObj.series[u].data[j].setState('hover');};
        }
        var onmouseout = function(u, j) {
            return function() {chartObj.series[u].data[j].setState();};
        }
        chartObj.series[i].data[k].dataLabel.on("mouseover", onmouseover(i,k));
        chartObj.series[i].data[k].dataLabel.on("mouseout", onmouseout(i,k));
    }
}

我添加了传递当前i，k对的函数，并返回要在鼠标事件上运行的实际函数。也许某人有更好的解决方案......但似乎有效。

Answer 2

问题在于闭包，请参阅工作小提琴：http://jsfiddle.net/Fusher/bLvfS/2/

        for (var i = 0; i < chartObj.series.length; i++) {
            for (var k = 0; k < chartObj.series[i].data.length; k++) {
                (function(i,k){
                    chartObj.series[i].data[k].dataLabel.on("mouseover", function () {
                        chartObj.series[i].data[k].setState('hover');
                    });
                    chartObj.series[i].data[k].dataLabel.on("mouseout", function () {
                        chartObj.series[i].data[k].setState();
                    });
                })(i,k);
            }
        }

在mouseover / mouseout上添加每个dataLabel函数

2 个答案: