前端中的地图应该怎么加才好？

[t298]

如标题，我们业务需要在多个页面上展示二维地图，然后地图左右两边展示一些表格数据。 第一种展示方案：使用 vue2 来搭建基础框架，在页面中间留个大空/div,把地图嵌进去。这样一方面是页面感觉有点丑，地图和数据的割裂感比较重，在一方面就是切换页面之后，地图得重新加载，数据比地图加载的快，往往数据出来了，地图还在一点点加载。 第二个展示方案：就是页面上通铺地图，然后再以半透明得方式在地图上展示表格及数据，这样看起来能高级点，切换页面切换对应得地图数据，或者整个切换，就是不知道还会有什么其他的问题嘛

我不知道可以理解我的描述嘛，大佬们有什么好的建议或者开源的项目可以直接用的嘛

[Baymaxbowen]

这个让 UI 设计一下不就好了吗

[dfkjgklfdjg]

既然都要渲染地图，并且是类似的功能。不应该把地图的这一个部分放在父级页面中，子页面调用每次调用同一个地图实例吗。父级把通过 `provide` 把地图的 API 暴露给后代就行了。

这个就不管你是左右两边，还是通过绝对定位把左右菜单定位到地图组件上放了。

[dfkjgklfdjg]

@dfkjgklfdjg #2 ，这个子页面，不一定非要是页面，也可以是子组件。毕竟我看你描述的情况，业务逻辑都是差不多的。只是一个数据大屏，左右留出来的部分可能单纯就是数据看板展示 ＋ 一些额外的数据交互操作。

[t298]

@dfkjgklfdjg 那就是说，地图相当于一个父组件，其他页面使用的时候引用地图，在通过暴露的 api 在地图上显示点位信息，页面的话就是中间是一个大的 div 嵌地图，左右两边放数据看板就行。是不是这个意思？

[dfkjgklfdjg]

@t298 #4 ，相当于在父级页面的子组件（左右数据看板的同级组件）。