小编Syl*_*mir的帖子

如何在dc.geoChoroplethChart中添加缩放效果?

我开始使用dc.js库创建各种图形,当我尝试使用dc.js创建Geo Choropleth地图并且无法添加缩放和移动地图的能力时,我遇到了问题.
我看到的所有例子都是使用d3和svg ..但是一旦我使用了这些例子,我就无法使用dc.dimention的数据和所有的crossfilter计算.

例如我的代码是:

 d3.json("world-countries.json", function (statesJson) {
        geoChart.width(1000)
                .height(600)
                .dimension(countryDim)
                .projection(d3.geo.mercator()
                .scale((960 + 1) / 4 )
                .translate([960 / 4, 960 / 4])
                .precision(.1))
                .group(countryGroup)
                .colors(d3.scale.quantize().range(["#E2F2FF","#C4E4FF","#9ED2FF","#81C5FF","#6BBAFF","#51AEFF","#36A2FF","#1E96FF","#0089FF","#0061B5"]))
                .colorDomain([0, 200])
                .colorCalculator(function(d){ returnd ?geoChart.colors()(d) :'#ccc'; })
                .overlayGeoJson(statesJson.features,"state",function(d){
                    return d.properties.name;
                })
                .title(function (d) {
                    return "State: " + d.key + (d.value ? d.value : 0) + "Impressions";
                });        
Run Code Online (Sandbox Code Playgroud)

哪个效果很好,但我想添加缩放效果并能够移动地图.我怎样才能做到这一点?!?!

提前致谢!

map zooming dc.js

5
推荐指数
1
解决办法
2036
查看次数

标签 统计

dc.js ×1

map ×1

zooming ×1