leaflet.js의 "viewreset"지도가 올바르게 축소되지 않습니다.

Question

저는 Leaflet.js를 처음 사용합니다. 전단지와 D3을 사용하여 OSM에 레이어를 추가하려고합니다. 하나의 도트를 볼 수 있지만 다른 도트가지도를 보여주고 있는지 확인하기 위해 축소하면 올바르게 다시 그려지지 않으며 "TypeError : t가 정의되지 않았습니다."라는 메시지가 표시됩니다. 여기

내 코드의 대량입니다 :

/* We simply pick up the SVG from the map object */ 
var svg = d3.select("#map").select("svg"), 
g = svg.append("g"); 

d3.tsv("DH_Doig.tsv", function(data) { 
    /* Add a LatLng object to each item in the dataset */ 
    data.forEach(function(d) { 
    if (d.SoundLat && d.SoundLong) { 
    d.SoundLat = +d.SoundLat; 
    d.SoundLong = +d.SoundLong; 
    d.SoundLatLong = new L.LatLng(d.SoundLat, d.SoundLong); 
    //d.LatLng = new L.LatLng(d.circle.coordinates[0], 
           //d.circle.coordinates[1]) 
       //console.log(d.SoundLatLong) 

    } 

//console.log(d.SoundLatLong); 내가 기초로이 예제를 사용하고

    map.latLngToLayerPoint(d.SoundLatLong).x +","+ 

: })

var feature = g.selectAll("circle") 
     .data(data) 
     .enter().append("circle") 
     .style("stroke", "black") 
     .style("opacity", .6) 
     .style("fill", "red") 
     .attr("r", 20); 

    map.on("viewreset", update); 
    update(); 

    function update() { 
     feature.attr("transform", 
     function(d) { 
      console.log(d.SoundLatLong); //added to see lat long 
      return "translate("+ 
       map.latLngToLayerPoint(d.SoundLatLong).x +","+ 
       map.latLngToLayerPoint(d.SoundLatLong).y +")"; 
      } 
     ) 
    } 
}) 

는 형식 오류 메시지는이 라인을 참조하고있다 여기에 Map using leaflet.js and d3 combined.

을의 plunk 내 암호.

Answer 1

문제는 내가 내 TSV에 null 행이 있다고 생각했는데, if (d.SoundLat & & d.SoundLong)가 null을 잡았지만 분명히 그렇지 않다고 생각했습니다.