0

我正在开发 jquery 中一些图形的可视化工具。为此，我正在使用 html5 的新功能：canvas.getContext('2d')，此处解释： https ://developer.mozilla.org/en/Drawing_Graphics_with_Canvas 现在我可以在画布上绘制交互式节点，而无需使用闪存或java。

我遇到的问题是光标相对于该画布的位置。我需要该位置来检查该位置是否在 a 节点的边界之间。

此功能在 eclipse 的浏览器中完美运行，但由于某些奇怪的原因，它在 chrome 或 firefox 中不起作用。经过大量调试后，我发现节点的垂直位置（.y）不正确（因此，当您在 chrome 中的节点下方 20px 或在 Firefox 中的节点下方 50px 时，一切正常）。我可以根据浏览器更改这些数字，但我预计这种解决方案会出现很多问题。

我正在使用 arborjs 库。我不认为问题出在这个库本身，因为这个站点与同一个库和（几乎）相同的使用非常完美。

her 是 arbor.js 文件的最近函数的代码片段，它遍历所有节点并检查点击的位置是否在节点的边界之间。

nearest: function (x) {
                    var original = x;
                    if (u !== null) {
                        x = g.fromScreen(x)
                    }
                    var w = {
                        node: null,
                        point: null
                    };
                    var v = g;
                    $.each(c.nodes, function (B, y) {
                        var z = y._p, pos = g.toScreen(z),
                            width = y.data.width, 
                            height = y.data.height,
                            pos = g.toScreen(z),
                            bound1 = pos.x - width/2,
                            bound2 = pos.x + width/2,
                            bound3 = pos.y - height/2,
                            bound4 = pos.y + height/2;;
                        if (z.x === null || z.y === null) {
                            return
                        }
                        if (bound1 < original.x && original.x < bound2 &&
                            bound3 < original.y && original.y < bound4) {
                            w = {
                                node: y,
                                point: z
                            };
                            if (u !== null) {
                                w.screenPoint = g.toScreen(z)
                            }
                        }
                    });
                    if (w.node) {
                        if (u !== null) {
                            w.distance = g.toScreen(w.node.p).subtract(g.toScreen(x)).magnitude()
                        }
                        return w
                    } else {
                        return null
                    }
                },

这是调用/使用它的节点：

var pos = $(canvas).offset();
_mouseP = arbor.Point(e.pageX-pos.left, e.pageY-pos.top);
selected = particleSystem.nearest(_mouseP);

有人对这类错误有一些经验吗？我希望我充分描述了这个问题。

4

0 回答 0