Javascript Firefox在SVG路径中使用浮点坐标

我正在使用Raphael.js用JavaScript编写一个类似的东西。 笔刷笔划是通过路径实现的：每次鼠标移动时，一个新的字符串（如“lx，y”）会附加到“当前”路径

例如，如果我点击并晃动一下，这就是我在Chrome中得到的结果：

<path style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-linejoin: round; stroke-linecap: round;" fill="none" stroke="#000000" d="M173,326L173,326L175,325L180,322L186,318L195,312L204,303L213,294L219,285L221,283L224,281L225,280L226,280L229,280L232,280L238,282L243,288L250,296L256,305L263,311L268,316L272,318L273,318L276,318L278,318L281,318L286,316L294,309L300,301L307,292L314,281L321,272L326,265L328,261L329,257L332,251L333,249L334,249L335,248L337,248L339,248L342,249L346,252L351,256L356,260L360,262L364,264L368,264L370,265L374,265L377,264L380,262L387,257L394,251L403,245L411,235L420,226L429,217L437,208L446,202L453,200L461,198L466,198L470,198L472,198L474,199L477,202L478,205L479,209L483,214L487,219L491,221L494,225L498,226L502,226L505,226L506,226L508,226L509,226L510,226" stroke-width="30" stroke-linejoin="round" stroke-linecap="round"></path>

编辑：

我将计算鼠标坐标的代码更改为：

var newx = Math.round(e.pageX - $(this).offset().left);
var newy = Math.round(e.pageY - $(this).offset().top);

---

现在Firefox对两个坐标也使用整数。但是，性能问题仍然存在！任何想法都值得赞赏。

我非常确定SVG应该为您提供所有的浮动。如果你从Chrome上得到整数，那一定是某种优化，他们正在进行。。真奇怪。基于任何证据的随机想法-您的viewbox 1:1是svg画布还是路径上有转换？[嗯，对不起，我删除了最后一条评论，我认为我错了，但我没有]我不知道，我使用的是Raphael，元素。path（）方法实际上是从事件对象和文档滚动位置获取坐标，看起来。。。所以svg不是这些坐标的来源。。。我建议将问题标题更新为更具描述性的内容。

$('#canvas_container').mousemove(function(e){
    var newx = e.pageX - $(document).scrollLeft() - $('#canvas_container').offset().left;
    var newy = e.pageY - $(document).scrollTop() - $('#canvas_container').offset().top;

    [...]

    if (brushing) {
      brush_current_stroke.attr({
        'path': [brush_current_stroke.attr('path'), 'L', newx, ' ', newy].join('')
      });
    }

    oldx = newx;
    oldy = newy;
  });

var newx = Math.round(e.pageX - $(this).offset().left);
var newy = Math.round(e.pageY - $(this).offset().top);