如何在fabricjs中设置svg的宽度和高度?

时间:2017-06-22 20:00:33

标签: javascript fabricjs

我在设置fabricjs中svg对象的宽度和高度时遇到了问题。我尝试像这样设置

cc1

但我没有得到我预期的结果。它只是裁剪svg而不是缩放它。那么,我该如何正确设置其宽度和高度?

任何帮助将不胜感激。谢谢!

1 个答案:

答案 0 :(得分:1)

使用scaleToWidth()scaleToHeight()方法分别正确设置SVG对象宽度和高度。

: - :工作示例: - :

var canvas = new fabric.Canvas('fabric-canvas');
fabric.loadSVGFromURL('https://istack.000webhostapp.com/1tf.svg', function(objects, options) {
   var svg = fabric.util.groupSVGElements(objects, options);
   svg.left = 50;
   svg.top = 50;
   svg.scaleToWidth(100);
   svg.scaleToHeight(100);
   canvas.add(svg);
   canvas.renderAll();
});
canvas{border:1px solid #ccc}
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.13/fabric.min.js"></script>
<canvas id="fabric-canvas" width="200" height="200"></canvas>