Question

我试图使用d3-sankey，并且在很大程度上非常忠实于这样的例子：https://bl.ocks.org/d3noob/013054e8d7807dff76247b81b0e29030 一个区别是我使用ES6导入来插入插件，如下所示：

＆＃13;

import * as d3Sankey from "d3-sankey";

＆＃13;

我目前正在使用示例中的actaul数据：

＆＃13;

    var testData = {
"nodes":[
{"node":0,"name":"node0"},
{"node":1,"name":"node1"},
{"node":2,"name":"node2"},
{"node":3,"name":"node3"},
{"node":4,"name":"node4"}
],
"links":[
{"source":0,"target":2,"value":2},
{"source":1,"target":2,"value":2},
{"source":1,"target":3,"value":2},
{"source":0,"target":4,"value":2},
{"source":2,"target":3,"value":2},
{"source":2,"target":4,"value":2},
{"source":3,"target":4,"value":4}
]}

＆＃13;

稍后当我通过sankey函数推送数据时，它会保持不变。然后当然转换都会失败，因为d3-sankey应该插入的d.x和d.y等属性没有被插入。奇怪的是我没有得到任何错误，d3-sankey似乎根本没有被击中，尽管我非常自信我已正确导入它并且它是一个功能。以下是代码 - 非常感谢任何帮助：

＆＃13;

function update(data) {

        // Set the sankey diagram properties
        var aSankey = d3Sankey.sankey()
            .size([gWidth, gHeight]);

        var path = d3Sankey.sankeyLinkHorizontal();


        aSankey
            .nodes(testData.nodes)
            .links(testData.links);

            console.log(testData);
        // add in the links
        var link = dataLr.append("g").selectAll(".link")
            .data(testData.links)
            .enter().append("path")
            .attr("class", "link")
            .attr("d", path)
            .style("stroke-width", function(d) { return Math.max(1, d.dy); })
            .sort(function(a, b) { return b.dy - a.dy; });

        // add the link titles
        link.append("title")
            .text(function(d) {
                //console.log(d);
                return d.source.name + " → " +
                    d.target.name + "\n" + format(d.value);
            });

        // add in the nodes
        var node = dataLr.append("g").selectAll(".node")
            .data(testData.nodes)
            .enter().append("g")
            .attr("class", "node")
            .attr("transform", function(d) {
                //console.log(d);
                return "translate(" + d.x + "," + d.y + ")";
                //return "translate(" + 20 + "," + 50 + ")";
            });

＆＃13;

d3-sankey没有任何效果，没有提供错误

0 个答案: