0

因此，尝试完成 KineticJS.Image 教程，但我遇到了一个问题。

这有效：

$(document).ready( function() { 
  var icon = new Image();    
  icon.onload = function() { 
    var stage = new Kinetic.Stage({ 
      container: 'canvas',      
      width: 730,            
      height: 700,           
    });
    var layer = new Kinetic.Layer();

    var im = new Kinetic.Image({    
      x: -14,
      y: -13,
      image: icon,
      width: 30,
      height: 30
    });
    layer.add(im);        
    stage.add(layer);        
  };                         
  icon.src = '#{asset_path "icons.png"}';
});

这与教程代码非常接近，但没有：

$(document).ready( function() { 
  var stage = new Kinetic.Stage({
    container: 'targetCanvas',
    width: 730,
    height: 700,
  });
  var layer = new Kinetic.Layer();
  var icon = new Image();    
  icon.onload = function() { 
    var im = new Kinetic.Image({
      image: icon,
      width: 30,
      height: 30,
    });
    layer.add(im);        
    stage.add(layer);        
  };                         
  icon.src = '#{asset_path "designer_icons.png"}';
});

它抛出：

Uncaught TypeError: Object #<Object> has no method '_addId' kinetic.js:28
  Kinetic.Container.add
  Kinetic.Stage.add
  icon.onload

我的环境中可能有一些严重的问题，因为这是一个项目的严重黑客工作（Rails w/Backbone、Require、Bootstrap 和 Kinetic），而且我真的不知道 javascript 或各种库，所以我我在黑暗中摸索着。

任何想法是什么导致了这个以及如何解决它？

4

1 回答 1

0

似乎 stage 没有正确初始化为 Kinetic.Node 。你能确定这存在吗？

<div id="targetCanvas"></div>

另外，请确保您使用的是 4.3.1 版本？我没有看到 4.3.1 有那条线。

如果以上没有帮助，请发布您的示例，以便我看一下。

于 2013-02-08T14:56:07.410 回答