如何为 d3js sankey 图表左侧节点提供固定高度

Question

我在这个 d3 sankey 图表中工作，我想给左侧节点一个固定的高度，以便将 sankey 图与圆环图对齐。绿线表示两个图表之间的分隔，我需要修复圆环图旁边节点的高度

let data =
    {
      "links": [
        { "source": "Agriculture", "target": "Rice Cultivation", "value": "120" },
        { "source": "Agriculture", "target": "Deforestation", "value": "30" },
        { "source": "Agriculture", "target": "Coal Mining", "value": "30" },
        { "source": "Chemicals", "target": "HFCs - PFCs", "value": "100" },
        { "source": "Chemicals", "target": "HFCs - PFCs", "value": "50" }
],

"nodes":[

        { "name": "Agriculture" },
        { "name": "Chemicals" }
]
}

Answer 1

处理您的数据将所有值转换为 % 例如：对于农业，您有 120、30、30，总计为 180。现在，通过除以 120/180、30/180、30/180 将值更改为 %。因此，当你总结它的目标时，农业将是 100%

重复你所有的组，所以你的源应该等于 100% 加起来，所以你的源（左节点）的高度将相等

let data = {
      "links": [
        { "source": "Agriculture", "target": "Rice Cultivation", "value": "66.67" },
        { "source": "Agriculture", "target": "Deforestation", "value": "16.67" },
        { "source": "Agriculture", "target": "Coal Mining", "value": "16.67" },
        { "source": "Chemicals", "target": "HFCs - PFCs", "value": "66.67" },
        { "source": "Chemicals", "target": "HFCs - PFCs", "value": "33.33" }
    ],
    "nodes":[
        { "name": "Agriculture" },
        { "name": "Chemicals" }
    ]
}

希望对您有所帮助，谢谢

如何为 d3js sankey 图表左侧节点提供固定高度

How to give a fixed height to a d3js sankey chart left side nodes

javascript

data-visualization

d3.js