Question

我正在使用Bing Maps v8 API，尝试将自己的GeoJSON加载到Bing地图上，如下例所示：https://www.bing.com/api/maps/sdkrelease/mapcontrol/isdk#geoJsonReadObject+JS

我正在成功创建我的JSON（我使用Bing地图拖放功能测试了它，我的所有点都显示在地图上。https://bingmapsv8samples.azurewebsites.net/#GeoJson%20Drag%20and%20Drop。

我试图让我的GeoJSON自动加载到地图上，我收到JSON失败，我不知道为什么。（我是GeoJSON / JSON的新手。）

Javascript：

function loadMapScenario() {
            var map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
                credentials: 'KEY',
                center: new Microsoft.Maps.Location(32.560116, -117.057889),
                zoom: 5
            });
            Microsoft.Maps.loadModule('Microsoft.Maps.GeoJson', function () {
                var featureCollection = Microsoft.Maps.GeoJson.read(getGeoJson(), { polygonOptions: { fillColor: 'rgba(0, 255, 255, 0.3)' } });
                for (var i = 0; i < featureCollection.length; i++) {
                    map.entities.push(featureCollection[i]);
                }
            });

           function getGeoJson() {
            $(function (callback) {      
                var data;
                        $.ajax({
                            type: "POST",
                            url: "/TD/PatGeoJSON",
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (response) {
                                alert("Hello: " + response.responseText.data)
                                data = response.RepsonseText;
                                callback(data)                                
                            },
                            failure: function (response) {
                                alert("Failure: " + response.responseText);
                            },
                            error: function (response) {
                                alert("Failure: " + response.responseText);
                            }                            
                        });
                    });
            }
        }

控制器：

        [HttpPost]
        public JsonResult PatGeoJSON(string parent)
        {
            JObject jsondata = JObject.FromObject(new
            {
                type = "FeatureCollection",
                features = from p in pList
                          select new
                          {
                              type = "Feature",
                              geometry = new Geometry
                              {
                                  type = "Point",
                                  coordinates = new double?[] { p.GeoLocation.Longitude, p.GeoLocation.Latitude }
                              },
                              properties = new Properties
                              {                                  
                                  MemberName = p.MemberName,
                                  /// etc...
                              }
                          }
            });        

            return Json(jsondata, JsonRequestBehavior.AllowGet);
        }

我的结果目前是＆＃34;失败＆＃34;使用JSON字符串发出警报。注意：如果我将我的GeoJSON硬编码为getGEOJSON函数的结果，我的所有点都会显示在地图上。我在剧本中没有正确阅读JsonResult吗？

Answer 1

你的getGeoJson函数是异步的，因此它不会返回任何内容，这个bing映射正在接收一个空值来解析，它只是忽略而且没有错误。在加载geojson时以及响应时指定回调函数，然后读取其值。以下是JavaScript的更新版本：

function loadMapScenario() {
    var map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
        credentials: 'KEY',
        center: new Microsoft.Maps.Location(32.560116, -117.057889),
        zoom: 5
    });

    Microsoft.Maps.loadModule('Microsoft.Maps.GeoJson', function () {
        getGeoJson(function(data){
            var featureCollection = Microsoft.Maps.GeoJson.read(data, { polygonOptions: { fillColor: 'rgba(0, 255, 255, 0.3)' } });
            for (var i = 0; i < featureCollection.length; i++) {
                map.entities.push(featureCollection[i]);
            }
        });
    });

   function getGeoJson(callback) {
        var data;
        $.ajax({
            type: "POST",
            url: "/TD/PatGeoJSON",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                alert("Hello: " + response.responseText.data)
                data = response.RepsonseText;
                callback(data)                                
            },
            failure: function (response) {
                alert("Failure: " + response.responseText);
            },
            error: function (response) {
                alert("Failure: " + response.responseText);
            }                            
        });
    }
}

Bings Maps - 阅读GeoJSON

1 个答案: