Question

我试图理解如何将d3.js示例中的函数应用到地图，特别是重要依赖于crossfilter库的功能的geoChoroplethChart。

在迈克博斯托克的例子中，有一个名为Zoom to Bounding Box II，它将缩放以聚焦于所选实体并将其置于观察区域中。

geoChoroplethChart的代码似乎将函数作为附录，即它们使用.附加到地图函数，如下面的代码段所示。

我对如何合并Zoom to Bounding Box II示例中的缩放方法感到困惑。

我是否应该尝试修改它们，以便我可以将它们添加为参数，并加上.？

我是否应该将应用于我的geoChoroplethChart的所有函数重新实现为独立的？

我一直在网上搜索有关解决此问题的正确方法的答案，但到目前为止我还没有找到任何明确的指导。

        //This is the data for the Map
    d3.json("data/europe.json", function (error, eu) { 

        console.log('map', eu)
        usChart
        .width(590)
        .height(500)
        .projection(projection
                    .scale((1200 + 1) / 2 )
                    .translate([660 / 4, 3360 / 4])
                    .precision(.1)
                    )
                .dimension(countries)
                .group(countriesJobsdSum)

                    .filterHandler(function(dimension, filter){     
    dimension.filter(function(d) {return usChart.filter() != null ? d.indexOf
    (usChart.filter()) >= 0 : true;}); // perform filtering
    return filter; // return the actual filter value
 })

                .colors(d3.scale.quantize().range(
                    ["#8c857d", "#d982ab", "#d9525e", "#a63f52", "#8c6976", "#55b1b1", "#637e9e"])
                )
                .colorDomain([0, 200])
                .colorCalculator(function (d) { return d ? usChart.colors()(d) : '#ccc'; })
                .overlayGeoJson(eu.features, "countries", function (d) {
                    return d.properties.name;
                    //return d.properties.Country;
                })
                .transitionDuration(0)
                .title(function (d) {
                    return "Country: " + d.key + "\nNumber of Jobs: " + numberFormat(d.value ? d.value : 0) ;
                });

我的所有代码都可以找到here。

将d3.js示例函数应用于crossfilter geoChoroplethChart

0 个答案: