本人初学three.js,根据Three中文文档学习,在学习过程中发现TextureLoader纹理贴图不显示图片(显示黑色),在文档中的代码如下所示:
// 纹理贴图映射到一个矩形平面上
var geometry = new THREE.PlaneGeometry(204, 102); //矩形平面
// TextureLoader创建一个纹理加载器对象,可以加载图片作为几何体纹理
var textureLoader = new THREE.TextureLoader();
// 执行load方法,加载纹理贴图成功后,返回一个纹理对象Texture
textureLoader.load('Earth.png', function(texture) {var material = new THREE.MeshLambertMaterial({// color: 0x0000ff,// 设置颜色纹理贴图:Texture对象作为材质map属性的属性值map: texture,//设置颜色贴图属性值}); //材质对象Materialvar mesh = new THREE.Mesh(geometry, material); //网格模型对象Meshscene.add(mesh); //网格模型添加到场景中//纹理贴图加载成功后,调用渲染函数执行渲染操作// render();
})
问题出现在MeshLambertMaterial材质,把它改成MeshBasicMaterial即可显示图片。