我正在使用javascriptKinetic
。
<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.4.2.min.js"></script>
我需要创建一个
Kinetic.Images()
数组,每个数组具有不同的图像。这是我的代码。
var imagesRef = ["cNote.gif","dNote.gif","eNote.gif","fNote.gif","gNote.gif","aNote.gif","cNote.gif","cSharpdFlat.gif","dSharpeFlat.gif","fSharpgFlat.gif","gSharpaFlat.gif","aSharpbFlat.gif"];
var imageObjs=[] ;
var imageObj;
var images=[];
var image;
var imageX = 0;
var stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
function drawImages(){
for(i=0;i<11;i++){
var imageObj = new Image();
imageObjs[i] = imageObj;
imageObjs[i].src= imagePath + imagesRef[i];
alert(imageObjs[i].src);
imageObjs[i].onload = function(){
alert("imageOnload has been called");
var image = new Kinetic.Image({
x:imageX,
y:0,
image:imageObjs[i],
width:75,
height:75,
stroke:'black',
strokeWidth:1,
strokeEnabled:true
});
alert("image has been created");
alert(image.getImage());
images[i] = image;
layer.add(images[i]);
imageX += 75;
layer.draw();
}
}
}
stage.add(layer);
</script>
<input type="button" onclick="drawImages();"id="submit" value="submit" />
单击按钮时,它应该加载图像。
但是只加载了
kinetic.image
的笔划因此,我看到的是一排矩形,里面没有图像,这应该是应该的。
imageObjs[i].src
的警报在警报“已创建图像”之前每次循环遍历时都会触发。当我尝试alert(image.getImage())
时,我不确定。 最佳答案
我认为可能是因为您没有定义变量imagePath
。
关于javascript - 创建一个未定义的Kinetic.Image(),image.getImage()数组?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/16027502/