如何在cropperjs中调用rotate方法

How to invoke rotate method in cropperjs

本文关键字：调用 rotate 方法 cropperjs      更新时间：2023-10-19

我使用cropperjs，我想创建一个按钮来调用cropperjs中的rotate方法，即有一个顺时针90度和逆时针90度的按钮。我尝试了下面的代码，但没有成功。

  <script>
        window.addEventListener('DOMContentLoaded', function () {
            var image = document.getElementById('image');
            var imgRotate = document.getElementById('rotateImg');
            var cropper = new Cropper(image, {
                aspectRatio: 20 / 15,
                built: function () {
                }
            });
            document.getElementById('rotateImg').onClick = function () {
                cropper.rotate(90);
            };
        });
    </script>

两个步骤：

1）为了确保您的函数被调用，您可以按以下方式跟踪它。

document.getElementById('rotateImg').onClick = function () {
 console.log("I'm in, go to step 2");
  cropper.rotate(90);
 };

2）你需要告诉cropper允许你想要使用的函数，这里有一个不同的例子：

cropper = new Cropper(image, {
      movable: true,
      zoomable: true,
      rotatable: true,
      scalable: true
    });

希望这能帮你节省时间。

相关文章：