Transform (Move/Scale/Rotate) shapes with KineticJS

Question

I\'m trying to build a transform manager for KineticJS that would build a bounding box and allow users to scale, move, and rotate an image on their canvas. I\'m getting trip

Answer 1

Here is a proof of concept of a rotational control I've made: http://codepen.io/ArtemGr/pen/ociAD

While the control is dragged around, the dragBoundFunc is used to rotate the content alongside it:

controlGroup.setDragBoundFunc (function (pos) {
  var groupPos = group.getPosition()
  var rotation = degrees (angle (groupPos.x, groupPos.y, pos.x, pos.y))
  status.setText ('x: ' + pos.x + '; y: ' + pos.y + '; rotation: ' + rotation); layer.draw()
  group.setRotationDeg (rotation); layer.draw()
  return pos
})