如何为 Babylon.js 中的形状着色?
How to color a shape in Babylon.js?
处理 babylonjs 上的 "Basic Scene" 示例-playground.com here,我想对球体的颜色做一个简单的修改。
这是我的尝试,可以运行交互:
https://www.babylonjs-playground.com/#95BNBS
代码如下:
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;
};
我尝试将彩色 material 添加到球体中,但没有任何效果。
我还尝试在球体对象上寻找与颜色相关的属性:
Object.keys(sphere).filter((key) => return key.includes("Color") )
// => "outlineColor", "overlayColor", "_useVertexColors", "edgesColor"
除了_useVertexColors
,这些好像都是颜色对象,但是改了也没有效果:
sphere.overlayColor.g = 1;
sphere.outlineColor.g = 1;
sphere.edgesColor.g = 1;
你很接近。您使用 diffuseColor
正确设置了颜色,但实际上并没有将其专门添加到球体中。
您的球体对象存储在 sphere
中,因此您需要做的是设置您在 sphere
而不是 scene
上创建的 material
。
// My attempt to color the sphere
var material = new BABYLON.StandardMaterial(scene);
material.alpha = 1;
material.diffuseColor = new BABYLON.Color3(1.0, 0.2, 0.7);
sphere.material = material; // <--
看到这个tutorial
处理 babylonjs 上的 "Basic Scene" 示例-playground.com here,我想对球体的颜色做一个简单的修改。
这是我的尝试,可以运行交互:
https://www.babylonjs-playground.com/#95BNBS
代码如下:
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;
};
我尝试将彩色 material 添加到球体中,但没有任何效果。
我还尝试在球体对象上寻找与颜色相关的属性:
Object.keys(sphere).filter((key) => return key.includes("Color") )
// => "outlineColor", "overlayColor", "_useVertexColors", "edgesColor"
除了_useVertexColors
,这些好像都是颜色对象,但是改了也没有效果:
sphere.overlayColor.g = 1;
sphere.outlineColor.g = 1;
sphere.edgesColor.g = 1;
你很接近。您使用 diffuseColor
正确设置了颜色,但实际上并没有将其专门添加到球体中。
您的球体对象存储在 sphere
中,因此您需要做的是设置您在 sphere
而不是 scene
上创建的 material
。
// My attempt to color the sphere
var material = new BABYLON.StandardMaterial(scene);
material.alpha = 1;
material.diffuseColor = new BABYLON.Color3(1.0, 0.2, 0.7);
sphere.material = material; // <--
看到这个tutorial