Curved rectangles (cubes)

Hello everybody! I would be glad if someone tells me how to draw such a map. Suppose I don’t know how to draw such curved rectangles.

Have you considered to design such a map in a DCC tool like Blender? This is probably the most easiest/flexibel approach since no coding is required.


You could also use two half cylinders (a big and a small) and subtract the small one from the big using a library like

This is how I do it

1 Like

thanks! And you do not tell me how to tie physics to these figures? At the moment, I use omio.js, but as far as I know, it has only primitive figures

Another option is to use THREE.ExtrudeBufferGeometry(), based on SVG or shapes you define.


I do not know oimo.js, I use ammo.js.

I’m actually about to create a library which does not only this but more. For now it only works in combination with Phaser. If you take a look at the source code, you will find how I did it.

I will create a stand alone version soon.

Here is an example:

And somewhere here I add physics to the new mesh:

Hope this helps :slight_smile:


Sorry, can I operate with three figures? Well, that is, there are three figures, I subtracted the other from one and want to subtract the third from the result. But for some reason it didn’t work out for me ((

Yes, you can subtract a three mesh from another.

Maybe this helps:

I built an example which uses the same shapes as you need. It uses and (which uses three.js and ammo.js)

1 Like

Thank :hugs:. Cool game:)

1 Like

@11121 I found a simpler way to do it the same shape!

1 Like

Physics engines like Oimo.js and Cannon.js have heightmaps built into the library. Easiest approach is to create an image heightmap and rendering it. Black being the low level and white being the elevated level.


1 Like