我应该如何在 matter.js 中使用 Matter.Object.create 放置对象？

Question

我正在使用 matter.js 并且我有具有绝对位置的对象的顶点数据（来自 SVG 文件）。当我尝试将它们放置在地图上时，它们 最终都位于 0, 0 附近。使用此代码片段很容易观察到这一点：

<body>
    <script src="matter-0.8.0.js"></script>

    <script>
     var engine = Matter.Engine.create(document.body);
     var object = Matter.Body.create( 
         { 
             vertices: [ { x: 300, y: 300 }, { x: 200, y: 300 }, { x: 350, y: 200 } ],
             isStatic: true
         });

     Matter.World.add(engine.world, [object]);
     Matter.Engine.run(engine);
    </script>
</body>

或者看看这个 jsfiddle：https://jsfiddle.net/vr213z4u/

这个定位应该如何工作？我是否需要将绝对位置数据标准化为相对位置并使用发送到选项的位置属性Matter.Object.create ？我试过了，但是所有的对象都有点移位，可能是我理解不够。

Update/clarification: 我的目标是所创建对象的顶点最终恰好位于它们在源数据中的坐标上。

Answer 1

在创建主体时，顶点围绕其质心重新定向，然后转换为给定的 body.position。由于您没有在此处传递位置向量，因此默认为 (0, 0)。

尝试这样的事情：

var body = Matter.Body.create({
    position: { x: 500, y: 500 },
    vertices: [{ x: 300, y: 300 }, { x: 200, y: 300 }, { x: 350, y: 200 }],
    isStatic: true
});

如果你希望位置是绝对的：

var vertices = [{ x: 300, y: 300 }, { x: 200, y: 300 }, { x: 350, y: 200 }];

var body = Matter.Body.create({
    position: Matter.Vertices.centre(vertices),
    vertices: vertices,
    isStatic: true
});

我应该如何在 matter.js 中使用 Matter.Object.create 放置对象？

How should I place an object using Matter.Object.create in matter.js?

javascript

matter.js