这是代码：

/* 

 * Some code borrowed from: https://codepen.io/taye/pen/wrrxKb

*/

interact('.rotation-handle')

  .draggable({

    onstart: function(event) {

      var box = event.target.parentElement;

      var rect = box.getBoundingClientRect();

      // store the center as the element has css `transform-origin: center center`

      box.setAttribute('data-center-x', rect.left + rect.width / 2);

      box.setAttribute('data-center-y', rect.top + rect.height / 2);

      // get the angle of the element when the drag starts

      box.setAttribute('data-angle', getDragAngle(event));

    },

    onmove: function(event) {

      var box = event.target.parentElement;

      var pos = {

        x: parseFloat(box.getAttribute('data-x')) || 0,

        y: parseFloat(box.getAttribute('data-y')) || 0

      };

      var angle = getDragAngle(event);

      // update transform style on dragmove

      box.style.transform = 'translate(' + pos.x + 'px, ' + pos.y + 'px) rotate(' + angle + 'rad' + ')';

    },

    onend: function(event) {

      var box = event.target.parentElement;

      // save the angle on dragend

      box.setAttribute('data-angle', getDragAngle(event));

    },

  })

function getDragAngle(event) {

  var box = event.target.parentElement;

  var startAngle = parseFloat(box.getAttribute('data-angle')) || 0;

  var center = {

    x: parseFloat(box.getAttribute('data-center-x')) || 0,

    y: parseFloat(box.getAttribute('data-center-y')) || 0

  };

  var angle = Math.atan2(center.y - event.clientY,

    center.x - event.clientX);

  return angle - startAngle;

}

body {

  font-family: sans-serif;

}

.box {

  width: 150px;

  height: 100px;

  position: relative;

  background-color: #4be091;

  border-radius: 6px;

}

.rotation-handle {

  padding: 3px 4px;

  display: table;

  position: absolute;

  left: 50%;

  right: 50%;

  bottom: -35px;

  background-color: #ff1661;

  border-radius: 10rem;

  line-height: 1;

  text-align: center;

  font-weight: bold;

  color: #fff;

  cursor: move;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/interact.js/1.2.9/interact.min.js"></script>

<p>

  <strong>Rotate the box using the red handle.</strong>

</p>

<div class="box">

  <div class="rotation-handle">&circlearrowright;</div>

</div>