We’re always looking for interesting data to explore with Mapbox tools, so when we found this cool dataset of 311 incident reports from NYC Open Data we had to check it out. In the map below, built with Mapbox GL JS and Turf.js, you can explore restaurant disturbance complaints in New York City from 2015. We visualized all 38,400 restaurant-related incidents using 3D hexbins. Click on a hexbin to drill down to details for each complaint.

In Manhattan, the highest density of complaints are in Uptown, the Lower East Side, and Midtown. Using the filters and drill-downs on the dashboard, you can tell that noise from bars and restaurants makes up more than half of all complaints. Would you want to open a business or rent an apartment near the loudest blocks?

In the datasets, each 311 incident and restaurant is geocoded to the nearest street centerline. Hexbinning is useful here because multiple complaints at the same location would appear as a single incident if we had used a dot map, but with hexbins, you can quickly find the areas with high levels of complaints.

hexbin vs. dots

To create the hexbins, I used turf.hexGrid() to create a grid, then aggregated the points into bins using turf.within().

I used the fill-extrusion layer type coupled with data driven styling for the fill-color of each bin. The height and color of each hexbin updates dynamically based on the complaint type selected.

Have your own spatial data to visualize? Tweet us at @Mapbox and show us what you’re working on!