javascript - 如何在 Cropper.js 中处理比例尺和大图像?

标签 javascript jquery cropper cropperjs

我正在尝试使用 Cropper.js 来允许用户裁剪大图像 - 通常大于 3000x3000 像素的图像。

当图像加载到我的 div 元素中时,它会缩小到 1024 像素宽。在我的测试用例中,原始图像是 4032x2268,因此在浏览器中是 1024x576。

getCropBoxData() 和 getCanvasData() 方法返回要裁剪的选定区域的 x、y、宽度和高度值,但它们表示相对于图像的 1024x576 缩放比例,而不是实际图像的缩放比例按其原始大小。

我尝试编写一个转换例程来确定 X 和 Y 比例值并进行相应的转换,但它无法正常工作。

此时我想我应该在这里发帖,看看是否有更简单的方法。 Cropper.js 似乎在 getImageData() 方法中返回了一个scaleX和scaleY值,但它并没有按照我希望的方式工作。

有人知道我该如何处理这个问题吗?

最佳答案

我明白了。事情是这样的。 getCropData() 方法返回的“y”值错误。 “x”值也可能是错误的,但我不能100%确定。我最终所做的是将 x 和 y 值从 getData() 方法中取出,并且成功了。我希望这可以帮助别人!

关于javascript - 如何在 Cropper.js 中处理比例尺和大图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44029967/

相关文章:

javascript - 是否可以在 Chrome for Android 中以编程方式显示 URL 栏?

javascript - Node.js 如何构建 HTTP REST APi 项目?

javascript - ui-grid (ng-grid) 计算的宽度太宽

jquery - UIWebview 在 jquery 部分不滚动

jquery数据表边框问题

javascript - 在滚动条上将 div 淡化为黑色

javascript - 如何使用 Javascript Cropper 修复发布到服务器的图像大小

angular - 如何通过 angular-cli 将 Cropper.js 用于 Angular2 项目?

php - 在服务器 asp.net/php 上注入(inject) javascript 函数

javascript - 使 fengyuanchen 裁剪器响应式