基于密钥

设置choropleth中的颜色我试图根据链接到该密钥的某些属性设置choropleth的颜色。但是，所有设置颜色的方法只具有该特定位置的值，而不是其关键。基于密钥

var map = dc.geoChoroplethChart(dom) 
    .height(width*0.8) 
    .width(width) 
    .dimension(dim) 
    .projection(projection) 
    .colorAccessor(function(d,i){ 
    // it isn't the usual d={key,value} but only d=value 
    }) 
    .colorCalculator(function(d,i){ 
    // it isn't the usual d={key,value} but only d=value 
    //and it's deprecated 
    }) 
    .title(function (d) {return d.key + ': ' + d.value;}) 
    // got the key,value as expected

如何从colorAccessor获取密钥？它从其他功能（例如标题）工作正常

来源

2017-02-28 Xavier

你没有想象它：图表确实只传递了值，而且它完全不一致;这部分是因为它具有地图数据和交叉过滤数据，但大多数情况下可能没有想到。看起来你可能会使用'i'作为你的geoJson的索引来获取密钥？ – Gordon

Ouch。你认为这是可以改变的吗？它会是连贯的，但打破每一个choropleth;（我正在检查你的黑客看看我是否可以解决它 – Xavier

是的，事实上[你在几年前报告这个问题]（https://github.com/dc -js/dc.js/issues/872），并且它与其他图表中的类似问题有关联，也许最安全的做法是一次改变所有这些，并且像我们在弃用函数时一样附加一个控制台警告给他们。。*是关于修复破损的接口。 – Gordon

我结束了使用的解决方法：创建复制的值的键自定义功能降低。

//the iso code of the country is the key 
    var group = dim.group().reduce(
    function (p, v) { 
     p.total += +v.total; 
     if (p.iso == "") { 
     p.iso = v.country; 
     } 
     return p; 
    }, 
    function (p, v) { 
     p.total -= +v.total; 
     return p; 
    }, 
    function() { return { 
     total:0,iso:"" 
     }; 
    }); 

var map = dc.geoChoroplethChart(dom) 
    .colorAccessor(function(d){ 
    if (!d || !d.value.iso) 
     return null; // area without data 
    // now d.value.iso contains the key, and d.value.total contains the value 
    return colorIndex(d.value.iso,d.value.total);// do magic 
    }) 
    ....

来源

2017-03-03 07:35:54 Xavier

所以它原来是“正常”。正如Gordon所建议的那样，解决方案是将geojson的索引与您想要的数据进行映射。就我而言，我对一个国家阵列上的每个国家额外的数据：

var geojson=topojson.feature(europe,europe.objects.countries); 
    // map index in the map to country data this hack is to solve a problem of not having the key on the colorAccessor 
    var geo2data=[]; 
    geojson.features.forEach(function(d,i1){ 
    var i2=country.findIndex(function(c) { 
     return c.country.toUpperCase()==d.id}); 
    geo2data[i1] = i2; 
    }); 

    var map = dc.geoChoroplethChart(dom) 
    ... 
    .colorAccessor(function(v,i){ 
    if (geo2data[i] >= 0){ 
     //geo2data[i] contains extra values, eg 
     return v/country[geo2data[i]].threshold; 
    } 
    return v; 
    })

来源

2017-03-01 16:17:56 Xavier

哇，这是非常痛苦的，但我不明白如何使它与当前的API更好。发布解决方法！ – Gordon

回答

相关问题