Question

这是我在这里的第一个问题，我很生气。我正在使用DC.js（D3之上的lib），并且试图将自己的数据添加到其中之一。当它大约为10行时，它将对数据进行排序。但是那之后到处都是。

我想按价格（Kurs）分组数据，然后将数量加在一起。然后从低到高的价格排序。这段代码可以在“ dc.barChart”上正常运行，但是在rowChart上我无法正确缩放。

我一直在使用示例代码，但使用自己的CSV。 https://dc-js.github.io/dc.js/examples/row.html

var chart = dc.rowChart("#test");
d3.csv("tickdata.csv").then(function(experiments) {

  experiments.forEach(function(x) {
    x.Volym = +x.Volym;
    x.Kurs = +(roundNumber(x.Kurs,0));
    });

  var ndx                 = crossfilter(experiments),
      runDimension        = ndx.dimension(function(d) {return +d.Kurs;}),
      speedSumGroup       = runDimension.group().reduceSum(function(d) {return +d.Volym;});

 chart
    .width(1024)
    .height(600)
    .margins({top: 20, right: 20, bottom: 20, left: 20})
    .ordering(function(y){return -y.value.Kurs})
    .elasticX(true)
    .dimension(runDimension)
    .group(speedSumGroup)
    .renderLabel(true); 


  chart.on('pretransition', function() {
    chart.select('y.axis').attr('transform', 'translate(0,10000)');
    chart.selectAll('line.grid-line').attr('y2', chart.effectiveHeight());
  });

  chart
    .render();
});

csv看起来像这样：

Tid,Volym,Volym_fiat,Kurs
2018-06-27 09:46:00,5320,6372,1515.408825
2018-06-27 09:47:00,3206,4421,1515.742652
2018-06-27 09:48:00,2699,4149,1515.013167
2018-06-27 09:49:00,3563,4198,1515.175342

我想按“ Kurs”（值）对Y轴进行排序。我可以在条形图中进行此操作，但在RowChart中不起作用。请帮忙！

Answer 1

使用小提琴进行测试会更容易，但是看起来在您的ordering函数中，您假定减小的值将具有Kurs字段（y.value.Kurs）。

但是，当您使用group.reduceSum()时，只会生成一个简单的数字value。

这应该可行

.ordering(function(y){return -y.value})

这是default behavior in dc.js 2.1+，因此您可能根本不需要该行。

顺便说一句，如果您在猜测缩减数据的正确形状方面遇到问题，对任何访问器进行故障排除的方法是在其中放置一个断点或console.log。这样的情况，您应该很快就会发现出了问题。

在Y轴上排序行图时出现问题。 Dc-js行图

1 个答案: