使用Kineticjs加载图像

时间:2013-06-17 22:10:04

标签: image kineticjs

我无法将简单图片加载到图层中。有时会出现,有些则不然。

 <div id="container0" style="position:absolute; top:5px; left: 5px;"></div> 

 <script>
  Layer = new Kinetic.Layer();

  window.onload = function () {

   stage = new Kinetic.Stage({ container: "container0", width: 1000, height: 500 });
   stage.add(Layer);
   var img = new Image();
   img.src = "Images/Start.png"
   Image= new Kinetic.Image({ x: 250, y: 150, width: 251, height: 231,image: img});
   Layer.add(Image)

   Layer.draw();
  };
 </script>

我猜它的显示与否取决于图像加载时间是否足够快,但我可能做得不对。 任何帮助表示赞赏。感谢

1 个答案:

答案 0 :(得分:2)

使用image.onload:

img.onload = function(){
   Image= new Kinetic.Image({ x: 0, y: 0, width: 251, height: 231,image: img});
   layer.add(Image);
   layer.draw();
}

http://jsfiddle.net/lavrton/WeVW4/1/