weird texture behavior - multiple textures rendered for one body

[seiyria]

Hey! I'm just getting into Matter and I love it. I'm running into some strange things though. I'm making a suika-style game and running into this:

The texture looks like this:

I have the following vertices on it (generated by PhysicsEditor):

				"vertices": [
					[ { "x":60.79999923706055, "y":72.5 }, { "x":65, "y":71 }, { "x":66, "y":69.80000019073486 }, { "x":64.80000305175781, "y":60.10000038146973 }, { "x":64.5, "y":58.5 }, { "x":53, "y":67 }, { "x":56.099998474121094, "y":69.60000038146973 } ],
					[ { "x":71.19999694824219, "y":27.5 }, { "x":71.0999984741211, "y":24.299999237060547 }, { "x":70.5, "y":21.099998474121094 }, { "x":68.5999984741211, "y":18.900001525878906 }, { "x":65, "y":17 }, { "x":62, "y":16 }, { "x":69.80000305175781, "y":28 } ],
					[ { "x":35.400001525878906, "y":75 }, { "x":39.900001525878906, "y":75 }, { "x":43, "y":72.59999990463257 }, { "x":31.399999618530273, "y":69.19999980926514 }, { "x":31.600000381469727, "y":71.39999961853027 } ],
					[ { "x":8.399999618530273, "y":44.400001525878906 }, { "x":9.600000381469727, "y":47.29999923706055 }, { "x":10.699999809265137, "y":49.20000076293945 }, { "x":13.399999618530273, "y":51.20000076293945 }, { "x":15.399999618530273, "y":52.20000076293945 }, { "x":11.600000381469727, "y":38.29999923706055 }, { "x":9.699999809265137, "y":40.79999923706055 } ],
					[ { "x":9, "y":35.599998474121094 }, { "x":11.699999809265137, "y":36.70000076293945 }, { "x":48, "y":8 }, { "x":30, "y":11 }, { "x":19, "y":18 }, { "x":6.800000190734863, "y":26.700000762939453 }, { "x":6.800000190734863, "y":29.900001525878906 }, { "x":7.5, "y":32.79999923706055 } ],
					[ { "x":22.700000762939453, "y":69.10000038146973 }, { "x":25.600000381469727, "y":67.30000019073486 }, { "x":13.199999809265137, "y":55.29999923706055 }, { "x":12, "y":60 }, { "x":13.300000190734863, "y":64.19999980926514 }, { "x":15.800000190734863, "y":67.39999961853027 }, { "x":19, "y":68.60000038146973 } ],
					[ { "x":52.5, "y":5.5 }, { "x":50, "y":7.599998474121094 }, { "x":62, "y":16 }, { "x":61.29999923706055, "y":13.300003051757812 }, { "x":58.099998474121094, "y":7.400001525878906 }, { "x":54.900001525878906, "y":5.599998474121094 } ],
					[ { "x":21.399999618530273, "y":12.5 }, { "x":19.600000381469727, "y":15.599998474121094 }, { "x":19, "y":18 }, { "x":30, "y":11 }, { "x":24.299999237060547, "y":11.300003051757812 } ],
					[ { "x":67.69999694824219, "y":67.10000038146973 }, { "x":67.4000015258789, "y":63.29999923706055 }, { "x":64.80000305175781, "y":60.10000038146973 }, { "x":66, "y":69.80000019073486 } ],
					[ { "x":9, "y":22 }, { "x":6.800000190734863, "y":26.700000762939453 }, { "x":19, "y":18 }, { "x":13.100000381469727, "y":19.5 } ],
					[ { "x":60.400001525878906, "y":9.400001525878906 }, { "x":58.099998474121094, "y":7.400001525878906 }, { "x":61.29999923706055, "y":13.300003051757812 } ],
					[ { "x":35.599998474121094, "y":3.6999969482421875 }, { "x":33.70000076293945, "y":6 }, { "x":32, "y":9 }, { "x":48, "y":8 }, { "x":46.400001525878906, "y":6.1999969482421875 }, { "x":42.599998474121094, "y":3.4000015258789062 }, { "x":38.70000076293945, "y":2.5999984741210938 } ],
					[ { "x":43, "y":72.59999990463257 }, { "x":45.70000076293945, "y":70.60000038146973 }, { "x":48.5, "y":67.5 }, { "x":30.399999618530273, "y":67.39999961853027 }, { "x":31.399999618530273, "y":69.19999980926514 } ],
					[ { "x":73.69999694824219, "y":36.20000076293945 }, { "x":72.5, "y":34 }, { "x":70, "y":48 }, { "x":72, "y":45 }, { "x":73.5, "y":41.900001525878906 } ],
					[ { "x":25.600000381469727, "y":67.30000019073486 }, { "x":48.5, "y":67.5 }, { "x":53, "y":67 }, { "x":72.5, "y":34 }, { "x":71, "y":31.700000762939453 }, { "x":14.699999809265137, "y":53.60000038146973 }, { "x":13.199999809265137, "y":55.29999923706055 } ],
					[ { "x":66.5999984741211, "y":57 }, { "x":68.9000015258789, "y":52.89999961853027 }, { "x":70, "y":48 }, { "x":72.5, "y":34 }, { "x":64.5, "y":58.5 } ],
					[ { "x":62, "y":16 }, { "x":50, "y":7.599998474121094 }, { "x":48, "y":8 }, { "x":11.699999809265137, "y":36.70000076293945 }, { "x":11.600000381469727, "y":38.29999923706055 }, { "x":15.399999618530273, "y":52.20000076293945 }, { "x":71, "y":31.700000762939453 }, { "x":69.80000305175781, "y":28 } ],
					[ { "x":64.5, "y":58.5 }, { "x":72.5, "y":34 }, { "x":53, "y":67 } ],
					[ { "x":32, "y":9 }, { "x":30, "y":11 }, { "x":48, "y":8 } ],
					[ { "x":14.699999809265137, "y":53.60000038146973 }, { "x":71, "y":31.700000762939453 }, { "x":15.399999618530273, "y":52.20000076293945 } ]
				]

I started a pen here but I'm having trouble importing poly-decomp, and making the image work.

I know this might be a bit wack to work off of, but is this easy to troubleshoot? I've been stuck on this for a while.

[ggorlen]

Sorry, what's the issue exactly? The screenshot doesn't look like the pen, which seems to be running fine without poly-decomp.

[seiyria]

Yes, I was having trouble getting the pen to load poly decomp.

The problem is that the texture is loaded multiple times for the given body for some reason. You can see the simple texture in the original post, and in the screenshot you can see a single object that has the same texture loaded multiple times, including the expected location and then more locations around it.

I'll push what I have so you can see it in action: https://suika-adventure.netlify.app

If the code helps: https://github.com/CorrugatedGames/suika-adventure/blob/master/src/app/pages/suika/suika-game/suika-game.component.ts but it's far from a minimal example unfortunately.