Javascript 当我画一个有孔的多边形时，圆不是'；t在正确的位置

我想画一个带孔的多边形，我的方法是先画多边形，然后画圆，然后把它们分组，结果是效果不错，但圆的位置不对。这是我的函数（这是画多边形）

/**
*XJ于2017年9月13日创建。
*/
var polyWithHole=假；
var polyWithHoleMode=假；
var polyWithHoleGroup；
prototypefabric.polyWithHole={
drawPolyWithHole:函数（）{
polyWithHoleMode=真；
pointArray=新数组（）；
lineArray=新数组（）；
活性线；
},
addPoint：函数（选项）{
var random=Math.floor（Math.random（）*（max-min+1））+min；
var id=new Date（）.getTime（）+random；
var circle=新结构。circle({
半径：5，
填写：“#ffffff”，
笔画：'#333333'，
冲程宽度：0.5，
左：（options.e.layerX/canvas.getZoom（）），
顶部：（options.e.layerY/canvas.getZoom（）），
可选：false，
哈斯：错，
哈斯：错，
原文：'中心'，
原文：'中心'，
id:id
});
if（pointArray.length==0）{
圆集({
填充：“红色”
})
}
变量点=[（options.e.layerX/canvas.getZoom（）），（options.e.layerY/canvas.getZoom（）），（options.e.layerX/canvas.getZoom（）），（options.e.layerY/canvas.getZoom（））；
线=新织物。线（点{
冲程宽度：2，
填写：“#999999”，
笔划：“#999999”，
类别：'行'，
原文：'中心'，
原文：'中心'，
可选：false，
哈斯：错，
哈斯：错，
事件：错误
});
if（activeShape）{
var pos=canvas.getPointer（options.e）；
var points=activeShape.get（“点”）；
//console.log（点+“Lpointsin”）
点。推({
x:pos.x，
y:位置y
});
var polygon=新结构。多边形（点{
笔画：'#333333'，
冲程宽度：1，
填写：“#中交”，
不透明度：0.1，
可选：false，
哈斯：错，
哈斯：错，
事件：错误
});
canvas.remove（activeShape）；
canvas.add（多边形）；
活动形状=多边形；
canvas.renderAll（）；
}
否则{
var polyPoint=[{x:（options.e.layerX/canvas.getZoom（）），y:（options.e.layerY/canvas.getZoom（））}]；
var polygon=新结构。多边形（多点{
笔画：'#333333'，
冲程宽度：1，
填写：“#中交”，
不透明度：0.1，
可选：false，
哈斯：错，
哈斯：错，
事件：错误
});
活动形状=多边形；
canvas.add（多边形）；
}
活动线=线；
点阵列。推（圆）；
直线排列。推（线）；
canvas.add（行）；
canvas.add（圆圈）；
canvas.selection=false；
},
generatePolyWithHole:函数（pointArray）{
var points=新数组（）；
$.each（点数组、函数（索引、点）{
点。推({
x:左点，
y:point.top
});
画布。移除（点）；
});
$.each（线性阵列，函数（索引，行）{
画布。删除（行）；
});
canvas.remove（activeShape）.remove（activeLine）；
var polygon=新结构。多边形（点{
笔画：'#333333'，
冲程宽度：0.5，
填写：“#ccc”，
不透明度：1，
可选：false，
哈斯：错，
hasControls:false
});
polyWithHoleGroup=新结构组（[多边形]{
//笔画：'#333333'，
//冲程宽度：0.5，
//填充：“红色”，
//不透明度：1，
//可选：false，
//哈斯：错，
//hasControls:false
原文：“中心”，
原创：“中心”
//左：'左'，
//top:‘top’
});
polyWithHoleGroupLeft=polyWithHoleGroupLeft；
polyWithHoleGroupTop=polyWithHoleGroup.top；
//console.log（polyWithHoleGroup.left+“；”+polyWithHoleGroup.top）
canvas.add（polyWithHoleGroup）；
多克隆模式=假；
activeLine=null；
activeShape=null；
polyWithHoleMode=false；//停止绘制PolyWithHole
polyWithHole=true；//添加C和P
}
};请包含HTML代码或尝试将代码放入jsfiddle请包含HTML代码或尝试将代码放入jsfiddle