babylonjs note 05 build a village (09) Making Copies (01)

Copying Meshes

To clone the house use

clonedHouse = house.clone("clonedHouse")

and for an instance it is

instanceHouse = house.createInstance("instanceHouse")

import { ArcRotateCamera, Color3, HemisphericLight, Mesh, MeshBuilder, Scene, StandardMaterial, Texture, Vector3, Vector4 } from "@babylonjs/core";
import { createApp } from "../utils";

/******Build Functions***********/
const buildGround =() => {
    // color
    const groundMat = new StandardMaterial("ground");
    groundMat.diffuseColor = new Color3(0,1,0);

    const ground = MeshBuilder.CreateGround('ground', {width: 10, height: 10});
    ground.material = groundMat;
    return ground;
}

const buildBox = (width: number) => {
    // texture
    const boxMat = new StandardMaterial('boxMat');
    if (width === 2) {
        boxMat.diffuseTexture = new Texture('/assets/texture/ex01/semihouse.png');
    } else {
        boxMat.diffuseTexture = new Texture('/assets/texture/ex01/cubehouse.png')
    }

    //options parameter to set different images on each side
    const faceUV = [];
    if (width == 2) {
        faceUV[0] = new Vector4(0.6, 0.0, 1.0, 1.0); //rear face
        faceUV[1] = new Vector4(0.0, 0.0, 0.4, 1.0); //front face
        faceUV[2] = new Vector4(0.4, 0, 0.6, 1.0); //right side
        faceUV[3] = new Vector4(0.4, 0, 0.6, 1.0); //left side
    }
    else {
        faceUV[0] = new Vector4(0.5, 0.0, 0.75, 1.0); //rear face
        faceUV[1] = new Vector4(0.0, 0.0, 0.25, 1.0); //front face
        faceUV[2] = new Vector4(0.25, 0, 0.5, 1.0); //right side
        faceUV[3] = new Vector4(0.75, 0, 1.0, 1.0); //left side
    }
    // top 4 and bottom 5 not seen so not set

     /**** World Objects *****/
     const box = MeshBuilder.CreateBox('box', {width, faceUV, wrap: true})
     box.material = boxMat;
     box.position.y = 0.5;

     return box;
}

const buildRoof = (width: number) => {
    //texture
    const roofMat = new StandardMaterial('roofMat');
    roofMat.diffuseTexture = new Texture('/assets/texture/ex01/roof.jpg');

    const roof = MeshBuilder.CreateCylinder('roof', {diameter: 1.3, height: 1.2, tessellation: 3});
    roof.material = roofMat;
    roof.scaling.x = 0.75;
    roof.scaling.y = width;
    roof.rotation.z = Math.PI / 2;
    roof.position.y = 1.22;

    return roof;
}

const buildHouse = (width: number) => {
    const box = buildBox(width);
    const roof = buildRoof(width);

    return Mesh.MergeMeshes([box, roof], true, false, null, false, true);
}

const app = createApp((canvas, engine) => {
    const scene = new Scene(engine);

    const camera = new ArcRotateCamera("camera", -Math.PI/2, Math.PI/2.5, 15, Vector3.Zero(), scene);
    camera.attachControl(canvas, true);

    const light = new HemisphericLight('light', new Vector3(1, 1, 0), scene);

    // customize your scene here
    const ground = buildGround();
    const house = buildHouse(2); //width of house 1 or 2

    return scene;
})

app.run();