thress中模型外部线条设置

最新推荐文章于 2024-06-12 11:13:48 发布

快乐的小青蛙。

最新推荐文章于 2024-06-12 11:13:48 发布

阅读量444

点赞数 9

文章标签：前端 javascript 开发语言 three

本文链接：https://blog.csdn.net/weixin_46002223/article/details/136307233

版权

 import * as THREE from 'three'
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'


const loader = new GLTFLoader()
const model = new THREE.Group()
loader.load("./model/建筑模型.gltf", function (gltf) {
  console.log(gltf)
  gltf.scene.traverse(function (obj) {
    if (obj.isMesh) {
      console.log(obj)
      const edges = new THREE.EdgesGeometry(obj.geometry)//实例化边线模型对象
      const line = new THREE.LineSegments(edges, new THREE.LineBasicMaterial({
        color: 0x00ffff
      }))
      obj.add(line)
      obj.material = new THREE.MeshLambertMaterial({
        color: 0x000000,
        // wireframe: true
        transparent: true,
        opacity: 0.5
      })
    }

  })
  model.add(gltf.scene)
})




export default model