Question

我对protovis很新。我试图理解http://mbostock.github.com/protovis/docs/panel.html中的示例我可以理解left(function() this.index * 10)实际上是left(function(){return this.index * 10;})，并且当调用该函数时，范围被传递给this并且很好，直到现在。 BUt data(function(array) array)不会从this获取数组。而是传递给它。从哪里传递array？我无法理解链条的流动。

Answer 1

这是Protovis的许多部分之一，起初有点令人困惑。向标记添加数据时，例如：

var mark = new pv.Panel()
    .data([1,2,3]);

对于data数组中的每个项，标记将被复制一次，并将相应的项作为其第一个参数传递给它的函数，例如：

new pv.Panel()
    .data([1,2,3])
    .title(function(d) { // <-- d is 1, 2, or 3
        return d;
    });

您附加到mark的任何子标记也会收到此数据点，然后子标记可以将其用作其函数的输入参数，例如：

new pv.Panel()
    .data([1,2,3])
  .add(pv.Label)
    .text(function(d) { // <-- d is 1, 2, or 3
        return d;
    });

但是，子标记也可以定义自己的data()，这将相应地复制该标记。儿童商标的数据可以完全独立，例如：

new pv.Panel()
    .data([1,2,3])
  .add(pv.Label)
    .data([3,4,5])
    .text(function(d) { // <-- d is 3, 4, or 5
        return d;
    });

但是，通常情况下，如您链接到的示例中，父级将有一个2或3-d数组作为其数据，并且子级将其data()基于它传递的子数组：< / p>

new pv.Panel()
    .data([[1,2,3], [3,4,5]])
  .add(pv.Label)
    .data(function(d) { // <-- d is [1,2,3] or [3,4,5]
        return d;
    })
    .text(function(d) { // <-- d is either 1, 2, or 3, 
                        // OR 3, 4, or 5
        return d;
    });

protovis魔法属性

1 个答案: