在d3地图中按属性过滤

Question

我想使用复选框过滤基于属性显示在地图上的点。我有：

<div class="filter_options">
    <input class="filter_button" id="HOMICIDE" type="checkbox">a</input><br>
    <input class="filter_button" id="ROBBERY" type="checkbox">b</input><br>
    <input class="filter_button" id="ASSAULT" type="checkbox">c</input><br>

因此，我为每个复选框分配了一个值：

document.getElementById("HOMICIDE").value = "HOMICIDE"
document.getElementById("ASSAULT").value = "ASSAULT"

然后，我想将复选框的值与数据中犯罪类型（'Primary_Type）的值匹配：

d3.selectAll(".filter_button").on("change", function() {
  d3.selectAll('.incident').remove();
  var type = this.value, 

  // I *think* "inline" is the default.
  display = this.checked ? "inline" : "none";
console.log(type)
  svg.selectAll(".incident")
    .filter(function(d) { return d.properties.Primary_Type === type; })
    .attr("display", display)
    .style("opacity", 1)


});

但是，地图上没有任何内容，因此过滤器无法正常工作。任何帮助表示赞赏！