Mapbox GL可以将 GeoJSON 数据由客户端（Web 浏览器或移动设备）即时转换为 Mapbox 矢量切片进行显示和处理。本文的目的是教大家如何有效加载和渲染大型 GeoJSON 源，并优化渲染显示速度，增强用户体验，减少客户端卡顿问题。本文以Mapbox 为例，至于其它框架原理大致相同，可以同理类推，只要找到对应的接口即可。

1.调整GeoJSON source对象的BUFFER为最小  

GeoJSON source 的 BUFFER选项会在对象所在的TILE周围绘制额外区域，其中会包含额外的渲染数据。它主要用于一些特殊符号的渲染，这些符号渲染后可能会覆盖多个TILE。如果您的数据仅包含完全可以渲染在一个TILE内的点，则可能不需要BUFFER选项。如果您的数据属于这种情况，请考虑将 GeoJSON source 的缓冲区选项设置为 0。最终，较小的BUFFER渲染速度会更快，因为它们使矢量切片更小、更少。

2.聚类方式显示（Clustering）  

在小比例尺时，请考虑对密集点数据源进行聚类。这使得TILE更小、加载速度更快、图层渲染速度更快、数据也更易于理解。有关如何对数据进行聚类的更多信息，请浏览聚类文档和随附的 Mapbox GL JS 示例。

      

          

          

3.控制缩放级别  

将 GeoJSON 源上的 maxzoom 选项设置为小于默认值 18 的值。此设置将提高平移和缩放超过指定 maxzoom 级别时的地图性能。对于大多数点源，zoom值 12 是精度和速度之间的良好平衡。另外将引用 GeoJSON 源的图层上的 minzoom 图层属性设置为大于 0 的值。minzoom 属性设置可防止地图尝试以低缩放级别加载和渲染切片。在低缩放级别下查看大型数据结果的每个特征并无用处，因为屏幕上没有足够的精度的像素显示这些。调整此项将会有更快的地图加载，并能提高渲染性能。

          

4.清理您的数据  

在 GeoJSON 源中，删除可视化不需要的任何数据属性，并使用最多 6 位小数精度的坐标值。使用 Mapbox GL JS 制作热图教程中的数据最初为 19.3 MB。如下面的代码片段所示，数据中有几个属性没有用，并且坐标的精度也不必使用小数