问题标签 [dagre]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - dagre / dagre-d3 / d3.js 的悬停效果
这是我的第一篇文章,希望有人可以帮助我解决这个问题......
您可以在 jsfiddle 示例中看到的内容是使用我正在使用的工具制作的。所有节点和边(链接)的定义都是由我们的工具生成的(“VAR STATES = ..”和“g.setEdge”等)(工具提示在这里不起作用,请忽略)
在选择“allnodes”(鼠标悬停)中,我只能选择当前节点(d3.select(this),但不能选择在SELECTIT中称为名称的对象)
我想要达到的目标:
1.)像这里的“鼠标悬停”效果:http ://cs.brown.edu/people/jcmace/d3/graph.html?id=small.json
我可以在“鼠标悬停”方法中选择影响节点名称:
-> dagrejs/graphlib 的 API 文档在这里找到:https ://github.com/dagrejs/graphlib/wiki/API-Reference
2.) 选择链接时的“鼠标悬停”效果(包括父节点和子节点)
jsfiddle:https ://jsfiddle.net/kraab/n9mgo74j/32/
提前致谢!
javascript - 使用 Cytoscape.js 绘制二叉搜索树
我正在尝试使用 Cytoscape.js 绘制二叉搜索树。我正在使用 Dagre 布局。在我的树中,每个节点正好有两个子节点——我正在为空子树创建带有“null”标签的节点。我的问题是有时左孩子在右侧,反之亦然。
如何设置哪个节点应该是左孩子,哪个应该是右孩子?
javascript - 如何将节点连接到组而不是子节点?
我正在使用“D3”和“dagre”库创建一个带有嵌套节点的图形。
我想将节点“1 级”连接到“中级”,然后将“中级”连接到“3 级”。
但是当我使用“g.setEdge”时,出现以下错误:
无法设置未定义的属性“等级”
d3.js - 如何在 D3/dagre-D3/javascript 中创建决策树/流程图?
所以我想创建一个如下所示的问题流程图: 不确定最好的起点是……这是有向图吗?其中一些最终被真正隔开,并且看起来不太适合像这样的“流程”:https ://observablehq.com/@d3/force-directed-graph
我见过的最好的例子是一个非 D3 库(yworks),但它似乎要花费 15,000 美元: 这是我见过的唯一一个相关的 StackOverflow,它只引用了 yworks:我可以创建一个流程图(没有树形图)使用 D3.js 也许还有这个 dagre-d3 示例:http: //jsfiddle.net/armyofda12mnkeys/9L50of2c/2/
我想添加一些很酷的可选内容:
*我还希望能够控制 Circles 上的 css,比如根据该节点的数据,在某些情况下,有些会变绿或变红。
*每个边缘箭头我还想添加 onHovers 事件,所以会出现一个工具提示来显示实际规则,例如“if(Question1 == A || B)”
*使节点/边缘可拖动或“有弹性”(如果被拖动,它们会弹回原始位置)。听起来很花哨,但有时如果规则过于拥挤(因为智能自动布局),用户可能会使用此功能,并且他们想拖动东西以查看箭头指向的位置。
dagre-d3 - Dagre-d3 graphlib:如何在不重绘整个图的情况下将新节点动态添加到图中?
我目前正在使用 dagre-d3 和 graphlib API 来绘制有向图。我使用的语言是打字稿。我的用例是我不想一次渲染整个图表。我需要实现的是首先显示一些节点,然后通过单击当前节点动态添加相邻节点。我的问题集中在如何更新图表上。我用来重新渲染的 API 仍然是 dagreD3.render()。除此之外,我没有在 dagre-d3 中找到其他 API 来添加额外的节点。似乎它重新渲染了整个图,而不仅仅是更新添加的节点,因为我注意到当我第二次调用 dagreD3.render() 时节点的顺序发生了变化。有没有办法只添加额外的节点而不改变现有节点的位置?
此外,我在 render(inner,g) 函数之后设置了单击事件处理程序和一些样式。如果我使用 dagreD3.render() 重新渲染图形,我需要再次设置事件处理程序和样式。我正确使用 dagreD3.render() 吗?
我正在使用打字稿语言。所以代码在一个类中。我将 Graph 和 render 设置为类中的成员。它们用于这两个功能。
dagre-d3 - dagree-d3 中的自定义节点位置
我有一个用dagre-d3完成的有向无环图。是否有可能将节点放在不同的级别并使用一些代码更改节点的位置?这个库有一些“等级限制”,但它看起来在最新版本中不起作用。我目前的建议是添加一些链接并在此之后隐藏它们,但这是最后可能的选择,我真的想避免它。
jointjs - 如何将jointjs图形与纸张的中心/中间水平对齐,流向从上到下?
我有一个使用 JointJs 生成的图表,它使用了由 jointjs 提供的 Dagre 布局。目前,图表从上到下对齐,这是正确的方式,但完整的图表会与纸张的左侧对齐。
我需要将图表水平对齐在纸的中间。
当前使用的配置是这样的:
我看到使图形从上到下流动的选项被赋予rankDir: "TB"。是否有任何类似的选项可以将其水平对齐到中间而不是默认情况下的左侧?或任何其他可以这样做的方式。
reactjs - “dagre”实用程序是强制性依赖项
我正在使用jointjs并自动布局我正在使用dagre库的节点。我的代码在此代码处中断
显示错误:“dagre”实用程序是强制性依赖项。我正在使用 dagre@0.7.3 和 jointjs@3.0.4,
angular - dagre-d3 链接和标签未出现在 Angular 项目中
我正在研究 dagre-d3 的角度。并且卡在了中间。
问题:
- 节点之间没有出现链接。
- 节点上的标签不可见。
https://codesandbox.io/s/angular-graph-kq2nb
我浏览了一些与此相关的帖子,但找不到我所缺少的。
任何帮助表示赞赏。
javascript - React Cytoscape JS:所有节点都累积在一个位置
使用 dagre 创建路径时,整个节点会累积在一个位置。我们如何为节点设置默认位置(没有反应的 Cytoscape js 工作正常)而不是使用节点的位置属性单独设置位置。
预期结果:
当前结果: