相关疑难解决方法(0)

SVG捕获鼠标坐标

我之前已经在这里询问过有关svg鼠标坐标的问题,但是我对我正在经历的当前行为感到非常困惑,并且似乎没有任何线程可以解决它.

我用来捕获坐标的方法:

var pt = svg.createSVGPoint();  // Created once for document

function alert_coords(evt) {
    pt.x = evt.clientX;
    pt.y = evt.clientY;

    // The cursor point, translated into svg coordinates
    var cursorpt =  pt.matrixTransform(svg.getScreenCTM().inverse());
    console.log("(" + cursorpt.x + ", " + cursorpt.y + ")");
}
Run Code Online (Sandbox Code Playgroud)

问题在于将鼠标单击坐标转换为用户空间中的svg坐标.我正在使用坐标在屏幕上拖动一个矩形,当光标在svg空间中向右移动时,坐标变得越来越倾斜.为了以简单的方式测试这个,我在全局svg空间中放置了三个矩形(100,500),(500,500),(1000,500)和(1000,200).使用简单的记录功能,我接收的坐标(鼠标不精确的加或减5)是(98,473),(487,470),(969,471),(969,190).正如您可以看到鼠标沿x轴或y轴越远,它变得越不准确.我尝试使用相同的方法捕获鼠标坐标,在小提琴中复制它,但我不能在那里复制它...还有一件事需要注意,可能很重要的是当我记录svg文档时,宽度和height设置为略小于视框值的值,即.给定视框值"0 0 1400 700"时,宽度为1380,高​​度为676.无论如何,这里是小提琴,所有的svg属性都与我的程序中的属性相同.

http://jsfiddle.net/ASLma/11/

javascript svg

10
推荐指数
1
解决办法
6678
查看次数

标签 统计

javascript ×1

svg ×1