Question

我正在尝试使用同一数据集中的plottable.js创建堆积条形图。有可能吗？

这是我的样本数据集

var data = [{ x: 0, y: 1, m: 10 },
            { x: 1, y: 1, m: 9 },
            { x: 2, y: 3, m: 5 },
            { x: 3, y: 2, m: 5 },
            { x: 4, y: 4, m: 8 },
            { x: 5, y: 3, m: 7 },
            { x: 6, y: 5, m: 5 }];

在http://plottablejs.org/components/plots/stacked-bar/上发布的示例中，它使用了两个数据集。

var plot = new Plottable.Plots.StackedBar()
           .addDataset(new Plottable.Dataset(primaryData).metadata(5))
           .addDataset(new Plottable.Dataset(secondaryData).metadata(3))
           .x(function(d) { return d.x; }, xScale)
           .y(function(d) { return d.y; }, yScale)
           .attr("fill", function(d, i, dataset) { return dataset.metadata(); }, colorScale)
           .renderTo("svg#example");

我的问题是，因为我使用相同的数据集，我需要将'y'函数更改为两个不同的函数，如下所示：

.y(function(d) { return d.y; }, yScale)
.y(function(d) { return d.m; }, yScale)

有可能吗？如果是，怎么样？

...谢谢

Answer 1

您可以根据相同的数据创建两个不同的Plottable.Dataset。

所以从这样开始：

var ds1 = new Plottable.Dataset(data);
var ds2 = new Plottable.Dataset(data);

但是，稍后您需要区分这两个数据集以了解要使用的属性，因此您应该添加元数据

var ds1 = new Plottable.Dataset(data, {name: "ds1"});
var ds2 = new Plottable.Dataset(data, {name: "ds2"});

现在稍后，您可以引用数据集的名称以了解.y（）调用中要返回的值

plot.y(function(d, i, ds){
  if(ds.metadata().name == "ds1"){
    return d.y;
  }
  else{
    return d.m;
  }
}, yScale);

使用相同的数据集创建Plottable.js堆积条形图

1 个答案: