Question

所以我正在开发一个利用CloudMade JavaScript地图的网站。我必须加载地图然后绘制大约14,000个标记。该网站的目的是使整个美国的标记（它们各自用不同的颜色绘制）可视化。因为我这样做，所以我不能使用那里的集群工具。

最初，我使用PHP从数据库中提取数据点并使用map.addOverlay(MyMarker)函数在地图上逐个绘制它们。这花了很长时间，所以我改变了我的方法。现在我将所有数据都放在JSON文件中，并使用以下JavaScript代码绘制点：

    $(document).ready(function(){
            var url="m/results.json";
            $.getJSON(url,function(json){
                $.each(json.posts,function(i,post){
                    var myMarkerLatLng = new CM.LatLng(post.Latitude,post.Longitude);
                    var myMarker = new CM.Marker(myMarkerLatLng, {
                        title: post.City + ", " + post.State,
                    });

                    map.addOverlay(myMarker);
                });
            });
        });

虽然这要好得多，但我希望它更快。目前它加载大约8秒钟，但我需要它是实时的。为了加快网站速度，我遵循了Google的网络效果指南https://developers.google.com/speed/docs/best-practices/rules_intro。但是遵循这些约定，我在文件的末尾运行上面的代码。这允许整个网页加载（包括地图），但它会停顿几秒钟，然后一次性绘制所有标记。

有关加快速度的提示或建议吗？

P.S。 - 我最初加载了整个美国的地图。意思是我必须在初始加载时绘制所有这些= /。不幸的是，没有办法解决这个问题。

在CloudMade地图上有效地绘制大量标记

0 个答案: