如何解决Threebox 中的 GLTF obj 颜色主题
我使用以下代码通过threebox在mapbox中插入一个GLTF对象。 obj 的外观看起来很暗。是否有任何选项可用于更改 GLTF 对象的颜色主题?
var options = {
obj: './models/WMK-CSC-ALL-XX-XX-00_0.gltf',mtl: './models/WMK-CSC-ALL-XX-XX-00_0.bin',type: 'gltf',scale: 1,units: 'meters',rotation: { x: 90,y: 120,z: 0 },anchor: 'center'
}
tb.loadObj(options,function (model) {
let bldg = model.setCoords(origin3);
tb.add(bldg);
})
解决方法
如果您使用的是 Threebox,首先您的 init 参数是错误的,而不是:mtl: './models/WMK-CSC-ALL-XX-XX-00_0.bin'
应该是:bin: './models/WMK-CSC-ALL-XX-XX-00_0.bin'
如果您使用默认灯正确初始化 Threebox:
window.tb = new Threebox(
map,map.getCanvas().getContext('webgl'),//get the context from the map canvas
{ defaultLights: true }
);
它应该用一个 AmbientLight
和两个 DirectionalLight
很好地照明。
我正在维护最新版本的 threebox,所以如果这不能解决您的问题,请随时在那里打开一个问题。
感谢您的投入。我添加了两个“DirectionalLight”来解决这个问题。
onAdd: function (map,mbxContext) {
tb.altitudeStep = 1;
//// initialize geometry and material of our cube object
var geometry = new THREE.BoxGeometry(30,60,120);
// create two three.js lights to illuminate the model
var directionalLight = new THREE.DirectionalLight(0xffffff);
directionalLight.position.set(0,-70,100).normalize();
tb.scene.add(directionalLight);
var directionalLight2 = new THREE.DirectionalLight(0xffffff);
directionalLight2.position.set(0,70,100).normalize();
tb.scene.add(directionalLight2);
....
....
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。