threejs纹理加载(二)

通过threejs提供的加载器我们去加载一些贴图作为几何体的纹理,非常方便。我们以本地一张图片作为例子来实现这个效果:



 threejs纹理加载(二)_第1张图片

 

核心的代码就在这里:

const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("src/assets/css.jpg");

const Material = new THREE.MeshBasicMaterial({ map: texture });
const cube = new THREE.Mesh(Gemertry, Material);
scene.add(cube);

我们给材质添加map属性,把texture作为其值就嫩实现贴图。这里特别要注意的是textureLoader.load引入图片路径的时候必须是绝对路径

你可能感兴趣的:(threejs,前端,javascript,vue.js)