简单实现 Three.js 实现 酷炫3D 地图
A: 参考 Threejs中文网 文档介绍 npm 中 Three的下载路径
B: 参考 数据源下载
地图的是通过这个 shape 描绘成形状展示的,数据可以通过 datav.aliyun 地图json小工具 获取到
数据拿到之后,就是展示的问题,直接展示是不行的,需要通过 d3 对数据处理,才能按照正确的地图样子展示
javascript
体验AI代码助手
代码解读
复制代码
import * as d3 from "d3"; //莫开托坐标 矫正地图坐标
//center 的位置可以自己定
const handleProj = d3.geoMercator().center([109, 34.5]).scale(1000).translate([0, 0]) // d3投影转换函数
C: 当前支持的功能 下钻 旋转 缩放 飞线 标记 自定义样式
喜欢的小伙伴 私信 开箱即用