能否基于Mapbox GL JS实现仓库平面图的交互功能？

Mapbox GL JS 完全可以满足你描述的三个仓库使用场景，哪怕是非地理空间的自定义底图，也能顺利实现聚类等核心功能，具体说明如下：

• 自定义仓库底图（非地理空间）
  Mapbox GL JS 支持自定义坐标系（比如使用内置的CRS.Simple），无需依赖地理坐标。你可以将仓库平面图作为自定义底图加载：

  • 直接用ImageSource加载仓库平面图图片，设置对应的坐标范围（比如把图片的左上角设为[0, 0]，右下角设为[图片宽度, 图片高度]）；
  • 或者将仓库图切割成自定义瓦片集，通过TileSource加载，适配更大尺寸的仓库平面图。
    配置好坐标系后，地图会完全基于你设定的平面坐标系统运行，和地理空间地图的交互逻辑一致。

• 货架/区域存储量聚类图层
  聚类功能不依赖地理空间坐标，只要你的货架/区域位置用自定义平面坐标表示（比如仓库内的x、y位置），就能使用Mapbox的cluster类型图层实现聚合展示：

  • 在GeoJSON数据源中定义货架/区域的点要素，坐标使用自定义平面值；
  • 配置聚类图层的样式，比如根据聚合数量设置不同颜色，用标签显示存储总量，完全适配仓库场景的需求。

• 产品/箱子点标记与缩放聚类
  该逻辑和地理空间地图的聚类完全一致：

  • 每个产品/箱子用自定义平面坐标的点要素存入GeoJSON数据源；
  • 通过设置cluster相关参数（如clusterRadius控制聚类范围、clusterMaxZoom控制缩放至哪个级别显示单个点），实现缩放时自动聚合/拆分的效果——放大显示单个产品标记，缩小则聚合成带数量的聚类标记。

注意事项 #

• 确保自定义坐标系和底图、点要素的坐标系统一，避免出现位置错位；
• 加载仓库平面图时，需设置好地图的初始边界（maxBounds），保证底图完整显示且用户无法拖出仓库范围。

内容的提问来源于stack exchange，提问作者BeffJezoz