I'm pulling polygon data (neighborhood boundaries in San Francisco) from an API on https://data.sfgov.org/Geographic-Locations-and-Boundaries/SF-Find-Neighborhoods/pty2-tcw4/data. While I made sure on my console that I'm indeed pulling the data, I am having trouble visualizing the layer as displayed on the original page.

I kept the JS fiddle simple. I've tried different D3 methods but I keep running into dead ends, usually with a feature being undefined.

  • I don't understand your code; It is getting the data using $.getJSON(), but you are initilizing an empty GeoJSON using var geojsonLayer = new L.GeoJSON(); – Devdatta Tengshe Jul 3 '18 at 5:52

The data that is retrieved from the API is not in GeoJSON format. The geometry attribute should be called geometry and not the_geom (the_geom makes me think of an export from PostGIS).

So first you'll have to parse the JSON file into a proper GeoJSON file and then you can use something like:

var geojsonLayer = new L.GeoJSON(jsonParsedToGeoJSON).addTo(map);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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