无法获得修改后的fabic.js对象的旋转角度为原始角度

时间:2014-11-07 17:42:34

标签: javascript jquery math rotation fabricjs

无法将修改后的fabic.js对象的旋转角度报复为原始角度/位置。

我正在使用.getAngle(),如果对象旋转超过360度或来回旋转,我无法将其转换回相对于原始位置/旋转的角度。

    var canvas = new fabric.Canvas('canvas');

     //global canvas setting	
    canvas.selection = false;
    canvas.setDimensions({
      width: 500,
      height: 310
    });
     //Canvas Objets	
     // create a rectangle with angle=45
    var rect = new fabric.Rect({
      left: 100,
      top: 100,
      fill: 'red',
      width: 40,
      height: 40,
      lockUniScaling: true,
      centeredRotation: true
    });

    canvas.add(rect);

     //Object modification event				
    canvas.on('object:modified', function(e) {
      var activeObject = e.target;
      document.getElementById('result').value = activeObject.getAngle();
    });

我设置了一个显示默认输出http://jsfiddle.net/1db5g7us/

的小提琴

我假设需要对结果进行一些计算,但无法弄清楚是什么。

1 个答案:

答案 0 :(得分:0)

刚刚解决了这个问题,我需要做的就是使用模数运算符来获得相对于原始位置的旋转而不是总旋转角度。

            activeObject = activeObject%360;

更新小提琴:http://jsfiddle.net/1db5g7us/