buzibuzi
buzibuzi

Reputation: 734

Polygon on Bing Map using Local GeoJSON Object results in wrong location

Im using Bing Map v8 to draw a polygon on a map. for some reason, two different methods for doing so results in different results even though im using the same coordinates.

This method as shown here works well:

        map = new Microsoft.Maps.Map(document.getElementById("map"), {
            credentials: '',
            mapTypeId: Microsoft.Maps.MapTypeId.aerial,

        });

        var polygon = new Microsoft.Maps.Polygon([
            new Microsoft.Maps.Location(32.57922,34.91395),
            new Microsoft.Maps.Location(32.53799,34.9021),
            new Microsoft.Maps.Location(32.53264,34.91292),
            new Microsoft.Maps.Location(32.55398,34.92339),
            new Microsoft.Maps.Location(32.57156,34.93489),
            new Microsoft.Maps.Location(32.57503,34.92614)],
            { fillColor: 'rgba(241, 227, 100, 0.3)', strokeColor: 'rgba(241, 227, 100, 0.8)', strokeThickness: 1 });


        map.entities.push(polygon);

When using this Microsoft.Maps.GeoJson.read method as shown here to read a GeoJson object with the same polygon coordinates, the polygon is being drawn in an area hundreds of miles north-west from the original location. why is that ?

map = new Microsoft.Maps.Map(document.getElementById("map"), {
                credentials: '',
                mapTypeId: Microsoft.Maps.MapTypeId.aerial,

            });

            //define polygon using GeoJson Object
            var GeoJson = {
            "type": "Polygon",
            "coordinates": [[
                    [32.57922,34.91395],
                    [32.53799,34.9021],
                    [32.53264,34.91292],
                    [32.55398,34.92339],
                    [32.57156,34.93489],
                    [32.57503,34.92614]
                ]]
            };

            //Load the GeoJson Module.
            Microsoft.Maps.loadModule('Microsoft.Maps.GeoJson', function () {

                //Parse the GeoJson object into a Bing Maps shape.
                var shape = Microsoft.Maps.GeoJson.read(GeoJson, {
                    polygonOptions: {
                        fillColor: 'rgba(255,0,0,0.5)',
                        strokeColor: 'rgba(241, 227, 100, 0.8)',
                        strokeThickness: 1
                    }
                });
                //Add the shape to the map.
               //results in wrong location !
                map.entities.push(shapeA);
            });         

Upvotes: 0

Views: 333

Answers (1)

rbrundritt
rbrundritt

Reputation: 17954

Bing Maps Locations take in latitude,longitude, while GeoJSON positions/coordinates are longitude/latitude. Reverse the numbers in your GeoJSON coordinates.

Upvotes: 2

Related Questions