dongshang5862 2018-08-14 06:31 采纳率: 0%
浏览 1185

Fabricjs:在画布上更新SVG

I am using fabricjs 1.6.4 and I want to update the existing svg with the new one. I am using this code to add the new 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();
        });
      }

How can I replace the existing SVG with the new one. I have done something related to this in the image but I can not replicate in SVG. Here is the code for image:

$scope.fillImage = function(src) {
    fabric.Image.fromURL(src, function(img) {
        var object = canvas.getActiveObject();
        object._element.src = src;
        canvas.renderAll();
    });
}

I need something like this. Please help.

  • 写回答

1条回答 默认 最新

  • drq231358 2018-08-14 15:06
    关注

    You already have the variable image just make it global an you can remove before you add...
    here is an example:

    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>

    </div>
    
    评论

报告相同问题?

悬赏问题

  • ¥100 关于使用MATLAB中copularnd函数的问题
  • ¥20 在虚拟机的pycharm上
  • ¥15 jupyterthemes 设置完毕后没有效果
  • ¥15 matlab图像高斯低通滤波
  • ¥15 针对曲面部件的制孔路径规划,大家有什么思路吗
  • ¥15 钢筋实图交点识别,机器视觉代码
  • ¥15 如何在Linux系统中,但是在window系统上idea里面可以正常运行?(相关搜索:jar包)
  • ¥50 400g qsfp 光模块iphy方案
  • ¥15 两块ADC0804用proteus仿真时,出现异常
  • ¥15 关于风控系统,如何去选择