如何在 matter.js 中以响应方式绘制？

我能够完成一个标志动画，标志是用不同的形状构建的。

在这里你可以看到最终的结果 > for statement

print

但我不知道如何绘制（使其）响应？不是画布本身（我可以用 css 做到这一点），而是实际的标志和组成它的形状。

基本上，我希望徽标始终居中对齐，并且始终占据视口宽度的 90%。

我知道在matter.js中你需要从身体的左上角以像素为单位写x，y数字，但我想知道如何处理视口中心的对齐以及如何使其对齐响应式（因此形状将始终占据视口的 %）。

我希望我的问题/怀疑是清楚的，也许图片会更好地解释。

有人能指出我正确的方向吗？

我在学习 mattjs 的同时正在接触画布世界，所以任何推荐都会很棒！