D3-通过鼠标事件在传单地图上画线

Question

我正在尝试实现this example。但是我使用的是d3 v4和第1版的传单。在svg函数上的鼠标移动中，我正在对线条进行样式设置，但会向我抛出一个错误.clear()，我可以形成套索，但它都是黑色的，这意味着圈子的样式和线条都没有。我不知道为什么行变量为null？这是我的代码-

Uncaught TypeError: Cannot read property 'style' of null

Answer 1

没有错误的地方很难解释。

最好将所有样式的东西放在style标记中。

您在使用绑定数据到点时不一致

您在这里使用d

    pointsG.selectAll(".points").style({
      fill: function(d) {
        var isInside = inside(project(d), projected);
        //console.log(project(d), isInside)
        if(isInside) {
          return "#ff8eec";
        } else {
          return "#0082a3"
        }
      }
    })

您在这里使用d.LatLng

function updateLayers(){
  pointsG.selectAll('.points')
      .attr('cx', function(d){ return map.latLngToLayerPoint(d.LatLng).x})
      .attr('cy', function(d){ return map.latLngToLayerPoint(d.LatLng).y})
  renderLasso();
};