【发布时间】：2018-03-08 00:28:50
【问题描述】：
我正在使用 mapbox 构建一个网站来呈现大约 24mb 的 geojson 数据。我将这些数据存储在后端服务器中，API 请求大约需要 2300 毫秒，而前端地图显示这些数据需要 10 多秒。
GeoJson 是河流数据，其中包含许多 MultiLineString。数据被清理。
步骤如下：
- 用户打开网站
- 站点在服务器端点获取数据
- 站点接收到获取的数据（geojson - 其中 9 个）
- React 为每个 geojson 集创建一个层，并将这些信息作为状态传递给 Mapbox 组件
- Mapbox 获取这些数据并进行渲染，我相信这是花费最多时间的地方。
以下是数据格式： https://eflow.nyc3.digitaloceanspaces.com/class_geo_data/classGeo.json
我的问题：
- 渲染数据需要这么长时间的原因是什么？是不是因为线段太多了？我已经看到在更短的时间内呈现超过 100mb 的数据。
- 在 Mapbox 中渲染此数据集的最佳做法是什么？
我正在使用react-map-gl，不确定实际使用的是哪个版本的 mapbox gl。
谢谢 狮子座
依赖关系：
"babel-plugin-transform-decorators-legacy": "^1.3.4", "babel-plugin-transform-runtime": "^6.23.0", "babel-preset-es2015": "^6.24.1", "babel-preset-stage-0": "^6.24.1", "copy-webpack-plugin": "4.3.1", "webpack-dotenv-plugin": "^2.0.2", "animate.css": "3.6.1", “axios”：“0.18.0”， “d3”：“4.13.0”， "flexboxgrid": "6.3.1", "get-json": "1.0.0", “不可变”：“3.8.2”， “材料-ui”：“0.19.4”， “对象分配”：“4.1.0”， “反应”：“16.2.0”， “反应域”：“16.2.0”， “反应地图-gl”：“3.2.0”， "react-redux": "5.0.5", “反应路由器-dom”：“4.2.2”， "react-router-redux": "5.0.0-alpha.6", “redux”：“3.6.0”， “redux-thunk”：“2.1.0”， “超级代理”：“3.8.1”， “topojson”：“3.0.2”
【问题讨论】：
-
您考虑过使用矢量图块吗？
标签： reactjs mapbox mapbox-gl-js mapbox-gl react-map-gl