Javascript d3 scale.linear（）：将数据作为参数传递

我正在用d3构建多个条形图，并且希望基于输入数据（由不同的JSON数组组成）为每个图表应用相同的比例。 为了找到每个数组的最大值，我编写了以下函数：

var maxInArray = function (dataArray,propertyName) {
    var result = d3.max(dataArray, function(d) { 
        return +d[propertyName]; 
    });
    return result;
};

要查找条的宽度，我使用：

var barLength = d3.scale.linear()
    .domain([0, maxInArray(myArray,"myProperty")])
    .range([0, 400]);

最后，对于图表：

d3.select(".mybarchart")
        .selectAll("div")
        .data(myArray)
        .enter().append("div")
        .style("width", function(d) { return barLength(d.myProperty) + "px"; })
        .text(function(d) { return d.title+" ("+d.propertyName + ")"; });

但这种方法意味着barLength中仍然有myArray硬编码

我更愿意做的是将当前值、myArray和myProperty传递到如下函数中：

var barLengthForValue = function (value,dataArray,propertyName) {
    var maxWidth = 400;
    var result = d3.scale.linear()
    .domain([0, maxInArray(dataArray,propertyName)])
    .range([0, maxWidth]);
    return result;
};

为我拥有的每个JSON数组使用barLengthForValue。但是

console.log("barLengthForValue: ",barLengthForValue(10,myArray,"myParameter"));

返回

function i(n){return o(n)}

大概是因为

d3.scale.linear（）

找不到进行计算所需的参数

我读了很多关于这个问题的教程，但没有一本是我想要的。它们都使用d3.scale和固定的数据数组

我所尝试的可能吗？具体来说，我可以用这种方式“扩展”

d3.scale.linear（）

还有一个JavaScript问题（我猜是这样）：d3.scale.linear（）如何在这里“提取”参数10

var scale= d3.scale.linear();
scale(10);

---

了解这一点可能有助于我了解如何改进

barLengthForValue（）

您可以用它来清理代码。它将查找数组中的最小值和最大值，并将其作为方便的

[min，max]

返回。例如：

var barLengthForValue = function (value,dataArray,propertyName) {
    var maxWidth = 400;
    var result = d3.scale.linear()
    .domain(d3.extent(dataArray))
    .range([0, maxWidth]);
    return result;
};

如果您确实只想使用max，那么可以使用

然后，您可以将选择设置为一个函数，并在数据更改时重新定义标尺的域：

function createChart (data) {
  d3.select(".mybarchart")
        .selectAll("div")
        .data(data)
        .enter().append("div")
        .style("width", function(d) { return barLength(d.myProperty) + "px"; })
        .text(function(d) { return d.title+" ("+d.propertyName + ")"; });

  barLength.domain(d3.extent(data))
}

// call createChart for each dataset you want to plot
[ dataSet1, dataSet2, dataSet3 ].map(createChart)

---

您需要做的唯一更改是返回

结果（值）

，而不是

结果

——在您返回缩放对象时，需要将其应用于一个值以给出映射值。

如果我理解正确，您需要做的唯一更改是返回

结果（值）

而不是

结果

。就是这样。我明白为什么，谢谢！感谢您向我展示d3.extent（），我将相应地修改代码。