1

我正在做我认为是一个简单的副项目。事实证明，我有点脱离了我的舒适区，因为我对 python 一无所知（我使用的是 PHP）。我正在尝试创建一个显示一组兴趣点的滑动地图（使用 cloudemade 的传单）。我有一个包含 POI 名称、纬度和经度的 CSV 文件。

到目前为止，我能够读取 CSV 数据并将其转换为 JSON 数据，并使用 bottle.py 在网页中显示 JSON 数据的转储。

我的问题是如何通过 jquery 将 bottle.py 的 JSON 数据传递给传单的 javascript 库？

克里斯

4

1 回答 1

0

Leaflet 支持 GEOJSON，可以很容易地用 Leaflet 显示矢量数据。

看：

http://leaflet.cloudmade.com/examples/geojson.html

python geojson库也支持geojson，所以除了将它放入适当的对象并在将生成的JSON提供给传单之前添加您想要的任何其他属性之外，您不需要在python方面做很多事情。

只需使用标准 XMLHttpRequest() 从您提供服务的任何位置获取 JSON 对象。

function loadData(){

    // retrieve and load features to a layer
    var xhrequest = new XMLHttpRequest();
    xhrequest.onreadystatechange = function(){
        if (xhrequest.readyState == 4){
            if (xhrequest.status == 200){
                var geojsonLayer = new L.GeoJSON();
                geojsonLayer.on("featureparse", function(e){
                    if (e.properties && e.properties.name && e.properties.value){
                        var popupContent = "Whatever added properties you want to display";
                        e.layer.bindPopup(popupContent);                     
                    }; 
                    // any styles you've added
                    if (e.properties && e.properties.style && e.layer.setStyle){
                        e.layer.setStyle(e.properties.style);                      
                    };                      
                });    
                var layerItems =  JSON.parse(xhrequest.responseText);
                // add features to layer
                for (i=0; i<layerItems.length;i++){
                    var geojsonFeature = layerItems[i];
                    geojsonLayer.addGeoJSON(geojsonFeature);                       
                };
                map.addLayer(geojsonLayer); 
            };                
        };            
    };
    var url= "<url of where you are serving the GEOJSON data>"; 
    xhrequest.open('GET', url, true);
    xhrequest.send(null);            
}
于 2012-05-14T05:01:56.817 回答