Fabric JS中的BringForward

切坦·坎德拉(Chetan Khandla)

https://jsfiddle.net/techticchetan/p638quv8/3/

我想在单击杯子图像时选择rect对象。

请检查以下链接。我想做这样的事情。http://preview.codecanyon.net/item/fancy-product-designer-woocommercewordpress/full_screen_preview/6318393?_ga=1.254133448.1940140524.1450868289

谢谢,

var canvas = new fabric.Canvas('cv'  ) ;
var rect;
  
fabric.Image.fromURL('http://tmgraphics.biz/test/HTML5_CANVAS%20_TESTING/test-7-21-15/test33/77000_Lime.png', function(img) {
var hRatio = canvas.width  / img.width    ;
   var vRatio =  canvas.height / img.height  ;
   var ratio  = Math.min ( hRatio, vRatio );
   var centerShift_x = ( canvas.width - img.width*ratio ) / 2;
   var centerShift_y = ( canvas.height - img.height*ratio ) / 2;  
 
widdy =   img.width*ratio;
hiddy =   img.height*ratio;
    
 img.set({
lockMovementX: true,
    lockMovementY: true,
    hasControls: false,
    left: centerShift_x,
    top: centerShift_y,
    width: widdy,
    height: hiddy,
    selectable:false
    });
     canvas.add(img) ;
    if (rect) img.bringToFront();
     
  });
  rect = new fabric.Rect({
            top : 5,
            left : 170,
            width : 200,
            height : 300,
            stroke: 'blue', strokeWidth: 2,
            fill : ''
        });
canvas.add(rect);
canvas.bringToFront(img)
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<canvas id="cv" width="400" height="400" style="border:1px solid black;"></canvas>

切坦·坎德拉(Chetan Khandla)

我有答案。请检查此https://github.com/kangax/fabric.js/issues/3506链接

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章