问题，在对象内部使用 p5.js 宽度和高度方法

Question

您好，我无法理解在哪些地方和哪些地方不能使用 p5.js 方法。在这个codepen,

var bubble = {
  x: 200,
  y: 200,
  display: function() {
    stroke(255);
    strokeWeight(4);
    noFill();
    ellipse(this.x, this.y, 24, 24);
  },
  move: function() {
    this.x = this.x + random(-1, 1);
    this.y = this.y + random(-1, 1);
  }
}

function setup() {
  createCanvas(600, 400);

}

function draw() {
  background(0);
  bubble.display();
  bubble.move();
  ellipse(width/2,height/2,50,50)
}

如果我将 'bubble' 对象内的 x 和 y 值替换为 'width/2' 和 'height/2' - 控制台打印 'width' 未定义？如果我在 draw() 函数中使用相同的方法，它就可以正常工作。我猜这是一个范围界定问题？但不确定如何解决它。非常感谢。

Answer 1

var bubble = {
  init : function(){
   this.x = width/2;
   this.y = height/2;
  },
  display: function() {
    stroke(255);
    strokeWeight(4);
    noFill();
    ellipse(this.x, this.y, 24, 24);
  },
  move: function() {
    this.x = mouseX;
    this.y = mouseY;
  }
}

我不能告诉你为什么它不起作用，我想不通，但这是一个可行的解决方案

问题，在对象内部使用 p5.js 宽度和高度方法

Problems, using p5.js width and height methods inside an object

p5.js