Question

Matter-js-如何获取矩形的宽度和高度？

我需要知道在Matter-js中实现了距离返回方法。

// part.vertices[0] and part.vertices[1]

我想集成图块选项。这就是关键部分的外观（我对Render.bodies使用覆盖功能是我最感兴趣的部分）。：

  for (let x = 0; x < this.tiles; x++) {

    c.drawImage(
      texture,
      texture.width * -part.render.sprite.xOffset * part.render.sprite.xScale,
      texture.height * -part.render.sprite.yOffset * part.render.sprite.yScale,
      texture.width * part.render.sprite.xScale,
      texture.height * part.render.sprite.yScale);

  }

Answer 1

const { min, max } = part.bounds

它将包含您在{ x, y }

中需要的内容

只减去max.x - min.x和max.y - min.y

Answer 2

我找到了两种解决方案。

1-创建一个包装subject.js主体的类，该主体还将保留其高度和宽度。即：

class rectWrapper {
  constructor(x, y, width, height, options){
    this.width = width
    this.height = height
    this.body = Matter.Bodies.rectangle(x, y, width, height, options)
    }
}

2-另一种方法是使用数学魔术来确定两个坐标点之间的距离，使用Body.vertices [0]和Body.vertices [1]作为宽度，以及Body.vertices [0]和Body .vertices [3]表示高度。这也将说明任何轮换。此链接针对2维和3维进行了清楚的说明：

https://sciencing.com/calculate-distance-between-two-coordinates-6390158.html

我建议编写自己的“实用程序功能”来执行此操作。一个繁重的例子可能看起来像这样：

function distance(x1, y1, x2, y2){
  var x = Math.abs(x1-x2)
  var y = Math.abs(y1-y2)
  return Math.sqrt((x*x)+(y*y))
}

因此通话可能看起来像：

var rect = Matter.Bodies.rectangle(0,0,10,50)

var width = distance(rect.vertices[0].x, rect.verticies[0].y, rect.vertices[1].x, rect.vertices[1].y)

var height = distance(rect.vertices[0].x, rect.vertices[0].y, rect.vertices[3].x, rect.vertices[3].y)

或者，如果碰巧使用p5.js作为渲染器，则可以使用p5.dist（），该函数以x1，y1，x2，y2作为参数并返回距离（与上面的函数基本相同）：

https://p5js.org/reference/#/p5/dist

注意，这仅适用于矩形。如果您使用的几何类型不同，我可能自己做一个包装器类。

Answer 3

我采用了与以下非常相似的解决方案：

var width = 30;
var height = 30;
var rect = Bodies.rectangle(150, 100, width, height, {density:0.01, className:"brick", width:width, height:height});

console.log(rect.className, rect.width); // "brick", 30

我决定保留原始的宽度/高度信息以及其他自定义属性，例如className

之所以如此，是因为bounds受任何非理想圆形物体旋转的影响。一个旋转的矩形的边界可能比其实际宽度宽30％。

Matter-js-如何获取矩形的宽度和高度？

3 个答案: