如何將GeoJson數據傳遞到地圖之外的div

Question

借助OpenLayers3，我可以根據正常的地圖范圍在geojson的地圖點上動態顯示。 參見下面的代碼：

var geoJSONFormat = new ol.format.GeoJSON();
var vectorSource = new ol.source.Vector({
    loader: function(extent) {
        var url = 'restaurant-geojson.php' + '?bbox=' + extent.join(',') ;
       $.ajax({
           url: url,
           success: function(data) {
               var features = geoJSONFormat.readFeatures(data);
               vectorSource.addFeatures(features);
           }
       }); 
    },
    strategy: ol.loadingstrategy.bbox
});
var vector = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style({
        image: new ol.style.Circle({
            radius:6,
            stroke: new ol.style.Stroke({
                color: 'rgba(0, 0, 255, 1.0)',
                width: 2
            }),  
        })
    })
});
var raster = new ol.layer.Tile({
    source: new ol.source.OSM()
});

var map = new ol.Map({
    layers: [raster, vector],
    target: document.getElementById('map'),
    view: new ol.View({
      projection: 'EPSG:4326',
      center: [-79.80,22.10],
      maxZoom: 19,
      zoom: 12
    })
  });

  map.getView().on('change:resolution', function(evt){
    vectorSource.clear();

  });

現在，我還要在地圖的div中顯示這些點的數據。 因此，每次創建向量源時（加載時，然后在縮放或平移地圖上），我都希望div顯示的點也要更新。 有沒有辦法做到這一點？ 我是否需要在vectorSource的ajax的“成功”中添加一些ajax？ 你有什么例子嗎？

Answer 1

好吧，終於設法做到了。 在成功的ajax里面添加：

$.each(data.features, function (key, val) {
      geometry = val.geometry; 
      properties = val.properties;
      $("#name").append('<div>' + properties.name +'</div>'); 
    });