织物js设置背景组图像和文本

Question

是否可以在画布背景中添加文本和图像？像这样

图片和单词＆＃39;在此处拖动照片＆＃39;

Answer 1

是！

这是可能的，以及如何实现这一目标......

＆＃13;

＆＃13;

var canvas = new fabric.Canvas('c');

var text = new fabric.Text('DRAG PHOTO HERE', {
   top: 100,
   left: 100,
   fontSize: 14,
   fontFamily: 'Arial',
   originX: 'center',
   originY: 'center'
});

fabric.Image.fromURL('https://i.imgur.com/LKaEHRo.jpg', function(img) {
   img.setWidth(200);
   img.setHeight(200);
   var group = new fabric.Group([img, text]);
   canvas.setBackgroundImage(group);
   canvas.renderAll();
});

＆＃13;

canvas{border:1px solid #ccc}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.13/fabric.min.js"></script>
<canvas id="c" width="200" height="200"></canvas>

＆＃13;

＆＃13;

＆＃13;