g.raphael js（graphaeljs），line，hoverColumn问题

Question

我正在使用gRaphael JS lib绘制折线图。 和haverColumn函数有一些问题。 这是我简化的hoverColumn函数。

var line = raphael.g.linechart(50, 20, 650, 120, xAry, yAry, options).hoverColumn(function (){
    ...
    console.log(this.x+","+this.y);
    ....
}

当鼠标悬停在图表上时， 调用hoverColumn函数，并执行日志功能。 但是，某些区域不会调用hoverColumn函数。

所以，我使用firebug进行调试，我找到了原因。 折线图上有一些大的矩形区域， 当鼠标在该区域时，hoverColumn不会被调用 鼠标位于图表的列上。

这是一张有助于理解的捕获图像。 火虫和直肠。

当我使用firebug手动移除rect时， hoverColumn函数效果很好〜-_-;

区号由gRaphael-js自动生成。

那么，有什么方法可以解决这个问题吗？ 请问〜

Answer 1

我终于找到了解决方案（需要1天的黑客攻击... = _ =;）。 问题出在g.line.js，graphael js库。

在源代码中， 有一个像这样的createColumns函数，

function createColumns(f) {
        // unite Xs together
        var Xs = [];
        for (var i = 0, ii = valuesx.length; i < ii; i++) {
            Xs = Xs.concat(valuesx[i]);
        }
        Xs.sort();
        ....
        ...
        ..
}

问题是排序功能。 Xs.sort（）对x值进行排序，但该函数返回带有错误的已排序数组。 所以，如果输入数组是，

valuesx = [0.05076044713698533, 9.579202857778233, 10.93181619059174];
valuesx.sort();

结果是

[0.05076044713698533, 10.93181619059174, 9.579202857778233]
not
[0.05076044713698533, 9.579202857778233, 10.93181619059174]

结果，列被破坏了〜

所以，我改变了排序函数Xs.sort（），如下所示：

Xs.sort(function(a, b){
            return a - b;
        });

效果很好〜^^; 希望这有帮助〜