[英]Fabricjs: Update SVG on the canvas
我正在使用fabricjs 1.6.4,我想用新的更新現有的svg。 我正在使用以下代碼添加新的SVG:
fabric.loadSVGFromURL(url, function (objects, options) {
var image = fabric.util.groupSVGElements(objects, options);
image.name = 'sticker';
canvas.add(image);
image.scaleToHeight(100);
image.center();
image['selectable'] = false;
image['evented'] = false;
image.setCoords();
canvas.renderAll();
});
}
如何用新的替換現有的SVG。 我已經在映像中完成了與此相關的操作,但是無法在SVG中復制。 這是圖像的代碼:
$scope.fillImage = function(src) {
fabric.Image.fromURL(src, function(img) {
var object = canvas.getActiveObject();
object._element.src = src;
canvas.renderAll();
});
}
我需要這樣的東西。 請幫忙。
您已經有了可變image
只是使其成為全局image
,可以在添加之前將其刪除...
這是一個例子:
var image; var canvas = new fabric.Canvas('canvas'); var url = "http://swagger-net-test.azurewebsites.net/api/SvgImage?" function callback(objects, options) { if (image) canvas.remove(image); image = fabric.util.groupSVGElements(objects, options); image.name = 'sticker'; canvas.add(image); image.scaleToHeight(60); image.center(); image.setCoords(); canvas.renderAll(); } fabric.loadSVGFromURL(url + "color=red", callback) setTimeout( function() { fabric.loadSVGFromURL(url + "color=blue", callback) }, 3000 );
<canvas id="canvas" width="180" height="180"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.3.4/fabric.min.js"></script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.