Javascript 缩放传单容器以提高性能,解决计算问题
我有一张全屏地图,由于很多标记(我已经在使用MarkCluster了,很棒的插件)和它的大小,它存在一些性能问题。然后我开始尝试这个尺寸 如果我将容器大小缩小一半,然后通过CSS3将其再次放大两倍,我将获得巨大的性能提升!很像ol'HTML%画布技巧(通过CSS放大)。像这样:Javascript 缩放传单容器以提高性能,解决计算问题,javascript,html,css,leaflet,css-transforms,Javascript,Html,Css,Leaflet,Css Transforms,我有一张全屏地图,由于很多标记(我已经在使用MarkCluster了,很棒的插件)和它的大小,它存在一些性能问题。然后我开始尝试这个尺寸 如果我将容器大小缩小一半,然后通过CSS3将其再次放大两倍,我将获得巨大的性能提升!很像ol'HTML%画布技巧(通过CSS放大)。像这样: /* Before */ #map { width:1000px; height:400px; } /* After */ #map { width: 500px; height:200
/* Before */
#map {
width:1000px;
height:400px;
}
/* After */
#map {
width: 500px;
height:200px;
-webkit-transform: scale(2,2);
...
}
然而,现在的计算有点错误。例如,setZoomAround()
计算错误的点,并且在手机上不确定缩放。此外,平移太快(因为移动速度是平移速度的两倍)
我自己也试着调整一下,但我不太参与传单中的引擎盖下的机械部分。在某个地方,我需要用2来抵消这个比例,有谁比我更了解这个吗?结果是,你所要做的就是将鼠标在事件中的X/Y位置除以你的标量。因此,sclar为
2
的e.clientX
将是e.clientX/2
希望这对别人有帮助