2

使用触摸时，我遇到了自由线（Raphael）路径的问题。当我徒手画东西时，有时一条直线会在收费线停止并连接到拉斐尔纸的中心点之前突出。有人遇到过这个问题吗？我附上了我所面对的屏幕截图，我用红色标记了连接到拉斐尔纸中心的不需要的线。

更新：创建jsfiddle

更新 2：注意到这个问题发生在 android 浏览器中，当绘图需要很长时间时。即使我只是在画布上触摸几秒钟，触摸点也会通过创建一条线连接到中心，发生这种情况时屏幕会闪烁。所以，我认为它在触摸几秒钟时与触摸事件有关。

在此处输入图像描述

var board = $("#board");
board.bind("mousedown", _mousedownHandler);
        board.bind("touchstart", _mousedownHandler);
function _drawFreeLineBegin(x, y) {
        board.lineEl.path = _drawOptions.paper.path("M"
                + (x - _drawOptions.offset.left) + ","
                + (y - _drawOptions.offset.top));
        _setNewElementProperties(board.lineEl.path,
                Configuration.getProperties("freeLine"));
            board.bind("mousemove.mmu", _mousemoveHandler);
        board.one("mouseup.mmu", _mouseupHandler);
        board.bind("touchmove.mmu", _mousemoveHandler);
        board.one("touchend.mmu", _mouseupHandler);
    }
function _mousedownHandler(event) {
if(event.type == "touchstart"){
            event = event.originalEvent.touches\[0\];
        }
_drawFreeLineBegin(event.pageX, event.pageY);
return false;
}

    function _mousemoveHandler(event) {
    if(event.type == "touchmove"){
            event = event.originalEvent.touches\[0\];
        }
    board.lineEl.path
                        .attr(
                                "path",
                                board.lineEl.path.attr("path")
                                        + "L"
                                        + (event.pageX - )
                                        + ","
                                        + (event.pageY ));
                return true;

}

function _mouseupHandler(event) {
board.unbind(".mmu");
 board.lineEl.path = null;
    event.stopPropagation();
    event.preventDefault();
}
4

0 回答 0