英文:
Notch doesn't get displayed in concave shape in matter.js
问题
I need to make this shape in matter.js:
This is what I tried (I took the points from Figma and inserted them into matter.js):
const logoBottom = Matter.Bodies.fromVertices(
150,
150,
[
[
Matter.Vector.create(13.06, 22.53),
Matter.Vector.create(66.94, 22.53),
Matter.Vector.create(58.24, 37.54),
Matter.Vector.create(39.03, 37.54),
Matter.Vector.create(48.64, 54.10),
Matter.Vector.create(40, 69),
],
],
{ isStatic: true }
);
However, the notch on the side doesn't get displayed and I don't know why.
英文:
I need to make this shape in matter.js:
This is what I tried (I took the points from Figma and inserted them into matter.js):
const logoBottom = Matter.Bodies.fromVertices(
150,
150,
[
[
Matter.Vector.create(13.06, 22.53),
Matter.Vector.create(66.94, 22.53),
Matter.Vector.create(58.24, 37.54),
Matter.Vector.create(39.03, 37.54),
Matter.Vector.create(48.64, 54.1),
Matter.Vector.create(40, 69),
],
],
{ isStatic: true }
);
However, the notch on the side doesn't get displayed and I don't know why.
答案1
得分: 1
Based on the comments, it sounds like you missed that poly-decomp needs to be added.
With poly-decomp:
<script src="https://cdn.jsdelivr.net/npm/poly-decomp@0.2.1/build/decomp.min.js"></script>
Without poly-decomp:
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.18.0/matter.min.js"></script>
I'm not sure what version of MJS you're using, but this gives me the following warning:
matter-js: Bodies.fromVertices: Install the 'poly-decomp' library and use Common.setDecomp or provide 'decomp' as a global to decompose concave vertices.
Related GH issues: #449, #15, #487.
英文:
Based on the comments, it sounds like you missed that poly-decomp needs to be added.
With poly-decomp:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
const engine = Matter.Engine.create();
const runner = Matter.Runner.create();
const render = Matter.Render.create({element: document.body, engine});
const logoBottom = Matter.Bodies.fromVertices(
150,
150,
[
[
Matter.Vector.create(13.06, 22.53),
Matter.Vector.create(66.94, 22.53),
Matter.Vector.create(58.24, 37.54),
Matter.Vector.create(39.03, 37.54),
Matter.Vector.create(48.64, 54.1),
Matter.Vector.create(40, 69),
],
],
{isStatic: true},
);
Matter.Composite.add(engine.world, logoBottom);
Matter.Render.run(render);
<!-- language: lang-html -->
<script src="https://cdn.jsdelivr.net/npm/poly-decomp@0.2.1/build/decomp.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.18.0/matter.min.js"></script>
<!-- end snippet -->
Without poly-decomp:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
const engine = Matter.Engine.create();
const runner = Matter.Runner.create();
const render = Matter.Render.create({element: document.body, engine});
const logoBottom = Matter.Bodies.fromVertices(
150,
150,
[
[
Matter.Vector.create(13.06, 22.53),
Matter.Vector.create(66.94, 22.53),
Matter.Vector.create(58.24, 37.54),
Matter.Vector.create(39.03, 37.54),
Matter.Vector.create(48.64, 54.1),
Matter.Vector.create(40, 69),
],
],
{isStatic: true},
);
Matter.Composite.add(engine.world, logoBottom);
Matter.Render.run(render);
<!-- language: lang-html -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.18.0/matter.min.js"></script>
<!-- end snippet -->
I'm not sure what version of MJS you're using, but this gives me the following warning:
> matter-js: Bodies.fromVertices: Install the 'poly-decomp' library and use Common.setDecomp or provide 'decomp' as a global to decompose concave vertices.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论