dc.js渲染阿根廷地图

时间:2014-09-14 20:31:53

标签: javascript d3.js geojson dc.js

我试图渲染阿根廷的地图,但我无法在屏幕上看到任何内容。数据看起来很好,加载很好,但不能使它渲染。我曾经尝试过一个省,布宜诺斯艾利斯,但仍然没有运气。

尝试使用us-states.json文件可以正常工作,两者的格式完全相同。需要注意的一点是,如果我从us文件中删除功能列表中的所有元素,并且只留下一个。然后,当我希望只显示该状态时,也不会呈现任何内容。

这是布宜诺斯艾利斯,geojson文件:

> {"type":"FeatureCollection","features":[
> {"type":"Feature","id":"01","properties":{"name":"Buenos Aires"},
>  "geometry":{"type":"Polygon","coordinates":[[[-60,33.468412],[-59.927837,33.476587],[-59.900372,33.506521],[-59.831891,33.52557],[-59.810264,33.541013],[-59.809488,33.582725],[-59.794044,33.59817],[-59.757744,33.609757],[-59.705971,-33.606036],[-59.663178,-33.618371],[-59.636867,-33.641813],[-59.629915,-33.676568],[-59.597474,-33.690467],[-59.533572,-33.636142],[-59.517052,-33.631812],[-59.479366,-33.653244],[-59.468237,-33.70367],[-59.436051,-33.730632],[-59.378453,-33.736409],[-59.33445,-33.728785],[-59.253786,-33.722406],[-59.234857,-33.739513],[-59.251843,-33.771951],[-59.254837,-33.793599],[-59.236445,-33.810365],[-59.214775,-33.814435],[-59.16838,-33.809753],[-59.138309,-33.844557],[-59.11823,-33.84919],[-59.065547,-33.832862],[-59.027477,-33.846641],[-59.005227,-33.839841],[-58.987116,-33.860437],[-58.961976,-33.872594],[-58.934165,-33.874087],[-58.900476,-33.889978],[-58.872386,-33.931906],[-58.836549,-33.951682],[-58.812904,-33.951991],[-58.778995,-33.942608],[-58.739989,-33.961273],[-58.671258,-34.026138],[-58.645311,-34.038495],[-58.595259,-34.037258],[-58.577447,-34.02699],[-58.552244,-34.027975],[-58.477275,-34.002624],[-58.416205,-34.002772],[-58.364688,-34.05032],[-58.361631,-34.090057],[-58.37112,-34.171764],[-58.355473,-34.190349],[-58.382306,-34.203287],[-58.403648,-34.22519],[-58.403971,-34.250848],[-58.416714,-34.264477],[-58.451519,-34.265855],[-58.475472,-34.273422],[-58.501871,-34.264833],[-58.499999,-34.288319],[-58.510463,-34.308801],[-58.485051,-34.334586],[-58.459639,-34.377189],[-58.482882,-34.384673],[-58.513651,-34.438307],[-58.481367,-34.478858],[-58.479222,-34.496414],[-58.461283,-34.533017],[-58.501335,-34.552203],[-58.530917,-34.615654],[-58.527187,-34.655242],[-58.460729,-34.704766],[-58.422776,-34.661591],[-58.37418,-34.65712],[-58.342014,-34.631561],[-58.301851,-34.667319],[-58.234795,-34.702146],[-58.195997,-34.735056],[-58.16567,-34.747637],[-58.116922,-34.750584],[-58.051795,-34.776847],[-58.004548,-34.784972],[-57.955458,-34.827601],[-57.942039,-34.832093],[-57.895067,-34.828051],[-57.86365,-34.840155],[-57.804524,-34.876635],[-57.786682,-34.892431],[-57.719438,-34.927913],[-57.668342,-34.941219],[-57.599737,-34.990182],[-57.508094,-35.024604],[-57.441606,-35.074996],[-57.352159,-35.147494],[-57.273995,-35.228083],[-57.232159,-35.264036],[-57.206164,-35.298494],[-57.18551,-35.336523],[-57.147196,-35.388955],[-57.13188,-35.420224],[-57.127308,-35.444587],[-57.152059,-35.493404],[-57.214493,-35.55551],[-57.258091,-35.605264],[-57.346144,-35.719511],[-57.364058,-35.746946],[-57.370763,-35.790898],[-57.392765,-35.876278],[-57.38804,-35.922771],[-57.380444,-35.932072],[-57.382459,-35.966949],[-57.30349,-36.094862],[-57.281211,-36.124833],[-57.240288,-36.168653],[-57.203319,-36.202228],[-57.11645,-36.270904],[-57.077753,-36.294157],[-57.015634,-36.324507],[-56.979225,-36.331636],[-56.928925,-36.332946],[-56.91097,-36.342232],[-56.877788,-36.329194],[-56.839714,-36.332426],[-56.771617,-36.326611],[-56.77423,-36.294709],[-56.750287,-36.306719],[-56.716009,-36.354796],[-56.700886,-36.404709],[-56.691443,-36.481229],[-56.684368,-36.610979],[-56.673042,-36.709156],[-56.674723,-36.823179],[-56.664959,-36.880683],[-56.689134,-36.914296],[-56.746298,-36.979228],[-56.812123,-37.059862],[-56.837297,-37.097818],[-56.946242,-37.236945],[-56.996763,-37.296966],[-57.028759,-37.346278],[-57.090853,-37.450905],[-57.135674,-37.502807],[-57.25822,-37.611104],[-57.383401,-37.711024],[-57.41,-37.734082],[-57.486806,-37.821482],[-57.514489,-37.869285],[-57.542025,-37.969639],[-57.539984,-38.004743],[-57.525108,-38.020773],[-57.538564,-38.042042],[-57.544565,-38.101134],[-57.593852,-38.119906],[-57.634176,-38.170577],[-57.68209,-38.2046],[-57.727868,-38.228897],[-57.77688,-38.245592],[-57.833947,-38.277634],[-57.853447,-38.296657],[-57.966364,-38.336265],[-58.060131,-38.381974],[-58.153185,-38.416709],[-58.24378,-38.447752],[-58.279258,-38.465319],[-58.443679,-38.516225],[-58.517494,-38.543041],[-58.688719,-38.574556],[-58.80612,-38.610571],[-58.829373,-38.622924],[-58.917482,-38.643961],[-59.011368,-38.678296],[-59.073862,-38.689451],[-59.113201,-38.700779],[-59.230497,-38.715393],[-59.375576,-38.74366],[-59.390618,-38.751218],[-59.508484,-38.766878],[-59.677247,-38.794345],[-59.721156,-38.804229],[-59.788664,-38.8264],[-59.854022,-38.837657],[-60.123554,-38.866708],[-60.169476,-38.876476],[-60.200471,-38.877756],[-60.275653,-38.889658],[-60.429246,-38.920363],[-60.481121,-38.927285],[-60.695942,-38.950351],[-60.771272,-38.962428],[-60.846952,-38.979449],[-60.991382,-38.981156],[-61.045782,-38.985413],[-61.131589,-38.999433],[-61.17714,-38.999507],[-61.293918,-38.98959],[-61.384456,-38.988653],[-61.477512,-38.997597],[-61.5501,-39.007273],[-61.612574,-39.00585],[-61.669357,-38.991023],[-61.693955,-38.97029],[-61.738988,-38.971479],[-61.808767,-38.996002],[-61.865764,-38.971256],[-61.896678,-38.970885],[-61.948399,-38.954685],[-62.023886,-38.939347],[-62.067221,-38.919886],[-62.093491,-38.901056],[-62.105344,-38.870457],[-62.15221,-38.821447],[-62.181422,-38.81943],[-62.189282,-38.805812],[-62.237114,-38.805938],[-62.249598,-38.795892],[-62.301618,-38.784181],[-62.312512,-38.737775],[-62.35722,-38.718534],[-62.381696,-38.723769],[-62.384384,-38.741878],[-62.42513,-38.735653],[-62.476063,-38.745981],[-62.51596,-38.716412],[-62.521689,-38.741096],[-62.542759,-38.741096],[-62.544486,-38.774255],[-62.553466,-38.790144],[-62.525488,-38.803615],[-62.518926,-38.818122],[-62.453245,-38.827363],[-62.413899,-38.823238],[-62.367544,-38.870954],[-62.328744,-38.885943],[-62.322499,-38.902679],[-62.343334,-38.939798],[-62.343228,-38.955723],[-62.31807,-38.979426],[-62.317949,-39.007615],[-62.305042,-39.018258],[-62.307891,-39.054656],[-62.342557,-39.09181],[-62.356741,-39.097929],[-62.34068,-39.140007],[-62.346819,-39.161007],[-62.295633,-39.235244],[-62.327697,-39.257816],[-62.318347,-39.270332],[-62.278848,-39.266049],[-62.188769,-39.287664],[-62.13177,-39.292972],[-62.060307,-39.323001],[-62.034843,-39.352817],[-62.012729,-39.357522],[-62.011976,-39.382118],[-62.087434,-39.390134],[-62.168077,-39.331472],[-62.183594,-39.30062],[-62.197199,-39.306669],[-62.241932,-39.296016],[-62.284509,-39.303577],[-62.293573,-39.322164],[-62.264917,-39.351643],[-62.239028,-39.349031],[-62.21471,-39.371282],[-62.18407,-39.385823],[-62.177319,-39.399586],[-62.130579,-39.405558],[-62.041459,-39.445062],[-62.047961,-39.473442],[-62.083983,-39.552999],[-62.110231,-39.628521],[-62.112977,-39.667032],[-62.096204,-39.694989],[-62.111782,-39.730703],[-62.116271,-39.769158],[-62.113346,-39.844896],[-62.143355,-39.858422],[-62.167721,-39.829309],[-62.19791,-39.838087],[-62.225334,-39.835037],[-62.241431,-39.817541],[-62.29042,-39.82034],[-62.300743,-39.830313],[-62.265226,-39.858657],[-62.287866,-39.877088],[-62.310706,-39.875268],[-62.329873,-39.957967],[-62.324555,-39.982504],[-62.340696,-40.065259],[-62.317167,-40.147089],[-62.331791,-40.17816],[-62.361151,-40.21753],[-62.390791,-40.230524],[-62.422699,-40.235206],[-62.443128,-40.249606],[-62.444728,-40.2649],[-62.478563,-40.293267],[-62.48447,-40.330169],[-62.461139,-40.360385],[-62.440114,-40.415979],[-62.421732,-40.429375],[-62.422922,-40.458103],[-62.367924,-40.49364],[-62.345895,-40.491891],[-62.318581,-40.506589],[-62.318284,-40.537297],[-62.287069,-40.551421],[-62.281834,-40.569743],[-62.256354,-40.563005],[-62.259208,-40.538235],[-62.177544,-40.580035],[-62.168973,-40.605686],[-62.174981,-40.637814],[-62.223407,-40.677713],[-62.234341,-40.707273],[-62.25773,-40.743761],[-62.311643,-40.87096],[-62.390897,-40.912112],[-62.543104,-40.955241],[-62.649282,-41.001496],[-62.714311,-41.035717],[-62.758803,-41.033073],[-62.788305,-41.02205],[-62.80078,-40.975906],[-62.842241,-40.940167],[-62.847523,-40.92592],[-62.885947,-40.885038],[-62.915692,-40.866811],[-62.955686,-40.818756],[-62.987811,-40.802442],[-63.02012,-40.796439],[-63.060864,-40.771346],[-63.088805,-40.766047],[-63.144491,-40.737138],[-63.165537,-40.735602],[-63.194028,-40.718056],[-63.255214,-40.728153],[-63.291194,-40.728325],[-63.304177,-40.709817],[-63.325342,-40.712137],[-63.354026,-40.700544],[-63.378837,-40.711014],[-63.380492,-40.494807],[-63.380741,-40.292281],[-63.382369,-40.028397],[-63.385097,-39.934278],[-63.382488,-39.84285],[-63.381418,-39.663749],[-63.383694,-39.482984],[-63.384195,-39.328632],[-63.382869,-39.212897],[-63.383777,-38.999633],[-63.381311,-38.51169],[-63.38308,-38.135447],[-63.385749,-37.995333],[-63.385889,-37.766186],[-63.385227,-37.515306],[-63.385874,-37.169504],[-63.385292,-36.808332],[-63.384416,-36.522249],[-63.385789,-36.394942],[-63.38489,-36.195135],[-63.38587,-35.769589],[-63.385473,-35.444325],[-63.385355,-35.228273],[-63.385503,-34.999994],[-63.384875,-34.532123],[-63.383307,-34.383325],[-63,-34.384935],[-62.936834,-34.386636],[-62.474833,-34.386986],[-62.193234,-34.38484],[-61.808023,-34.38466],[-61.719705,-34.385737],[-61.51655,-34.196168],[-61.5,-34.173187],[-61.417652,-34.102747],[-61.181463,-33.887022],[-61.107578,-33.824711],[-61.088884,-33.794335],[-61.030515,-33.745072],[-60.932717,-33.656903],[-60.921309,-33.636025],[-60.918342,-33.58915],[-60.906139,-33.574274],[-60.863362,-33.546133],[-60.826929,-33.542948],[-60.78658,-33.573973],[-60.754931,-33.58695],[-60.686815,-33.58418],[-60.665292,-33.59127],[-60.624241,-33.625138],[-60.601106,-33.627017],[-60.557201,-33.645611],[-60.522646,-33.647172],[-60.468754,-33.636558],[-60.456968,-33.62204],[-60.457501,-33.581175],[-60.418623,-33.557564],[-60.424053,-33.527652],[-60.409529,-33.465835],[-60.389932,-33.447002],[-60.348625,-33.424491],[-60.335573,-33.41145],[-60.321831,-33.372518],[-60.323725,-33.349104],[-60.290093,-33.32136],[-60.276555,-33.289647],[-60.264447,-33.27963],[-60.265888,-33.258546],[-60.200683,-33.292183],[-60.190569,-33.303215],[-60.16963,-33.349029],[-60.1111,-33.373025],[-60.087143,-33.394431],[-60.046993,-33.440998],[-60,-33.468412]]]}}
> ]}

和Javascript代码:

$scope.argentinaChart = dc.geoChoroplethChart("#comments-in-map-chart");
$scope.data = crossfilter($scope.data);

$scope.provincias = $scope.data.dimension(function (d) {return d["location"];});
$scope.provinciasComments = $scope.provincias.group().reduceCount();

var numberFormat = d3.format(".2f");
$scope.argentinaChart
    .width(990)
    .height(500)
    .dimension($scope.provincias)
    .group($scope.provinciasComments)
    .colors(d3.scale.quantize().range(["#E2F2FF", "#C4E4FF", "#9ED2FF", "#81C5FF", "#6BBAFF", "#51AEFF", "#36A2FF", "#1E96FF", "#0089FF", "#0061B5"]))
    .colorDomain([0, 200])
    .colorCalculator(function (d) { return d ? $scope.argentinaChart.colors()(d) : '#ccc'; })
    .overlayGeoJson($scope.geoData.features, "provincias", function (d) {
return d.properties.name;
                })
    .title(function (d) {
              return "Provincia: " + d.key + "\nComentarios: " + numberFormat(d.value ? d.value : 0);
                });

dc.renderAll();

1 个答案:

答案 0 :(得分:1)

没关系,我忘了改变投影。记住这一点,默认是albersUs,专注于美国。 MEH ....

对于阿根廷:

d3.geo.mercator().scale(800).center([-65, -35]);