D3의 GeoJSON : 경로가 데이터에 바인딩되지 않음

Question

세부 사항 :

다음과 같은 설정이 있습니다. 생성 된 사용자 정의 topjson 파일은 단순히 내 웹 페이지에 표시하려고합니다. 내가 콘솔에서 볼 수있는 생성 된 및 데이터가 올바르게로드 된 있지만 d3 어떤 경로 요소 렌더링 및 아무것도 표시됩니다.

자바 스크립트

var width = 960; 
    var height = 500; 


    var svg = d3.select('body').append('svg') 
     .attr('width', width) 
     .attr('height', height); 


    var projection = d3.geo.albersUsa() 
     .scale(1000) 
     .translate([width/2, height/2]); 


    var path = d3.geo.path() 
     .projection(projection); 

     d3.json('http://localhost.com/calgary.json', function(error, calgary) { 
     svg.append('path') 
     .datum(topojson.feature(calgary)) 
     .attr('d', path) 
     .attr('fill','red'); 
     }); 

사용자 정의 Topojson 파일 :

http://pastebin.com/ere2Ww7K

의 종속은 :
첫째 : 나를 위해

<script src="http://d3js.org/d3.v3.min.js"></script> 
    <script src="http://d3js.org/topojson.v1.min.js"></script> 
    <script> 

Answer 1

당신의 코드에서 두 가지 오류가있는 것 같습니다 , 함수 내부 당신의 topojson 파일이 손상 될 것으로 보인다,

.datum(topojson.feature(calgary, calgary.objects.CALGIS_ATS_SECTIONS))

둘째 : json으로 부하에서 호출, 데이텀 내부 topojson 호출은 두 개의 매개 변수, 객체 인 두 번째를 필요로한다. 이 첫 번째 수정 후, 뭔가 나에게 나타납니다,하지만 그것은 큰 사각형을 작성, 그냥 다각형의 무리입니다.

올바른 토포 (topojson) 파일, 즉 http://bl.ocks.org/mbostock/raw/4090846/us.json을 사용하여 이전 호출에서 "CALGIS_ATS_SECTIONS"을 "land"로 바꾼 것과 동일한 호출을 시도했지만 실제로 원활하게 작동합니다.