リーフレットにマーカーをプロットする方法

Question

私はjson形式でデータベースからデータを取り出すことができますが、現在はコンソールでデータを見ることができます。私の質問はどうやって私が持っている緯度経度このajax呼び出しを使用して取得されます。

がどのように機能の成功

$(document).ready(function() { 

     $(function() { 
      var pData1 = []; 
      var jsonData = JSON.stringify({ pData1: pData1 }); 
      // var jsonArray = JSON.parse(JSON.stringify(jsonData)); 
      $.ajax({ 
       type: "POST", 
       url: "map.aspx/getCityPopulation2", 
       data: jsonData, 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: OnSuccess, 

      }); 
      function OnSuccess(response) { 
       console.log(response.d) 
      } 

Answer 1

最も簡単な方法は、ループを持つことであるマーカーを反復処理し、マップに追加します上のマーカーを得ることができます

実施例は、ここにhttp://codepen.io/hkadyanji/pen/BLyYYY

です

//select the div that holds the map object 
var mymap = document.querySelector("#map") 

// ... initialize the leaflet map as expected -> such as adding a tile layer 

//a function to add the markers to the map 
//you will call this function passing the resulting array from 
//the ajax call as the parameter 

function addToMap(locationArray){ 

    //iterates through the array object called from the server 
    [].forEach.call(locationArray, function(location){ 

     var marker = L.marker([location.lat, location.lng]).addTo(mymap); 

     //you can even add a custom popup for the individual marker 
     //marker.bindPopup("custom pop up content goes here").openPopup(); 
    } 
}