Raphael Path在Firefox中疯狂

时间:2015-12-17 16:29:27

标签: javascript jquery firefox path raphael

我正在开发一个制作区域和绊网的工具,并且我正在与Raphael JS合作。问题是我想建立一条恐怖的路径而且我认为我得到了它,至少在Chrome中,因为在Firefox中它变得疯狂。

我的意思是疯狂的是点的位置与光标的实际位置不对应(我重复一遍,仅在Firefox中)。

你在这里做了一个小提琴。

http://jsfiddle.net/6dd2870b/4/

关于为什么会发生这种情况的任何想法?

提前谢谢。

小提琴的javascript代码是:

var canvas = document.getElementById('canvas'),
    paper = new Raphael(canvas, canvas.height, canvas.width),
    mousedown = false,
    lastX, lastY, path, pathString, pathAux, pointsAux = [];    


$(canvas).mousedown(function (e) {
   var x = e.offsetX,
       y = e.offsetY;

    if (!mousedown) {
        pathString = 'M ' + x + ' ' + y + ' ';
        mousedown = true;
    } else {
        pathString += 'l ' + (x - lastX) + ' ' + (y - lastY) + ' ';
    }

    pointsAux.push({x: x, y: y});

    path = paper.circle(x,y,9);

    path = paper.path(pathString);   

    lastX = x;
    lastY = y;
});

$(canvas).mousemove(function (e) {

    if (!mousedown) {
       return;
    }

    var x = e.offsetX,
        y = e.offsetY;
    pathAux = pathString +  'l ' + (x - lastX) + ' ' + (y - lastY);
    path.attr('path', pathAux);
});

$('#finish').click(function (e) {

    if ($('#type').val() != 1) {
        pathAux = pathString +  ' z';
        path.attr('path', pathAux);
    } else {
        path.attr('path', pathString);
    }
    mousedown = false;

 });

 $('#cancel').click(function (e) {
     paper.clear();  
     mousedown = false;
  });

0 个答案:

没有答案