为什么内插不是d3中的函数

-1

我正在尝试使用D3来制作line chart。这是我的代码。我收到此错误：为什么内插不是d3中的函数

interpolate is not a function

https://jsbin.com/ruvumocijo/edit?html,output

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.7.4/d3.js"></script> 

    <script src="https://d3js.org/d3-selection-multi.v0.4.min.js"></script> 
</head> 
<body> 

<script> 
    var w = 200, 
     h = 200, 
     data = [{ 
      month: 2, 
      winper: 20 
     }, { 
      month: 4, 
      winper: 80 
     },{ 
       month: 6, 
       winper: 90 
      }]; 
    var svg = d3.select('body').append('svg').attrs({ 
     width: w, 
     height: h 
    }) 
    var line_one= d3.line().x(function (d) { 
     return d.month*2 
    }).y(function (d) { 
     return h- (d.winper*3) 
    }).interpolate("linear") 

    svg.append("path").attrs({ 
     d:line_one(data), 
     fill:"none", 
     "stroke-width":2, 
     "stroke":"blue" 
    }) 

</script> 
</body> 
</html>

来源

2017-04-01 user944513

interpolate在D3版本4（您正在使用的版本）已删除。从变化documentation：

4.0 introduces a new curve API for specifying how line and area shapes interpolate between data points. The line.interpolate and area.interpolate methods have been replaced with line.curve and area.curve. Curves are implemented using the curve interface rather than as a function that returns an SVG path data string; this allows curves to render to either SVG or Canvas. In addition, line.curve and area.curve now take a function which instantiates a curve for a given context, rather than a string.

如果你想有一个线性插值，这是默认的，你不需要指定任何：

var line_one= d3.line().x(function (d) { 
    return d.month*2 
}).y(function (d) { 
    return h- (d.winper*3) 
});

来源

2017-04-01 20:41:31 Mark

为什么内插不是d3中的函数

回答

相关问题