2017-06-22 166 views
1

我目前有一个问题,在fabricjs中设置svg对象的宽度和高度。我试图设置它是这样的如何在fabricjs中设置svg的宽度和高度?

svg.width = 100; 
    svg.height = 100; 

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

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

回答

0

使用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>

+0

啊,谢谢。完美的作品! –

相关问题