当我通过PaperJS调整画布大小时,我想调整光栅(图像)的大小。我使用以下代码:
var last_point = view.center;
var img = new Raster('images/test.png', view.center);
img.onLoad = function() {
resizeImg();
}
function onResize(event) {
view.scrollBy(last_point.subtract(view.center));
last_point = view.center;
resizeImg();
}
function resizeImg() {
var width = paper.view.size.width;
var scale = (width / img.width) * 0.75;
img.scale(scale);
}
然而,一旦通过resizeImg()
功能,图像就不见了(注释该功能将使图像重新出现)。
我错过了什么我想这只是一个简单的计算错误
对象的宽度由其bounds.width
属性引用,而不是仅由width
引用。
function resizeImg() {
var width = paper.view.size.width;
var scale = (width / img.bounds.width) * 0.75;
img.scale(scale);
}
以下内容保留了图像的纵横比,省去了做数学运算的麻烦。fitBounds
(doc)和view.onFrame
(doc)使其全部自动工作。
…
function resizeImg () {
img.fitBounds(view.bounds)
}
view.onFrame = function (event) {
resizeImg()
}