Question

我想使用过渡，幸运的是Bostock做了一个我可以在我自己的图表中使用的例子。问题是我不完全理解语法，我不知道是否是一些我无法弄清楚的Javascript或D3.js方法链接的东西：

原始示例： https://bl.ocks.org/mbostock/3885705

我使用的部分：

var transition = svg.transition().duration(750),
        delay = function(d, i) { return i * 50; };

我使用它的方式（我稍微将延迟功能修改为“delayF”，以便我自己更容易看到它是什么）：

var transition = myChart.transition().duration(750),
    delayF = function(d, i) { return i * 50; };

transition.selectAll("circle")
    .delay(delayF)
    .attr("cx", function(d) { 
     return xScale(d.endedA); })
    .attr("cy", function (d)
    {
        return yScale(d["Duration (min)"]);
    })

我不明白的是

...duration(750),
            delay = function(d, i) { return i * 50; };

他以某种方式将一个函数链接到其他方法，或者你应该如何表达它。

我尝试修改它以查看我是否能更好地理解它并且这有效（delayF函数在delay-method中正确）：

var transition = myChart.transition().duration(750);

        transition.selectAll("circle")
            .delay(function(d, i) { return i * 50; })
            .attr("cx", function(d) { 
             return xScale(d.endedA); })
            .attr("cy", function (d)
            {
                return yScale(d["Duration (min)"]);
            })

然而，这没有（delayF作为它自己的函数，没有逗号和之前的方法之间的逗号：

var transition = myChart.transition().duration(750);
        delayF = function(d, i) { return i * 50; };

        console.log(delayF);

    transition.selectAll("circle")
        .delay(delayF)
        .attr("cx", function(d) { 
         return xScale(d.endedA); })
        .attr("cy", function (d)
        {
            return yScale(d["Duration (min)"]);
        })

（错误：未定义delayF）

显然数据最终会从函数中丢失，如果它用逗号链接到转换变量它会以某种方式获得，但是“how”是我不理解的东西。

Answer 1

首先，这个：

    let circleButton: UIImageView = {
        let imageView = UIImageView()
        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.image = #imageLiteral(resourceName: "Small Circle Button")

        imageView.contentMode = .scaleAspectFill
        imageView.widthAnchor.constraint(equalToConstant: 50)
        imageView.heightAnchor.constraint(equalToConstant: 50)
        return imageView
    }()

是相同的：

    let profileButton: UIImageView = {
        let imageView = UIImageView()
        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.image = #imageLiteral(resourceName: "Profile Button")
        imageView.contentMode = .scaleAspectFill
        imageView.widthAnchor.constraint(equalToConstant: 50)
        imageView.heightAnchor.constraint(equalToConstant: 50)
        return imageView
    }()

因此，它只是一个合并的let stackView = UIStackView(arrangedSubviews: [profileButton, circleButton, profileButton])}语句，这里没什么新的。

除此之外，当你说“这不起作用”时 ......

#include <iostream>

typedef char str_t[16];

void print(str_t* s, int n)
{
        for (int i = 0; i < n; ++i)
        {
                std::cout << s[i] << std::endl;
        }
}

int main()
{
        int n = 3;
        char s[n][16]{ "Hello", "Bye", "Sky"};
        print(s, 3);
}

...你可能在其他地方犯了另一个错误，因为它有效：唯一的区别是现在var transition = myChart.transition().duration(750), delayF = function(d, i) { return i * 50; };是全球性的。

以下是修改后的bl.ocks显示它有效，请看第122行：https://bl.ocks.org/anonymous/41f9beb431956ee825fb0417c497caec

我的猜测是您收到了该错误（var transition = myChart.transition().duration(750); var delayF = function(d, i) { return i * 50; };），因为您忘记在轴转换中将var更改为var transition = svg.transition().duration(750); delayF = function(d, i) { return i * 50; };，进一步向下。

D3.js：在理解延迟调用功能和链接Bostock的可排序条形图示例时遇到一些问题

1 个答案: