d3.规模是未定义的，是相互依存的

Getting d3.scale is undefined - works in codepen

本文关键字：依存 未定义 d3      更新时间：2023-09-26

出于某种原因，我得到d3.scale是未定义的。D3正确加载;我使用的是d3js.org主网站上列出的那个。

处理D3代码的JS文件:

InitiateChart_1();
function InitiateChart_1()
{
    var data = [5,10,15,20,25];
    var height = 500, width = 500;
    var xScale = d3.scale.linear()
        .domain([0,60])
        .range([0,width]);
    var canvas = d3.select("body")
        .append("svg")
        .attr("id","chart1")
        .attr("width",width)
        .attr("height",height);
    var bars = canvas.selectAll("rect")
        .data(data)
        .enter()
            .append("rect")
            .attr("height",10)
            .attr("width",function(d){return xScale(d);})
            .attr("y",function(d,i){return i * 12;})
}

我的整个HTML文件:

<!doctype html>
<html>
<head>
    <title>SHED Report Prototype</title>
    <meta charset='utf-8'>
    <script src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
    <script src='js/studentloans.js'></script>
</body>
</html>

代码依赖者使用的是版本3;这段代码使用了api的版本4。d3.scale.linear变成了d3.scaleLinear

[…然而，采用ES6模块有一个不可避免的后果:D3 4.0中的每个符号现在共享一个平面命名空间，而不是嵌套D3 3.x之一。例如，d3.scale。现在是线性的d3。scaleline 和d3.layout。Treemap现在是d3.treemap。[…]

https://github.com/d3/d3/blob/master/CHANGES.md(强调我的)

使用d3.scaleLinear，而不是d3.scale.linear。这只适用于旧版本的d3.js

相关文章：