D3.js interpolateObject()函数

D3.js 中的interpolateObject()函数用于返回给定的两个对象之间的插值函数。如果“a”中存在“b”的任何属性，则使用插值为“a”和“b”创建通用插值器。

句法：

d3.interpolateObject(a, b);

参数：下面给出两个参数：

• a：它是 Javascript 对象。
• b:也是 Javascript 对象。

返回：返回两个对象的插值函数。

下面给出了上述函数的几个例子。

示例 1：

  
  
  Document




  
  
   
  
    let obj1={
      "a": 10,
      "b": 20,
      "c": 30
    } 
    let obj2={
      "a": 40,
      "b": 50,
      "d": 60,
      "e": 70
    } 
    let interpolationFunction=
d3.interpolateObject(obj1, obj2);
    /* Note the property d and e will not change
       as they are not present in obj1*/
    console.log(interpolationFunction(0))
    console.log(interpolationFunction(0.5))
    console.log(interpolationFunction(1))
    console.log(interpolationFunction(1.5))
    console.log(interpolationFunction(2))
    console.log(interpolationFunction(2.5))
    console.log(interpolationFunction(3))
  

输出：

示例 2：

  
  
  Document




  
  
  
  
    console.log("When obj a is not given")
    console.log(d3.interpolateObject({}, {"a":1, "b":2})(0.5))
    console.log(d3.interpolateObject({}, {"a":1, "b":2})(1))
    console.log(d3.interpolateObject({}, {"a":1, "b":2})(2))
    console.log("When no property of obj b exists in obj a")
    console.log(
d3.interpolateObject({"c":4, "d":3}, {"a":10, "b":12})(5))
    console.log("When both objects are empty object")
    console.log(d3.interpolateObject({}, {})(5))
   
 

输出：