相关疑难解决方法(0)

使用Dagre作为布局引擎的Cytoscape JS，启用曲线样式：出租车边缘。

（随机数据图表，实线为亲子关系，虚线为配偶）

问题是配偶彼此不一致。Dagre 历来支持“等级”作为节点的参数，这意味着您可以强制某些节点处于特定高度（如果愿意，可以将其视为“一代”）。不幸的是，它不再起作用，负责的开发人员也不再从事该项目。这将很好地解决我的问题。

我尝试过但失败的其他事情：

将 dagre 降级到支持排名的旧版本？

还没有获得使用任何版本的 dagre 的等级。
D3与dagre-d3

和上面一样的问题，因为dagre-d3是dagre的修改版本，这意味着它不支持按代排序。
yFiles 家谱演示看起来很棒，但很商业化。对于我的目的（希望任何人建立自己的家谱），单个开发人员许可证的成本是 26.000 美元（！？！）。显然不能接受。

我的问题

是否可以像我上面描述的那样垂直对齐我的 cytoscape/dagre 图中的节点？

如果没有，我愿意尝试其他库和其他布局算法。

我正在寻找一个看起来类似于 yFiles 解决方案但使用开源工具的工作示例。

javascript d3.js cytoscape.js dagre dagre-d3

Emi*_*röm

2020 05-01

8
推荐指数

1
解决办法

1203
查看次数

如何使用d3.js获取垂直方向的树

以下url将获得水平方向的树.但是我的要求是使用d3获得垂直方向的树.请为此要求建议正确的有效解决方案.

d3js树广场在此输入图像描述

javascript svg d3.js

Sai*_*ran

2017 05-23

7
推荐指数

2
解决办法

6799
查看次数

D3 树布局可视化 - 继承具有多个父级的子级

我是 D3 可视化的新鲜蜜蜂。目前正在为数据沿袭创建 D3 树布局可视化。在数据沿袭流中，可以从多个父节点派生一个子节点。这是示例。在下面的示例中，“DevLead”可能与 2 个经理一起工作。

var data = [
     { "name": "Director", "parent": "null", "depth": 0 },
     { "name": "Manager1", "parent": "Director", "depth": 1 },
     { "name": "Manager2", "parent": "Director", "depth": 1 },
     { "name": "DevLead", "parent": "Manager1", "depth": 2 },
     { "name": "DevLead", "parent": "Manager2", "depth": 2 }
        ];

Run Code Online (Sandbox Code Playgroud)

获取输出请参考下图。

我希望看到“DevLead”孩子应该只展示一个，并且应该从“Manager1”和“Manager2”派生出来。任何人都可以帮助解决这个问题。

treeview d3.js

Sha*_*aan

lucky-day

7
推荐指数

1
解决办法

9774
查看次数

在d3.js中，带有多个子节点的树（类似于家谱）

var treeData = [{
    "name": "Device",
    "parent": "null"
  }

];
var treeData2 = [{
    "name": "Device",
    "parent": "null"
  }

];

$(document).ready(function() {

  var margin = {
      top: 20,
      right: 120,
      bottom: 20,
      left: 120
    },
    width = 1260 - margin.right - margin.left,
    height = 500 - margin.top - margin.bottom;

  var i = 0,
    duration = 750,
    root;

  var tree = d3.layout.tree()
    .size([height, width]);

  var diagonal = d3.svg.diagonal()
    .projection(function(d) {
      return [d.y, d.x];
    });

  var svg = d3.select("body").append("svg")
    .attr("width", width + …

Run Code Online (Sandbox Code Playgroud)

javascript tree d3.js

Soo*_*ran

2017 05-23

6
推荐指数

1
解决办法

3555
查看次数

如何将两个父节点连接到一个子节点，以及如何实用地为树中的每个节点制作工具提示？在 D3 js (SVG) 中

我制作了一个树形图结构，它工作得非常好。但现在我想做一个小小的改变却无法做出改变。我想将两个父节点连接到一个子节点...我还尝试实用地向每个节点添加一个工具提示。

例如 - 如果您运行代码，您会更清楚地看到它。我想创建 Hanna 的子节点并标记它将连接到名为“Eric”的子节点。

知道如何实现这一目标吗？

var svg = d3
  .select("body")
  .append("svg")
  .attr("width", 600)
  .attr("height", 600)
  .append("g")
  .attr("transform", "translate(50,50)");

//tree data
var data = [
  { child: "John", parent: "" },
  { child: "Aron", parent: "Kevin" },
  { child: "Kevin", parent: "John" },
  { child: "Hannah", parent: "Anna" },
  { child: "Rose", parent: "Sarah" },
  { child: "Anna", parent: "John" },
  { child: "Sarah", parent: "Kevin" },
  { child: "Mark", parent: "Anna" },
  { child: "Angle", parent: "Sarah" }, …

Run Code Online (Sandbox Code Playgroud)

javascript css svg dom d3.js

the*_*der

2020 11-09

5
推荐指数

1
解决办法

1759
查看次数

d3.js 家族图

^ 这是开始增强图表以获取出生/死亡/姓名数据的目标 - 但让它更灵活地获取它。还要清理数据源。

我正在尝试开发 d3.js 家族图。我有兴趣尝试增强此图表的数据结构，以及标签的添加和空间/设计——如果有一种方法可以为零件提供动态长度以为其提供所需的空间。

我做了这个 jsfiddle http://jsfiddle.net/857edt69/30/

  // Create the node rectangles.
  nodes.append("circle")
    .attr("class", "node")
    .attr("r", function(d, i) {
      return smallRadius;
    })
    .style("fill", function(d, i) {

      var userName = d.userName;
      if (userName) {
        userName.toLowerCase()
      }

      var id = d.id + "-" + userName; //small circles
      return "url(#" + id + ")";
    })
    .attr("id", function(d) {
      return d.id;
    })
    .attr("display", function(d) {
      if (d.hidden) {
        return "none"
      } else {
        return ""
      };
    })
    .attr("cx", function(d) {
      return …

Run Code Online (Sandbox Code Playgroud)

javascript d3.js

The*_*nty

2017 05-19

-4
推荐指数

1
解决办法

2289
查看次数