[SOLVED] Generate mesh with vertices

Hello,

I am wondering if it is possible to create a hexagon without needing to create indices (with triangles). Right now I am doing this:

var flatUpIndices = [
        0, 1, 2,
        0, 2, 3,
        0, 3, 4,
        0, 4, 5,
        0, 5, 6,
        0, 6, 1
    ];

Can I somehow connect all of them with 1 seam, like (0, 1, 2, 3, 4, 5, 0) instead of always creating indices.

Example can be seen here:
HexagonExample

you can remove this line:
mesh.setIndices(flatUpIndices);

and it still works. Is this what you’re after?

1 Like

But that generates two small blue triangles instead of one hexagon. Are the vertices not connected properly to create a single hexagon?

Ah I see … I think I refreshed the window before the source finished saving :slight_smile:
When you’re not using index buffer, each triangle needs 3 vertices. So for 6 triangles, you need 18 vertices. Try this:

    var mesh = new pc.Mesh(this.app.graphicsDevice);

    var positions = [

        0, 0, 0,                              // center pos
        -0.5 * outerRadius, 0, innerRadius,   // top left
        0.5 * outerRadius, 0, innerRadius,    // top right

        0, 0, 0,                              // center pos
        0.5 * outerRadius, 0, innerRadius,    // top right
        outerRadius, 0, 0,                    // right

        0, 0, 0,                              // center pos
        outerRadius, 0, 0,                    // right
        0.5 * outerRadius, 0, -innerRadius,   // bottom right

        0, 0, 0,                              // center pos
        0.5 * outerRadius, 0, -innerRadius,   // bottom right
        -0.5 * outerRadius, 0, -innerRadius,  // bottom left

        0, 0, 0,                              // center pos
        -0.5 * outerRadius, 0, -innerRadius,  // bottom left
        -outerRadius, 0, 0,                   // left

        0, 0, 0,                              // center pos
        -outerRadius, 0, 0,                   // left
        -0.5 * outerRadius, 0, innerRadius,   // top left
    ];

    var normals = [
        0, 1, 0,
        0, 1, 0,
        0, 1, 0,

        0, 1, 0,
        0, 1, 0,
        0, 1, 0,

        0, 1, 0,
        0, 1, 0,
        0, 1, 0,

        0, 1, 0,
        0, 1, 0,
        0, 1, 0,

        0, 1, 0,
        0, 1, 0,
        0, 1, 0,

        0, 1, 0,
        0, 1, 0,
        0, 1, 0
    ];

    mesh.setPositions(positions);
    mesh.setNormals(normals);
    mesh.update();

That works fine but still requires 6 triangles (more verbose than using indices), I wanted to have only 6 vertices and create a hexagon shape (not by triangles (indices), just to take 6 vertex positions and fill the top between those 6 positions).

You mentioned index buffer, would that make it work without triangles?

Sorry, I am waaaaay outside my reach here. Just very curious if I can do something :slight_smile:

when you call mesh.update();

you could use trifan and even tristrip, instead of default triangles (and organize the vertices to match) … but that would limit batching and probably some other things.

1 Like

Wow, didn’t think you’d go trough the engine code for this. I don’t think I want to mess with that. Triangles do work the best for shader/rendering/performance anyway and I was only curious if it were possible.

One last question, can I combine multiple entities into a singular mesh. So that I can generate 1000 hexagons and instead of having 1000 entities to just have a singular render->asset entity since it won’t ever change.

Thanks for helping me understand though, you’re amazing! :smiley:

I wrote that code, so I didn’t really need to search through the engine :slight_smile:

Sure, add a lot more verticies / indices into those arrays, and you’ll have a mesh with lots of hexagons, using a single entity. That would be a large performance win.

You could also use the batching system to do this, but you’d still need to create lots of entities, so that the batcher can batch them. Generating larger mesh is a lot better option.

See batching example here - it creates plenty of entities, but they get batched by material into very few of them for rendering: PlayCanvas Examples

1 Like

I will check out both options (one with making a large array of meshInstances and creating a single large entity and one with many entities and group them into a batch). Since it will be static, I will check the difference in performance when I make it.

Thanks for explaining this to me. It is very valuable information! Example does help me understand batching better as well, thanks!

If your meshes are static, make sure to use static batching (there’s a flag for this on the batch group I think) - that’d perform better than dynamic.

1 Like

@mvaligursky Hey, I know I put ‘SOLVED’ but I hoped that you would see this and tell me if it’s a single mesh instance. I think it is but I’d like your opinion, hope I am not annoying you! Here is the link again.

Hexagon

I think that I succesfully created a single mesh from 25 hexagons but, again, I’d like you to see it first hand. The script responsible for generating the mesh is “HexMesh”. I do have 25 entities in the world but it should be only one, singular, mesh component.

Again, very sorry to bother you if you are busy and thank you very, very much for explaining to me how to do this.

It’s one mesh, but you seem to perhaps render it many times? I didn’t look at the code, but perhaps you only need a single entity, with render component using this mesh.

Install Spector JS chrome plugin, capture while it’s rendering and you can see what happens.

1 Like

Installed Spector JS but I don’t know what I am looking for/at.

To me, it looks like it renders the mesh on first draw but the other draws it renders ‘screen space’ element to show coordinates. Since Spector JS shows 26 canvas frame buffer images on the left side.

When I disable the screen space element it looks like it has just one draw. Since Spector JS shows only 1 canvas frame buffer image on the left side.

I might be wrong, I disabled the screen space element if you want to check that. :slight_smile:

Ah ok, that makes sense. The screenshot in Spector is so small it seemed like it renders the same thing again as nothing changed. Well done then!

2 Likes

Thanks a lot for helping me understand how some of the things work under the hood. Pretty pleased with the result!

Have a great day! :grin:

1 Like