在Google地圖中放置標記的JSON數據

我試圖根據放置在JSON中的座標放置標記，但我認爲我沒有在做安靜的事情。在Google地圖中放置標記的JSON數據

public class Stadiums 
{ 
    public int ID { get; set; } 

    public string Team { get; set; } 

    public decimal Latitude { get; set; } 

    public decimal Longitude { get; set; } 
} 


public void GetStadiums() 
    { 
     var con = ConfigurationManager.ConnectionStrings["NFLConnectionString"].ToString(); 

     List<Stadiums> matchingStadiums = new List<Stadiums>(); 
     using (SqlConnection myConnection = new SqlConnection(con)) 
     { 

      string oString = "Select * from Stadiums"; 
      SqlCommand oCmd = new SqlCommand(oString, myConnection); 
      myConnection.Open(); 
      using (SqlDataReader oReader = oCmd.ExecuteReader()) 
      { 
       while (oReader.Read()) 
       { 
        matchingStadiums.Add(new Stadiums 
        { 
         Team = oReader["Team"].ToString(), 
         ID = Convert.ToInt32(oReader["ID"]), 
         Latitude = Convert.ToDecimal(oReader["Latitude"]), 
         Longitude = Convert.ToDecimal(oReader["Longitude"]) 
        }); 
       } 

       ResultstoJSON(matchingStadiums); 

       myConnection.Close(); 
      } 
     } 
    } 
    public void ResultstoJSON(List<Stadiums> stadiums) 
    { 
     var jsonSerialiser = new JavaScriptSerializer(); 
     var json = jsonSerialiser.Serialize(stadiums); 
     this.JSONData = json; 
    }

我已經驗證了JSONData包含我以JSON格式查找的所有數據。從這裏，我不知道如何獲取數據並在Google地圖中放置針腳。

@{ 
Layout = null; 
} 

<!DOCTYPE html> 
<html> 
<head> 
<title>Simple Map</title> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
<meta charset="utf-8"> 
<style> 
    html, body, #map-canvas { 
     height: 100%; 
     margin: 0px; 
     padding: 0px; 
    } 
</style> 

<script src="https://maps.googleapis.com/maps/api/js?  v=3.exp&signed_in=true"></script> 
<script> 
    var myLatlng = new google.maps.LatLng(37.09024, -95.712891); 

    function initialize() { 
     var mapOptions = { 
      zoom: 5, 
      center: new google.maps.LatLng(37.09024, -95.712891) 
     }; 
     var map = new google.maps.Map(document.getElementById('map-canvas'), 
      mapOptions); 

     var marker = new google.maps.Marker({ 
      position: (myLatlng), 
      map: map, 
      title: 'Hello World!' 
     }); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 

</script> 
</head> 
<body> 
<div id="map-canvas"></div> 
</body> 
</html>

鏈接到JSON數據：http://pastebin.com/cJBDi3ti

再次澄清，我試圖把針/根據JSON數據的項目（有座標）在谷歌地圖標記。

來源

2015-02-09 John

請提供更多信息，包括指向JSON數據的鏈接或帶有Json的JSfiddle的字符串變量，並且Ill會幫助您。 – 2015-02-09 21:59:50

除了「我沒有正確地做事情，我沒有任何具體的問題。 ' – EZI 2015-02-09 22:01:16

我在我的文章底部添加了一個pastebin鏈接。 – John 2015-02-09 22:02:59

看着你提供什麼，你的JSON，

你的控制器需要將JSON標記數據返回到客戶端 - 目前你不返回任何東西。

在客戶端一旦你的JSON解析它的一個對象：

var markerData = JSON.parse(json);

然後您創建地圖後 - 遍歷每個markerData數組中的項目，並創建一個標記上它基於它的緯度和Longitudevalues：

$.each(markerData,function() 
{ 
    var myLatlng = new google.maps.LatLng(this.Latitude, this.Longitude); 

     var marker = new google.maps.Marker({ 
     position: (myLatlng), 
     data:this, 
     map: map, 
     title: 'Hello World!' 
    });     
}

這裏是一個JS fildle幫你

http://jsfiddle.net/loanburger/4wtyqmrg/

來源

2015-02-09 22:13:41

你能解釋一下讓我的控制器把json marker數據返回給客戶端是什麼意思嗎？ – John 2015-02-10 00:08:30

您的標記數據來自服務器嗎？所以當它返回給客戶端（瀏覽器）時，你將返回json字符串。上面的代碼不顯示如何將json返回給瀏覽器。如果你在瀏覽器中有json數據，那麼你的罰款，可以按照我上面給你的步驟 – 2015-02-10 00:10:46

在Google地圖中放置標記的JSON數據

回答

相關問題