这是一个创建于 1950 天前的主题，其中的信息可能已经有所发展或是发生改变。
https://txs1992.github.io/fast-amap/
这个想法来源于之前开发的一个项目，该项目需要在 zoom 16 的级别下渲染 (100 * 100) 的小方格，使用高德地图的多边形覆盖物 Polygon 进行渲染，在 mac 13 寸屏幕下渲染 1k+，在外接 27 寸(不太记得多少寸了)显示屏下需要渲染近 3K 的覆盖物。
我尝试使用 vue-amap 这个组件库，在 1k 覆盖物的情况下需要渲染 5 秒左右，在 3k 覆盖物的渲染下会渲染 30+ 秒，甚至会让浏览器直接崩溃。我选择自己通过 AMap SDK 封装了一个组件，然而性能比 vue-amap 还要差，1k 覆盖物需要耗费 10+ 秒，如果我拿这个交给产品，他估计会打死我。
为什么会出现这种情况，事实上，我们在使用 Vue 开发的时候通过 props 将数据传递给组件或是 data，而 Vue 默认会对这些数据进行 deepWatch，而我放在 data 上的 Polygon 实例每次都会被 Vue 绑定，这就是造成性能降低的原因。最后我自己封装了一个 Polygon 的渲染类，1k+ 覆盖物渲染在 1 秒左右，虽然解决了性能问题，但使用却很不方便，因为在业务中有太多关于渲染处理的代码，无法做到只关心数据问题，需要编写很多配置属性。Fast AMap 就是为了这个问题而诞生的库。
第 1 条附言 · 2019-08-12 21:21:52 +08:00
 |
1
vvmap 2019-08-12 09:08:05 +08:00
我们也在业务中遇到同样的问题，解决方案跟题主相同。地图上使用的复杂对象如果被 vue 劫持监听，分分钟浏览器就崩了。
|
 |
2
deleteDB 2019-08-12 09:20:52 +08:00
有点意思 关注一下
|
|
3
deleteDB 2019-08-12 09:25:36 +08:00
建议在文档里 加一下 项目 git 的跳转链接...
|
 |
4
rain0002009 2019-08-12 10:23:48 +08:00
用 Object.freeze 冻结一下不就行了，vue 文档里都写了
|
 |
5
magicdawn 2019-08-12 10:41:48 +08:00
|
 |
6
eluotao 2019-08-12 11:53:04 +08:00
你好 能问下你的文档 是用什么插件吗? 很喜欢. 求告知
|
 |
7
gaigechunfeng 2019-08-12 11:55:27 +08:00
楼主你主题里面描述的问题，速度和配置都解决了吗？
我要 mark 一下。 |
 |
9
mt1992 OP @gaigechunfeng 解决了一些，你可以看看，在 1000 个覆盖物量级能做到 1 秒渲染。
|
|
11
mt1992 OP @eluotao 具体使用你可以看看这篇文章 https://zhuanlan.zhihu.com/p/36116211
|
|
12
mt1992 OP |
Select Language