Question

我的数据位于csv文件中，如下所示：

year,rs,team,ra,ws,finals
2002,892,bears,676,no,no
2003,873,bears,702,no,yes
2004,899,bears,815,no,yes
2005,828,bears,748,no,no
...

最初，我所关心的只是绘制rs变量值，代码非常简单，因为我可以直接引用rs，例如：

graph() {
    ...
    data.forEach(function(d) {
        d.year = +d.year;
        d.rs = +d.rs;
    });

    y.domain([500,d3.max(data.map(function(d) {return d.rs;}))]); 
    ...
}

但是，为了使图形更具交互性，我使用单选按钮允许用户选择要绘制的变量。在onClick处理程序中，我将数据集中变量的名称传递给图形，例如onclick="graph('ra')"或onclick="graph('rs')"。但是，有没有办法传入字符串并让代码“替换”字符串作为变量。我尝试做类似以下的事情，但这不起作用：

graph(variable_to_graph) {
    ...
    data.forEach(function(d) {
        d.year = +d.year;
        d.variable_to_graph = +d.variable_to_graph;
    });

    y.domain([500,d3.max(data.map(function(d) {return d.variable_to_graph;}))]); 
    ...
}

我是JavaScript和d3的新手，但我的直觉是这应该是可行的。我还想放入一个文本字段，并允许用户输入自定义数学表达式（例如rs/ra或(rs*2)/ (ra^2)），并通过将表达式作为字符串传递来以某种方式绘制这些结果的图形，例如graph("(rs*2)/ (ra^2)")。我不知道从哪里开始，是否有可能。理想的解决方案将能够适应这两种情况。

Answer 1

要使用包含属性名称的变量访问属性名称，请使用object[propName]，如下所示：

d[variable_to_graph]

或者在你的功能中：

graph(variable_to_graph) {
    ...
    data.forEach(function(d) {
        d.year = +d.year;
        d[variable_to_graph] = +d[variable_to_graph];
    });

    y.domain([500,d3.max(data.map(function(d) {return d[variable_to_graph];}))]); 
    ...
}

D3 - 你可以传递一个字符串来作为键使用吗？

1 个答案: