如何在fabric js中添加图像组

Question

在选择对象的组织js中，即组我想在该组上添加交叉图标图像。请帮助它如何实现..

             <script>        
           canvas.on('object:selected', function (e) {
           var activeobject = e.target; //active element is group in which i want to add image
           var imgs = fabric.Image.fromURL('images/delete.png', function (oImg)  {

           oImg.scale(0.5).setFlipX(true);

                                });
            activeobject.push(imgs);//here .push is giving errpr that it is not a function

}）;

Answer 1

问题您想在哪里添加图片。 要在select上添加图像，可以按照以下示例进行操作：

＆＃13;

＆＃13;

 var canvas = new fabric.Canvas('canvas');
var rect = new fabric.Rect({width: 100, height: 200, fill:'blue', top:10, left: 10});
var rect2 = new fabric.Rect({width: 100, height: 20, fill:'green', top:90, left: 80});
var group = new fabric.Group([rect, rect2]);
canvas.add(group);
canvas.on('object:selected', function (e) {
var obj = e.target;
fabric.Image.fromURL('http://cdn3.iconfinder.com/data/icons/musthave/256/Remove.png', function (oImg)  {
    oImg.scale(0.2);
    obj.addWithUpdate(oImg);
    canvas.renderAll();
});
});

＆＃13;

<script src="http://fabricjs.com/lib/fabric.js"></script>
<canvas id='canvas' width="400" height="400" style="border:#000 1px solid;"></canvas>

＆＃13;

＆＃13;

＆＃13;

问题是图像定位。 你想在哪里出现这张图片？