threejs 3d地图粒子效果实例,可以结合threejs 3d地图实现省份下钻实例实现下钻。
演示实例
其他实例
带下钻实例的地图效果
效果截图
地图下钻动画
3d旋转图片效果
地图中,我们使用了旋转的背景图效果,threejs 3d旋转的图片效果,这里我们单独把这一块分离出来学习使用。
设置地图视角
我们在更换地图数据后,中心点可能并不符合我们的意愿,或者我们想调整成自己想要的中心点,但是又不知道怎么调整,这里我们来讲一下如何配置地图中心点
项目实例中一开始渲染的是河北地图,在我们更换为其他地图后,中心点会偏移,比如我们更换为了中国地图后,渲染出来的效果是这个样子的,这并不是我们想要的效果。
我们想要的效果可能是这个样子的
首先我们需要找到渲染动画这一块,添加一段代码console.log(this.camera)
,调试输出相机的位置。然后通过鼠标调整好我们想要的角度。
复制相机位置数据
然后在开发工具里找到调试输出的数据,找到positon这个字段,将里面的数据复制出来。
相机位置回填
找到我们的相机位置,将复制的数据替换掉旧的数据就可以了。