d3.svg.line（）错误：未捕获TypeError：无法读取属性'line'未定义 [英] d3.svg.line() error: Uncaught TypeError: Cannot read property 'line' of undefined

问题描述

我使用下面的代码尝试使用d3.js绘制一个路径
我已经尝试过各种各样的代码示例在网络上相同，并得到相同的错误无处不在。

I am using the following code to try to draw a path using d3.js I have tried various code examples on the web about the same and have been getting the same error everywhere.

以下是JS：

<script type="text/javascript">
    var svg;
    //The data for our line
 lineData = [ { "x": 1,   "y": 5},  { "x": 20,  "y": 20},
                 { "x": 40,  "y": 10}, { "x": 60,  "y": 40},
                 { "x": 80,  "y": 5},  { "x": 100, "y": 60}];

//This is the accessor function we talked about above
var lineFunction = d3.svg.line()
                         .x(function(d) { return d.x; })
                         .y(function(d) { return d.y; })
                         .interpolate("linear");

//The SVG Container
var svgContainer = d3.select("body").append("svg:svg")
                                    .attr("width", 200)
                                    .attr("height", 200);

//The line SVG Path we draw
var lineGraph = svgContainer.append("path")
                            .attr("d", lineFunction(lineData))
                            .attr("stroke", "blue")
                            .attr("stroke-width", 2)
                            .attr("fill", "none");
    </script>

错误是：未捕获TypeError：无法读取未定义的属性'line'

这在下面这行： var lineFunction = d3.svg.line（）

我不知道'undefined'在这里是什么意思。任何线索？

I am not sure what 'undefined' means here. Any leads?

推荐答案

阅读您的 comment 我想你使用D3 v4 。从版本4开始，没有 d3.svg ，因此出现错误消息。您要查找的行生成器现在定义为 d3.line（） 。

Reading your comment I suppose you are using D3 v4. As of version 4 there is no d3.svg, hence the error message. The line generator you are looking for is now defined as d3.line().

如果您仍在使用版本3，则会是 d3.svg.line（）。

If you were still using version 3, it would be d3.svg.line() instead.

这篇关于d3.svg.line（）错误：未捕获TypeError：无法读取属性'line'未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！