0

I have a geojson loaded into cartodb database. And I have a CSV file too. Names field would be common in both the GeoJSON and CSV file. I had written a logic if the place name in CSV matches the place name in GeoJSON, only then just add the corresponding geometry from the GeoJSON to the google maps. Now my problem is the GeoJSON data matches perfectly after it is loaded into CartoDB database. But when the geometry from GeoJSON in cartodb database is added to google maps (if the place name of CSV matches to that of GeoJSON ) there seems a slight shift in the data in google maps. I think this would be due to the extent had not been set properly.Data in google mapsMy code is below.

var data = {
                "type": "FeatureCollection",
                "features": feature
            };
            var layer = "toner-lite";
            var styles = [
                {
                    featureType: 'water',
                    elementType: 'geometry',
                    stylers: [
                        {hue: '#000000'},
                        {saturation: 100},
                        {lightness: -100}
                    ]
                }
            ];
            var mapProp = {
                center: new google.maps.LatLng(38.75597, -77.974228),
                zoom: 4,
                disableDefaultUI: true,
                zoomControl: true,
                zoomControlOptions: {
                    position: google.maps.ControlPosition.LEFT_TOP
                },
                mapTypeId: layer,
                mapTypeControlOptions: {
                    mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
                }
            };
    var styledMap = new google.maps.StyledMapType(styles,
                    {name: "Styled Map"});
            var map = new google.maps.Map(document.getElementById("googlemaps"), mapProp);
            var geocoder = new google.maps.Geocoder();
            var bounds = new google.maps.LatLngBounds();
            map.mapTypes.set('map_style', styledMap);
            map.setMapTypeId('map_style');
            //map.mapTypes.set(layer, new google.maps.StamenMapType(layer));

            map.data.addGeoJson(data);

And in the above code the object data has a value "feature" for the key "features". The structure of the value feature would be as below Feature

Harnish
  • 101
  • 1
  • 10
  • 1
    Is the issue due to the polygons (colored shapes?) are offset to the right slightly? You can try and look into [importing the data](https://developers.google.com/maps/tutorials/data/importing_data) properly and see if the offset still persists on it. A [sample](https://developers.google.com/maps/documentation/javascript/examples/layer-data-simple) is also provided in the documentation. Hope this helps! – adjuremods Jan 16 '16 at 14:59
  • Alright. I will try and update you. Thanks for the response. – Harnish Jan 18 '16 at 05:09

0 Answers0