Question

第三天过去了，我无法改变双层分区（或Sunburst）d3的代码来显示我的数据。我已使用以下json代码实现此布局https://github.com/samehelhakim/D3-saChart---Bilevel-Partition：

{
  "children": [
    {
      "name": "المصاريف",
      "children": [
        {
          "name": "Expense_1",
          "colour": "rgba(255, 148, 42)",
          "children": [
            {
              "name": "ExpSubCat1_1",
              "size": 8,
              "colour": "rgba(255, 148, 42,0.95)"
            },
            {
              "name": "ExpSubCat1_6",
              "size": 15,
              "colour": "rgba(255, 148, 42,0.45)"
            },
          ]
        },
        {
          "name": "Expense_2",
          "colour": "rgb(255, 148, 42)",
          "children": [
            {
              "name": "ExpSubCat2_1",
              "size": 10,
              "colour": "rgba(255, 148, 42,0.75)"
            },
            {
              "name": "ExpSubCat2_2",
              "size": 5,
              "colour": "rgba(255, 148, 42,0.65)"
            }
          ]
        }
      ]
    },
  ]
}

这是我从json获取的数据，来自url：

所以，我需要更改该布局以接受我的json数据并将节点添加到圆圈中，但这是我设法做的，没有结果......：

$.ajax({
    type: "GET",
    contentType: "application/json; charset=utf-8",
    url: '{{ url_for("diffs.api_domains", file_id=file.id) }}',
    dataType: 'json'
}).done(function(result, error) {

  partition
      .value(function(d) { return d.size; })
      .nodes(error)
      .forEach(function(d) {
        d.sum = d.value;
      });

      .value(function(d) { return d.sum; });

  var g = svg.selectAll("g")
      .data(partition.nodes(result))
      .enter().append("g");

  var path = g.append("path")
    .attr("d", arc)
    .style("fill", function(d) { return color(d.name); })
    .on("click", click)
    .each(stash);
});

我的数据已添加到result参数中，我认为必须用我的json中的数据参数替换d.name，d.size和d.value ，但不知道我需要做出哪些改变......

如果你知道如何解决这个问题，任何提示或解决方案都会对我有所帮助。如果我的解释不清楚或者是否有某些事情没有用，请告诉我。

如何将json值从url应用到Bilevel Partition D3布局

0 个答案: