在d3中调用自定义函数

Question

我正在尝试本教程 ，但根本无法获得x（d）。 直到我使用x（d），其他所有东西都可以正常工作。 我什至尝试从此页面复制并粘贴确切的源代码。

问题在于使用x（d），因为如果使用常量而不是x（d），则一切正常。 我想念什么？

    <div class="chart"></div>
    <script src="https//d3js.org/d3.v4.min.js"></script>
    <script>

        var data = [4, 8, 15, 16, 23, 42];

        var x = d3.scale.linear()
                .domain([0, d3.max(data)])
                .range([0, 420]);

        d3.select(".chart")
                .selectAll("div")
                .data(data)
                .enter().append("div")
                .style("width", function (d) {
                    return x(d) + "px";
                })
                .text(function (d) {
                    return d;
                });

    </script>

Answer 1

阅读此内容后： https : //github.com/d3/d3/blob/master/CHANGES.md#scales-d3-scale

尝试这个：

        var data = [4, 8, 15, 16, 23, 42];

        var x = d3.scaleLinear()
                .domain([0, d3.max(data)])
                .range([0, 420]);

        d3.select(".chart")
                .selectAll("div")
                .data(data)
                .enter().append("div")
                .style("width", function (d) {
                    return x(d) + "px";
                })
                .text(function (d) {
                    return d;
                });



    <div class="chart"></div>
    <script src="//d3js.org/d3.v4.min.js"></script>
    <script>