[SOLVED] Changing vertex count of a plane

How to increase vertex count in a plane?

  1. Make a plane in a 3D app (such as Blender) with the vertex count you want and export it as GLB. Then drop it into the Assets Panel.
    • Advantage: you can see the plane in the Editor Viewport.
    • Disadvantage: you have to load an additional asset.
  2. Write a script that programmatically creates a plane with the vertex count that you want.
    • Advantage: there is nothing to load.
    • Disadvantage: you can’t see your plane in the Editor Viewport.

For option 2, the script might be:

var CustomPlane = pc.createScript('customPlane');

// Define the script attributes
CustomPlane.attributes.add('widthDivisions', {
    type: 'number',
    default: 1,
    title: 'Width Divisions'
});

CustomPlane.attributes.add('lengthDivisions', {
    type: 'number',
    default: 1,
    title: 'Length Divisions'
});

// initialize code called once per entity
CustomPlane.prototype.initialize = function() {
    // Ensure the entity has a render component
    if (!this.entity.render) {
        this.entity.addComponent('render');
    }

    // Create a material
    this.material = new pc.StandardMaterial();

    // Create initial plane
    this.createPlane();

    // Handle attribute changes
    this.on('attr', function(name, value, prev) {
        if (name === 'widthDivisions' || name === 'lengthDivisions') {
            this.createPlane();
        }
    });
};

// Function to create the plane
CustomPlane.prototype.createPlane = function() {
    // Create the plane mesh
    const plane = pc.createPlane(this.app.graphicsDevice, {
        widthSegments: this.widthDivisions,
        lengthSegments: this.lengthDivisions
    });

    // Create a mesh instance with the existing material
    const meshInstance = new pc.MeshInstance(plane, this.material);

    // Set the mesh instances to the render component
    this.entity.render.meshInstances = [meshInstance];
};
3 Likes

Wow thank you so much !

1 Like