web3d地图开发时，经常需要在3d地图上添加一些图片标注
矩形贴图标注位置实例
矩形贴图标注位置实例
添加标注
// 引入three.js
import * as THREE from 'three/build/three.module.js';
import {modelU...
yekong
1年前 (2023-01-25) 1620℃
1喜欢
地图拉伸api ExtrudeBufferGeometry
通过three.js的几何体ExtrudeBufferGeometry可以拉伸一个轮廓，这样的话，通过ExtrudeBufferGeometry可以实现一个立体的拉伸地图效果。
注意拉伸高度要参考地图包围盒尺寸，或者说...
yekong
1年前 (2023-01-25) 1111℃
0喜欢
克隆.clone()和复制.copy() 是threejs很多对象都具有的方法，比如三维向量对象Vector3、 网格模型Mesh、几何体、材质。
克隆.clone()
克隆.clone()简单说就是复制一个和原对象一样的新对象，下面以三维向量对象Vector3给大家举例，其他的...
yekong
1年前 (2023-01-24) 1458℃
0喜欢
添加资源
model.add(gltf.scene)
移除资源
移除的资源不会渲染出来。
model.remove(gltf.scene)
资源移除后需要释放资源，threejsGPU内存释放
...
yekong
1年前 (2023-01-23) 886℃
0喜欢
web3d项目开发中，threejs场景渲染过后，移出场景显存占用仍然存在。为了减少不必要的资源占用，需要释放资源。
在移出模型后，需要释放模型占用的资源
// 从场景中移出數据不再渲染 不在占用gltf.scene需要的GPU资源占用
model.remove(gltf.sc...
yekong
1年前 (2023-01-23) 1463℃
0喜欢
web3d项目开发中，再渲染gltf文件时，为了减少文件的大小，一般选择glb，然后再使用zip进行压缩。以节省带宽.
打开Blender选择文件找到导出选择gltf点击.
选择.glb
然后点击导出就可以了。
导出后再压缩原本10M大小的文件变成了3.3M.
threej...
yekong
1年前 (2023-01-23) 3509℃
1喜欢
问题
gltf模型加载后和建模师做出来的效果差别很大
解决办法
根据threejs里提供的关于GLTFLoader文档来看，需要对纹理进行配置
纹理中包含的颜色信息（.map, .emissiveMap, 和 .specularMap）在glTF中总是使用sRGB颜色空间，而顶点...
yekong
1年前 (2023-01-23) 939℃
3喜欢
版本
0.123.0，使用0.143版本时会报computeFlatVertexNormals方法不存在
效果
演示地址
threejs实现4棱锥效果
延伸
threejs 在3d地图上标注四棱锥效果
项目代码
var scene = new THREE.Scene()
var...
yekong
1年前 (2023-01-22) 884℃
0喜欢
通过Box3的学习使用，我们很快就可以找到地图的中心点，通过controls.target.set来将中心点设置为地图的中心点，达到地图在中心的效果。
<!--渲染河北地图-->
<template>
<div class="home...
yekong
1年前 (2023-01-22) 576℃
0喜欢
问题
渲染出的中国地图没有在坐标中心。
解决方案
使用包围盒获取地图的中心，调整相机的lookAt坐标
创建包围盒
// 地图mapGroup的包围盒计算
var box3 = new THREE.Box3();//创建一个包围盒
// .expandByObject()方法：...
yekong
1年前 (2023-01-22) 832℃
0喜欢
