Question

我在一个页面中显示多个条形图。数据分为不同的任务。

task,time,name
task1,123,a
task1,110,c
task1,115,d
task1,90,b
task2,26,c
task2,50,d
task2,18,a
task2,30,b

我将数据嵌套在第一列（即任务）中，然后显示两个条形图。但是两个条形图的y轴最大值都为123（即整个数据的最大y轴值）。因此，第二个图表的最大值为123，但高度较小的条形图。我希望第二个图表相应地“缩放”，即最大高度应为50。下面是我尝试的代码段。

d3.csv("mydata.csv").then(function(data) 
{
        var tasks = d3.nest()
            .key(function(d) {return d.time;})
            .entries(data);

        data.forEach(function(d) { d.time = +(d.time)/60; });

        xRange.domain(data.map(function(d) { return d.name; }));
        yRange.domain([0, d3.max(tasks, function(s) { return s.values[0].time; })]);

        // I tried the following. This too has the same effect
        // tasks.forEach(function(s) { s.maxPrice = d3.max(s.values, function(d) { return d.time; }); });
        // yRange.domain([0, function(s) { return s.maxPrice; }]);
});

如何设置每个任务的y轴最大值，而不是整个数据的最大值？

多个条形图，每个图的y轴最大值未正确设置

0 个答案: