4

I am populating a Google map using GeoJSON that I'm exporting with QGIS. I'm converting the TIGER shapefiles into GeoJSON for state polygons. I used the standard output, and received the file. My problem is Google Maps API is not accepting them.

Example output:

{ "type": "Feature", "properties": { "REGION": "3", "DIVISION": "5", "STATEFP": "54", "STATENS": "01779805", "GEOID": "54", "STUSPS": "WV", "NAME": "West Virginia", "LSAD": "00", "MTFCC": "G4000", "FUNCSTAT": "A", "ALAND": 62266296765, "AWATER": 489206049, "INTPTLAT": "+38.6472854", "INTPTLON": "-080.6183274" }, "geometry": { "type": "Polygon", "coordinates": [ [ [ -81.7472545, 39.0953799 ], [ -81.7477735, 39.0947589 ], 

When I import it into Google Maps:

function initialize() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 4,
    center: { lat: 49.496675, lng: -102.65625 },
  });
  map.data.addGeoJson('data/states.json')
}

The error shows:

not a Feature or FeatureCollection

"Error at new be (https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:97:207)
at _.ee (https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:98:87)
at _.Jba (https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:124:9)
at jg.addGeoJson (https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:312:48)
at initialize (https://dev.offrs.com/evan/js/zipmap.js:6:12)
at https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:240:146\ at https://maps.googleapis.com/maps/api/js?key=AIzaSyAn2PAcKggOaveyqEkBJCGTYyEUnNqz9Gk&v=3&libraries=drawing&callback=initialize:239:237"

Is there a format setting I need to be looking at to make the GeoJSON work properly?

3
  • 1
    I’m sorry I’m confused on what you’re trying to say
    – arcee123
    Apr 29, 2023 at 11:41
  • that is the file. it is in the data folder under states.json. What am I missing?
    – arcee123
    Apr 29, 2023 at 14:01
  • ohhh...wait. that didn't work before...The reason why I think this is a partial QGIS issue, is becuase I downloaded other JSON before out of github, and used map.data.loadGeoJson( "data/states.json" );. and it worked without fail.
    – arcee123
    Apr 29, 2023 at 14:14

1 Answer 1

4

I figured it out. The JSON exceeded the size allotment for Google Maps. When I broke down the JSON into smaller chunks, they just loaded perfectly.

Lessons learned. When exporting layers from QGIS...check the JSON file size. I think it needs to be <10Mb or something.

Of note, you CAN pass a path into the loadGeoJson call.

let counties = new google.maps.Data({map:map});
counties.loadGeoJson('data/counties/STATEFP_' + state + '.json');

Works like a champ.

1
  • 2
    If you consider this to be the solution, please accept your own answer (the tick icon to the left). It will help future readers with the same problem to quickly see a working solution has been provided.
    – Matt
    Apr 30, 2023 at 7:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.