How to color a shape in Babylon.js?

Viewed 5340

Working off the "Basic Scene" example on babylonjs-playground.com here, I am trying to do a simple modification on the color of the sphere.

Here is my attempt, which can be run interactively:

https://www.babylonjs-playground.com/#95BNBS

Here is the code:

var createScene = function () {

    // The original example, without comments:
    var scene = new BABYLON.Scene(engine);
    var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);
    camera.setTarget(BABYLON.Vector3.Zero());
    camera.attachControl(canvas, true);
    var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);
    light.intensity = 0.7;
    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);
    sphere.position.y = 1;
    var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);

    // My attempt to color the sphere
    var material = new BABYLON.StandardMaterial(scene);
    material.alpha = 1;
    material.diffuseColor = new BABYLON.Color3(1,0,0);
    scene.material = material;

    return scene;

};

My attempt to add the colored material to the sphere has no effect.

I also tried to look for color-related attributes on the sphere object:

Object.keys(sphere).filter((key) => return key.includes("Color") )
// => "outlineColor", "overlayColor", "_useVertexColors", "edgesColor"

Except for _useVertexColors, all of these seem to be color objects, but changing them has no effect:

sphere.overlayColor.g = 1;
sphere.outlineColor.g = 1;
sphere.edgesColor.g = 1;
1 Answers
Related