Coloring DC.JS Choropleth Charts
Попытка раскрасить хороплетную диаграмму DC.JS. ColorAccessor по умолчанию не работает, и я затрудняюсь заставить все работать. Любая помощь будет огромной. Я чувствую, что некоторая пользовательская функция уменьшения необходима, но я не слишком уверен, как или где.
http://codepen.io/MichaelArledge/pen/vLKZzE?editors=001
chart.width(c_w)
.height(c_h)
.dimension(zip_code_dim)
.group(zip_totals)
.projection(projection)
.colorAccessor(function(d){ console.log(d); return d.value; })
.overlayGeoJson(statesJson.features ,"zip_area");
1 ответ
Решение
Вы не определяете функцию overlayGeoJson, откуда взять значение
Вы определили так:
overlayGeoJson(statesJson.features ,"zip_area");
Должно было
.overlayGeoJson(statesJson.features ,"zip_area",
function(d){ return d.properties.zip})
Теперь b'coz вышеупомянутая функция возвращает почтовые индексы так d.value
будет undefined
.colorAccessor(function(d){ return d.value; })
Так должно быть
.colorAccessor(function (d) { return colors(d); });
Я определил линейную шкалу для цветов, ее значение должно быть возвращено из функции colorAccessor.
var colors = d3.scale.linear().range(["#E2F2FF", "#C4E4FF", "#9ED2FF", "#81C5FF", "#6BBAFF", "#51AEFF", "#36A2FF", "#1E96FF", "#0089FF", "#0061B5"]);
Полный рабочий код здесь
Надеюсь это поможет!