完整交互示例

下面运行的就是当前仓库 src/ 中的真实组件。拖拽地图可旋转视角，滚轮可缩放；点击行政区会触发 map-click。工具栏演示 ref 方法控制图层与更新柱图数据。

完整页面级示例位于 example/App.vue，执行 pnpm dev 后可查看。示例包含：

• 默认资源加载进度和错误态；
• 五类图层的显隐控制；
• 暂停与恢复渲染；
• 动态刷新区域指标；
• 使用 JSON 代码编辑器修改并实时应用地图参数；
• 地图点击事件反馈；
• 桌面与移动端响应式布局。

在线修改参数

点击地图底部的“编辑参数”即可打开 JSON 编辑器。编辑颜色、投影、灯光、图层显隐、柱图和信息点等配置后，点击“应用到地图”，或按 Ctrl/Command + Enter，当前三维场景会使用最新配置重新加载。

应用前会先检查配置是否发生变化；有变化时保留陕西省 GeoJSON，并使用最新的完整配置重新创建地图，避免局部更新投影或缩放时残留旧材质状态。

为避免一次性在编辑器中载入大量坐标，陕西省的 mapJson 与 mapStroke 不进入可编辑 JSON，始终使用 example/data 中的本地数据。编辑器提供格式化、恢复默认与 JSON 错误提示。

最小数据

const mapData = {
  mapJson,
  geoProjectionCenter: [108.887114, 35.263661],
  geoProjectionScale: 85,
}

只有 mapJson 是业务侧必须提供的字段。投影中心和缩放值需要根据 GeoJSON 覆盖范围调整，否则地图可能不在镜头中央或尺寸不合适。