? ? ? ?最近要用Leaflet實(shí)現(xiàn)海量點(diǎn)的繪制，開始的時(shí)候用的是Leaflet自帶的L.marker( )方法，當(dāng)繪制10000個(gè)點(diǎn)時(shí)，卡頓感非常明顯。后來(lái)找了個(gè)插件，同樣繪制10000個(gè)點(diǎn)性能上明顯提升。

? ? ? ?其原因是通過(guò)canvas實(shí)現(xiàn)marker的繪制，避開了對(duì)DOM的操作,與DOM過(guò)多的交互會(huì)降低響應(yīng)速度，canvas可以被硬件加速，直接進(jìn)行像素級(jí)渲染，這樣就提高了性能。當(dāng)涉及到眾多圖形繪制時(shí)一般會(huì)采用WebGL或canvas，就是因?yàn)檫@。開發(fā)中要盡量避免大批量的DOM操作，比如事件委托機(jī)制就是為了避免這個(gè)。

總結(jié)

以上是生活随笔為你收集整理的地图上实现高效率绘制海量点的原理的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。