PhaserJS：在知道 x 和 y 的情况下放置精灵的视觉指南

Question

是否有某种 Chrome 插件或移相器的东西可以让我找出我想要放置精灵的位置的 x 和 y 坐标？

现在，这是一个猜谜游戏。我必须使用一个数字，重新加载浏览器，然后转到游戏中的点（现在可能是开始），看看是否可以。否则，请重复该过程。

还有更好的吗？可视化调试器或类似的东西？

我尝试使用标准的 Google Chrome 开发工具，但无法访问 HTML 画布或 WebGL 内的精灵。

Answer 1

如果 onClick 回调中没有任何操作，则可以使用如下内容：

var text;
Jumper.Game.prototype = {
  create: function() {
    this.game.input.onDown.add(this.onTap, this);
  },
  onTap: function(pointer){
    text = "x:"+parseInt(pointer.x)+" y="+parseInt(pointer.y);  
  },
  render:function(){
    this.game.debug.text(text || '--', 2, 14, '#00ff00');
  }
}

或者您可以将

this.game.input.onDown.add(this.onTap, this);

与

this.game.input.addMoveCallback(this.onTap, this)

更改为“实时”位置。

Answer 2

我知道这是一个老问题，但是，最适合我的是

console.log()

精灵对象，然后在

浏览器控制台

中手动更改

x

和 y 值。这样您就不需要重新加载并获得有关放置的即时反馈。