Question

在以下数据中，仅将myData中的值从10扩展到100的最佳方法

myData = [
    {"name": "Alex", "value": 10}, 
    {"name": "Bob", "value": 110}, 
    {"name": "Raja", "value": 140}, 
];

目前我正在使用http://alignedleft.com/tutorials/d3/scales中的信息，然后按以下方式缩放值

var valueScale = d3.scale.linear()
                 .domain([0, d3.max(myArray, function(d) { return d.value} )])
                 .range([10, 100]);

但是我如何在myData上使用valueScale，以便结构保持不变但值只能缩放。

这是我的输出数据应该是什么样子 myData = [ {“name”：“Alex”，“value”：10}， {“name”：“Bob”，“value”：79}， {“name”：“Raja”，“value”：100}， ];

Answer 1

您可以使用Array.prototype.forEach修改每个对象：

myData.forEach(function(d){
    d.value = valueScale(d.value);
});

但请注意，这将产生以下输出：

myData = [{"name":"Alex","value":16.42857142857143},
          {"name":"Bob","value":80.71428571428571},
          {"name":"Raja","value":100}]

因为您将domain的{{1}}设置为从0开始，而最小valueScale是10.如果您希望修改的对象与您问题中的输出相匹配，请更改value以匹配您的最大值和：

domain

Answer 2

我认为这就是你要找的东西。您可以遍历原始的'myData'并创建一个完全相同的对象的新数组，只有scale属性的值。如果您不关心保持原始数据的完整性，那么您也可以在适当的位置修改数组。

还有两点需要注意;首先是D3 v4中的我们不再使用d3.scale.linear()现在这样做：d3.scaleLinear()。其次是您在域中使用0作为最小值实际上是10。我只是用d3.extent(myData, function(d) { return d.value} ) 替换了min和max，这也使得代码可以使用不同的数据集。

myData = [
    {"name": "Alex", "value": 10}, 
    {"name": "Bob", "value": 110}, 
    {"name": "Raja", "value": 140}, 
];

newData = [];

var valueScale = d3.scaleLinear()
                 .domain(d3.extent(myData, function(d) { return d.value} ))                                 
                 .range([10, 100]);

for (var i = 0; i < myData.length; i++) {
    newData.push({
        name: myData[i].name,
        value: valueScale(myData[i].value)
    });
  };

你可以将这种方法用于更复杂的对象，以保持你想要的属性相同，只需在for循环中执行以下操作：

newData.push({
            copiedAttribute: originalData[i].copiedAttribute
        });

以及您想要缩放的属性：

newData.push({
            scaledAttribute: scalingFunction(originalData[i].scaledAttribute)
        });

您甚至可以为不同的属性使用不同的缩放功能：

newData.push({
                scaledAttributeOne: scalingFunction(originalData[i].scaledAttributeOne)
                scaledAttributeTwo: diffrentScalingFunction(originalData[i].scaledAttributeTwo)
            });

干杯：）

使用d3.scale.linear在Javascript中仅扩展对象数组中的一个值

2 个答案: