Question

我需要检索Raphael绘制的路径末端的X / Y坐标。我已经找到了一种方法，通过在SVG浏览器中反省内部路径，但这种方法在VML浏览器中不起作用。

示例：

var paper = Raphael('canvas', 200, 200);
var p = paper.path(['M', 10, 10, 'l', 30, 30, 'a', 20, 30, 0, 1, 0, 40, 10, 'a', 20, 30, 0, 1, 0, 40, 10, 'l', -15, -18]);
var lastP = p.attrs.path[p.attrs.path.length - 1];
paper.circle(lastP[lastP.length - 2], lastP[lastP.length - 1], 3);

http://jsfiddle.net/sY4Up/1/

在Chrome中，通过路径内省在端点处绘制圆圈。在IE 6/7/8中，圆圈不会绘制，因为路径定义没有被分解/标准化。

Answer 1

使用getPointAtLength和getTotalLength来找到位置。

window.onload = function() {
var paper = Raphael('canvas', 200, 200);
var p = paper.path(['M', 10, 10, 'l', 30, 30, 'a', 20, 30, 0, 1, 0, 40, 10, 'a', 20, 30, 0, 1, 0, 40, 10, 'l', -15, -18]);
var lastP = p.attrs.path[p.attrs.path.length - 1];
paper.circle(lastP[lastP.length - 2], lastP[lastP.length - 1], 3);

var pt = p.getPointAtLength(p.getTotalLength());
paper.circle(pt.x,pt.y,10);

};

拉斐尔路径终点的X / Y位置

1 个答案: