D3 Map With Checkbox Filtering

I have a made a d3 symbolic map and would like the user to be able to filter points by an attribute called 'type'. There are three types: a, b, c, each of which has an associated h

Solution 1:

Something like this should work. Add a value attribute for your checkboxes so you know what they're referring to.

d3.selectAll(".filter_button").on("change", function() {
  var type = this.value, 
  // I *think* "inline" is the default.
  display = this.checked ? "inline" : "none";

  svg.selectAll(".symbol")
    .filter(function(d) { return d.properties.type === type; })
    .attr("display", display);
});