2014-10-31 35 views
2

我想創建和使用GeoJSON .NET庫使用ASP.NET MVC5加載geoJSON數據到谷歌地圖,雖然我在某處做錯了什麼。GeoJSON.NET與ASP.NET MVC中的谷歌地圖

使用貼在GitHub的網站示例代碼我的控制器看起來是這樣的:

public ActionResult GetGeoJson() 
{ 
    var point = new GeoJSON.Net.Geometry.Point(
        new GeoJSON.Net.Geometry.GeographicPosition(45.79012, 15.94107)); 
    var featureProperties = new Dictionary<string, object> { {"Name", "Foo"} }; 
    var model = new GeoJSON.Net.Feature.Feature(point, featureProperties); 
    var serializedData = JsonConvert.SerializeObject(model, Formatting.Indented, 
       new JsonSerializerSettings 
       { 
        ContractResolver = new CamelCasePropertyNamesContractResolver(), 
        NullValueHandling = NullValueHandling.Ignore 
       }); 

    return Json(serializedData, JsonRequestBehavior.AllowGet); 
} 

而我的觀點如下:

@{ 
    ViewBag.Title = "Map"; 
} 

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=foobar"></script> 
<script src="~/Scripts/jquery-1.10.2.min.js"></script> 

<script type="text/javascript"> 
    function initialize() { 

     var centerPoint = new google.maps.LatLng(53.710921, -1.626776); 

     var mapOptions = { 
      center: centerPoint, 
      zoom: 12 
     }; 

     map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
     map.data.loadGeoJson('/Home/GetGeoJson'); 

    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 

<div id="map-canvas"> 

</div> 

當我加載頁面,並檢查控制檯鉻我有以下錯誤:

Uncaught InvalidValueError: not a Feature or FeatureCollection

如果我去我的行動內的瀏覽器它輸出如下:

"{\r\n \"geometry\": 
{\r\n \"coordinates\": [\r\n  15.94107,\r\n  45.79012\r\n ], 
\r\n \"type\": \"Point\"\r\n }, 
\r\n \"properties\": {\r\n \"name\": \"Foo\"\r\n }, 
\r\n \"type\": \"Feature\"\r\n}" 

回答

2

一個相關的SO question給了我答案。我需要從

return Json(serializedData, JsonRequestBehavior.AllowGet); 

在我的控制器返回改爲

return Content(serializedData, "application/json"); 

爲JsonResult也被序列化序列化的數據。