js生成tree

getSceneData() {
      Api.get('/security/category/all')
        .then(res => {
          const list = res.data || []
          this.treeData = scene.parseTreeData(list)
        })
        .finally(() => {
        })
    }

function parseTreeData(list) {
  if (!Array.isArray(list)) return []
  const indexMap = {}
  const result = list.filter(o => o.parentId === 0).map((o, i) => {
    indexMap[`${o.id}`] = i

    return {
      text: o.categoryName,
      value: o.id,
      categoryName: o.categoryName,
      parentId: o.parentId,
      children: []
    }
  })
  list.filter(o => o.parentId !== 0).forEach(o => {
    const i = indexMap[`${o.parentId}`]
    if (o.id === this.initValue) {
      if (o.parentId === 0) {
        this.securityValues = [o.id]
        return
      } else {
        this.securityValues = [o.parentId, o.id]
        return
      }
    }
    result[i].children.push({
      text: o.categoryName,
      value: o.id,
      categoryName: o.categoryName,
      parentId: o.parentId
    })
  })
  return result
}
export default{
  parseTreeData
}
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Three.js可以用于实现3D地图。通过使用Three.js的网格模型(Mesh)和向量对象(Vector3),可以创建具有坐标值的3D对象。网格模型的属性scale返回一个Vector3对象,该对象具有属性x、y、z,表示坐标值的浮点数类型。Vector3对象还具有set()方法,该方法接受三个参数,表示xyz坐标的值。\[1\] 在实现3D地图时,可以使用投影边界(shadow.camera.top、shadow.camera.bottom、shadow.camera.left、shadow.camera.right)和阴影映射大小(shadow.mapSize.width和shadow.mapSize.height)来控制阴影的生成。调整这些值可以改变阴影的质量和平滑度。默认情况下,阴影映射大小为512像素。\[2\] 在实现旋转特效时,可以使用场景的rotation属性来绕坐标轴旋转物体。rotation属性是相对于物体的本身坐标系而言的,物体的rotation是Euler欧拉角。需要注意的是,物体的rotation属性和旋转方法rotateX()的差异类似于position属性和平移方法translateX()的差异。旋转参考的是物体的模型坐标系,而平移参考的是世界坐标系或者场景对象的坐标系。\[2\] 除了WebGLRenderer渲染器外,Three.js还提供了其他几种渲染器,用于在不支持WebGL的浏览器上进行降级。这些渲染器可以在老旧的浏览器或不支持WebGL的情况下使用。\[3\] 因此,使用Three.js可以实现3D地图,并通过调整网格模型的属性、阴影设置和旋转特效来实现不同的效果。 #### 引用[.reference_title] - *1* *2* *3* [【three.js】3D模型创建 + 模型弹框 + 动画效果](https://blog.csdn.net/Hei_lovely_cat/article/details/116779538)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值