Javascript 如何在fabric js中将图像添加到多边形？

当我尝试向多边形对象添加图像时，我正在创建一个具有确定点的多边形。图像不是在多边形中渲染的。它是从画布的起点渲染的。下面是我使用的代码。请告诉我哪里做错了。 谢谢你的帮助！谢谢

JSFIDLE链路 添加点并创建多边形，然后添加纹理

        fabric.Image.fromURL('https://image.freepik.com/free-photo/roof-texture_21206171.jpg', function (oImg)  {
        for(var i=0;canvas.getObjects().length>i;i++)
        {
            if(canvas.getObjects()[i].name=="Polygon")
            {   
                    canvas.getObjects()[i].set(oImg);
            }
        }
        canvas.renderAll();
        });

我知道答案了

fabric.Image.fromURL('https://image.freepik.com/free-photo/roof-texture_21206171.jpg', function (img)  {
            var patternSourceCanvas = new fabric.StaticCanvas();
            patternSourceCanvas.add(img);
            var pattern = new fabric.Pattern({
              source: function() {
                patternSourceCanvas.setDimensions({
                  width: img.getWidth(),
                  height: img.getHeight()
                });
                return patternSourceCanvas.getElement();
              },
            });
            console.log(img);
           for(var i=0;canvas.getObjects().length>i;i++)
            {
                if(canvas.getObjects()[i].name=="Polygon")
                {   
                        canvas.getObjects()[i].set("fill", pattern);
                        canvas.renderAll();
                }
            }
        });

我知道答案了

fabric.Image.fromURL('https://image.freepik.com/free-photo/roof-texture_21206171.jpg', function (img)  {
            var patternSourceCanvas = new fabric.StaticCanvas();
            patternSourceCanvas.add(img);
            var pattern = new fabric.Pattern({
              source: function() {
                patternSourceCanvas.setDimensions({
                  width: img.getWidth(),
                  height: img.getHeight()
                });
                return patternSourceCanvas.getElement();
              },
            });
            console.log(img);
           for(var i=0;canvas.getObjects().length>i;i++)
            {
                if(canvas.getObjects()[i].name=="Polygon")
                {   
                        canvas.getObjects()[i].set("fill", pattern);
                        canvas.renderAll();
                }
            }
        });

---

嗨，Deepak Reddy，请做一把小提琴。请找到JSFIDLE链接嗨，Deepak Reddy，请做一把小提琴。请找到JSFIDLE链接不工作请创建工作项目的小提琴链接以帮助我。请创建工作项目的小提琴链接以帮助我