Заполните пробел в DC.JS Heat Map по умолчанию или рассчитанное значение

Question

Заполните пробел в DC.JS Heat Map по умолчанию или рассчитанное значение

Можно ли легко заполнить пробелы в диаграмме HeatMap, для которых не заданы значения в источнике данных? Проблема, с которой я столкнулся, иллюстрируется здесь: https://jsfiddle.net/qk94cuaq/.

var data = [{Expt: 1,Run: 1, Speed: 850},
{Expt: 1,Run: 2, Speed: 740},
{Expt: 2,Run: 2, Speed: 940},
{Expt: 3,Run: 1, Speed: 880},
{Expt: 3,Run: 3, Speed: 880},];

var chart = dc.heatMap("#test");

var ndx = crossfilter(data),
    runDim = ndx.dimension(function (d) {
        return [+d.Run, +d.Expt];
    }),
    runGroup = runDim.group().reduceSum(function (d) {
        return +d.Speed;
    });

chart.width(45 * 4 + 80)
    .height(45 * 4 + 40)
    .dimension(runDim)
    .group(runGroup)
    .keyAccessor(function (d) {
    return +d.key[0];
})
    .valueAccessor(function (d) {
    return +d.key[1];
})
    .colorAccessor(function (d) {
    return +d.value;
})
    .colors(["#ffffd9", "#edf8b1", "#c7e9b4",
    "#7fcdbb", "#41b6c4", "#1d91c0", "#225ea8", "#253494", "#081d58"])
    .calculateColorDomain();

chart.render();

<link href="https://dc-js.github.io/dc.js/css/dc.css" rel="stylesheet"/>
<script src="https://dc-js.github.io/dc.js/js/dc.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.11/crossfilter.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.js"></script>
<body>
     <h2> Heat Map Testing </h2>

    <div id="test" class="dc-chart"></div>
</body>

1

dc.js crossfilter

Источник

user908547 23 мар '15 в 18:37

1 ответ

Решение

Другие вопросы по тегам dc.js crossfilter

user180664 23 мар '15 в 19:03 2015-03-23 19:03 · Accepted Answer · 2015-03-23 19:03

Правильный способ сделать это - вероятно, расширить dc.js и иметь возможность выбрать то, что вам нужно. Тогда каждый может извлечь выгоду. Это было бы относительно просто в d3, и это было бы достаточно близко к решению, которое я даю для вашего конкретного случая.

Итак, если вы не хотите вносить изменения, просто преобразуйте свои данные:

var dataDict = {};
data.forEach(function (item) {
    dataDict[item.Expt + '|' + item.Run] = item;
});
var dataCoalesced = [];
for (var expt = 1; expt <= 5; expt ++) {
    for (var run = 1; run <= 20; run ++) {
        dataCoalesced.push(dataDict[expt + '|' + run] || {
            Expt: expt,
            Run: run,
            Speed: 0,
        });
    }
}