Question

我在preload函数中创建了一个我想稍后使用的图像数组。但是，当我想使用图像属性高度和宽度时，类型是未定义的。有没有办法在javascript中施放什么东西？

我试图创建一个新图像，但我想念图像属性，例如：

    var images = new Array();
function preload() {    
images.push(loadImage("image0.jpg"));

var img=loadImage("image1.jpg");
var aspect = img.height / img.width; // Here I successfully get the image properties
images.push(img);
}

function setup() {
createCanvas(1000, 600);
var imgNum = parseInt(random(0, images.length - 1), 10);
var img1 =images[parseInt(imgNum, 10)];
var aspect = img1.height / img1.width; // Here img1 has undefined type so the value img1.height is undefined too.

            console.log("value: "+aspect);
    image(images[imgNum], 0, 0);
    console.log(img1);
}

所以img1.height值未定义。我想解释器丢失了类型，所以有办法恢复类型和信息？类似于java或c ++中的强制转换？

然而，如果不改变请求图像的属性我能够打印图像，但每个图像都有自己的值，我不能调整它们的大小。

function setup() {
 createCanvas(1000, 600);
 var img1 =images[parseInt(imgNum, 10)];
 image(img1, 0, 0);
}

Answer 1

尝试缩小问题范围。这样做会发生什么？

function preload() {
   var img = loadImage("image0.jpg");
   console.log(img.height);
}

如果未定义，那么您知道该图像位置有问题。检查位置和拼写。在Web浏览器中查看开发人员工具的网络选项卡，确保文件正在加载。

刚运行时会发生什么？

var x = parseInt(random(100, width), 10);
console.log(x);

x的价值是多少？这是你期望的吗？

同样，这会评估什么价值？

parseInt(imgNum, 10)

如果这是有道理的，那么继续这一行：

var img1 =new p5.Image(images[parseInt(imgNum, 10)]);

你为什么要这样做？ images数组应该已包含p5.Image的实例。这条线没有任何意义。你应该能够做更多这样的事情：

var img1 = images[2];

请注意，我已经对索引进行了硬编码。从测试目的开始。

请注意，这些问题更适合您自问。这是调试问题的过程，当你遇到这样的问题时，你应该怎么做。尝试通过确定代码的哪些部分正在工作来隔离问题。然后对这些部分进行硬编码以创建MCVE，这将帮助您提出更具体的问题。祝你好运。

图像数组P5.js

1 个答案: