Javascript fabric.js中路径为的边界框错误

Javascript fabric.js中路径为的边界框错误,javascript,html5-canvas,fabricjs,Javascript,Html5 Canvas,Fabricjs,我有一个心的路径(下图),但是当我用fabric.js在画布上绘制它时,边界框没有正确显示。即使使用setCoords(),也会发生这种情况。此外,当我将对象导出到svg时,心脏的位置位于边界框的顶部,而不是它在画布上显示的位置 var path = new fabric.Path("M248.078,5.883c-36.691-14.739-77.771-0.839-98.517,31.125C128.817,5.044,87.735-8.856,51.043,5.883 C9.354,22.

我有一个心的路径(下图),但是当我用
fabric.js
在画布上绘制它时,边界框没有正确显示。即使使用
setCoords()
,也会发生这种情况。此外,当我将对象导出到svg时,心脏的位置位于边界框的顶部,而不是它在画布上显示的位置

var path = new fabric.Path("M248.078,5.883c-36.691-14.739-77.771-0.839-98.517,31.125C128.817,5.044,87.735-8.856,51.043,5.883 C9.354,22.632-10.863,70.009,5.887,111.696c16.06,39.98,143.314,139.607,143.314,139.607l0.359,0.28l0.36-0.28 c0,0,127.251-99.627,143.314-139.607C309.986,70.009,289.768,22.632,248.078,5.883z");
这座桥

有人知道如何解决这个问题吗,这是一个bug吗


谢谢

它与路径的坐标有关。让我们做一个简单的例子

蓝色三角形由绝对坐标和选择(如果合适)定义

它是用塑料制成的

canvas = new fabric.Canvas('myCanvas', { selection: false });
var path = new fabric.Path('M 0 0  L 0 100 L 100  100 Z');
path.set({ left: 20, top: 0, fill: 'blue', });
canvas.add(path);
canvas.renderAll();
如果我们采用绿色三角形的相对坐标,则选择不再正确地围绕对象

canvas = new fabric.Canvas('myCanvas', { selection: false });
var path = new fabric.Path('M 20 20  l 0 100 l 100 0 Z');
path.set({ left: 20, top: 0, fill: 'green', });
canvas.add(path);
canvas.renderAll();

因此,如果我们用另一个(从维基百科抄袭而来)来代替心脏,它就会起作用

canvas = new fabric.Canvas('myCanvas', { selection: false });
var path = new fabric.Path('M 272.70141,238.71731 \
    C 206.46141,238.71731 152.70146,292.4773 152.70146,358.71731  \
    C 152.70146,493.47282 288.63461,528.80461 381.26391,662.02535 \
    C 468.83815,529.62199 609.82641,489.17075 609.82641,358.71731 \
    C 609.82641,292.47731 556.06651,238.7173 489.82641,238.71731  \
    C 441.77851,238.71731 400.42481,267.08774 381.26391,307.90481 \
    C 362.10311,267.08773 320.74941,238.7173 272.70141,238.71731  \
    z ');    
var scale = 100 / path.width;
path.set({ left: 20, top: 0, scaleX: scale, scaleY: scale,  fill: 'red', });
canvas.add(path);
canvas.renderAll();