程序员经验分享-hwhale

使用强制布局避免 d3.js 中链接纵横交错/重叠

2024-03-10

如何使用强制布局避免 d3.js 中的链接重叠？ 我将屏幕分为两半，上半部分节点使用链接连接到下半部分节点，有时链接会纵横交错，我该如何避免这种情况？


简短的回答是你不能。更长的答案是，D3 实现的力布局对于防止重叠链接没有任何作用，并且没有可以设置的参数来做到这一点。您可以做的就是尝试调整那里的参数，看看它们是否能帮助解决这个问题。

部队布局实施于sigma js http://sigmajs.org/ does尝试尽量减少交叉链接的数量，因此如果您不是绝对需要 D3，这将是您可以考虑的替代方案。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

d3js

forcelayout

使用强制布局避免 d3.js 中链接纵横交错/重叠 的相关文章

  • 如何同时使用 2 个范围滑块？

    我想使用 2 个范围滑块同时根据年龄和身高过滤表中的数据 我已经使用以下方法实现了 2 个范围滑块 年龄和身高 d3 slider js https github com MasterMaps d3 slider and a dc data

  • D3 DataMaps：气泡上的 OnClick 事件

    我正在关注 datamaps 文档 并尝试为我在 svg 上渲染的气泡设置一个 onClick 侦听器 现在svg div具有以下子标签

  • Extjs + D3：渲染冲突

    当我结合 Extjs 和 D3 时 我正在挖掘一些非常有趣的东西 一般来说 ExtJS渲染整个页面的主框架 D3渲染该框架中某个div的动态图 由于Extjs中的渲染逻辑相当复杂 因此我放置D3渲染逻辑的位置似乎至关重要 这里我尝试了两种

  • d3树计算所有孩子的数量

    我有一个基于以下内容的 d3 树 http bl ocks org mbostock 1093025 http bl ocks org mbostock 1093025 我如何计算所有孩子的数量 我已经尝试过这个 但是它计算了树中的所有行

  • 更改一个 y 轴的范围 nvd3/d3

    我目前正在使用 multiChart 模型 并且有两个不同的 y 轴 我想更改两个轴 使它们从 0 开始 因为目前它们从最小的 y 数据点开始 我尝试过执行以下操作 chart yAxis1 tickFormat d3 format f d

  • d3 单击时聚焦于节点

    我正在尝试实现一种力布局 其中单击节点将能够专注于节点周围的区域 我看过一些例子 但我收到一个错误 上面写着link bounds is not defined 我认为边界没有为力布局定义 并且适用于我从中获取聚焦功能的示例http bl

  • d3.js：是否可以通过键而不是索引来进行转换？

    我有不同长度的数据数组 x值 年 是有限年数的一部分 例如 var data Year 2008 Value 5 Year 2009 Value 6 or var data Year 2007 Value 8 Year 2009 Value

  • 调整小倍数迷你图

    我有一个热图 显示一些数据和热图每行的迷你图 如果用户单击行标签 则数据按降序排列 因此每个矩形都会放置在正确的位置 反之亦然 如果用户单击列标签 每个反应都以正确的方式放置 但我无法放置迷你图 这是代码 http plnkr co edi

  • D3.js - 如何迭代数据集中的子数组

    我试图让 d3 迭代数据中的子数组并生成多个饼图 这是完整的代码 来自https gist github com mbostock 1305111 https gist github com mbostock 1305111 and htt

  • 分层边缘捆绑：添加父组标签

    我对 HTML 和 JavaScript 还很陌生 我面临着著名的分层边缘捆绑可用here https bl ocks org mbostock 7607999 由 D3 js 库生成 My goal is to add a semi ci

  • d3.forcesimulation() 链接距离

    我在堆栈上查看了不同的链接距离 似乎为了改变链接距离 您需要实现一个函数 然后传递它来动态分配链接距离 如下所示 function linkDistance d return d distance 然后我认为我可以传递给 svg 但返回函数

  • d3.js：在树布局中展开多个路径

    My JSON contains same node names in different paths I would like to be able to open all children with the same name or h

  • 为什么这个标题图形不随世界更新

    对于以下内容 我很高兴组合框默认为世界 但当收音机被点击时 我也希望标题移回 世界 我该怎么做 我有这个笨蛋 http plnkr co edit 9FXJXVqLZLPFdDrmVJez p preview http plnkr co e

  • d3 (v4) 树布局和打字稿：类型“HierarchyNode”上不存在属性“x”

    我正在尝试在使用时使用正确的 ts 类型d3 hierarchy具有树布局的根 例如 interface MyCustomGraphType id string children MyCustomGraphType let treeData

  • 如何在D3中导入json数据？

    如何在D3中导入json文件 I did d3 json temp json 但是我如何在进一步的代码中访问这个数据集呢 到目前为止我已经尝试过 var data d3 json temp json 但使用 data data 在其余代码中

  • d3.js 中拖动后（有时）单击事件未触发

    观察到的行为 我正在使用 d3 js 并且我想根据以下情况更新一些数据drag https github com mbostock d3 wiki Drag Behavior wiki on事件 并重绘事件之后的所有内容dragend ht

  • NVD3/D3改变y轴最小值

    我目前正在使用 NVD3 制作一些折线图 我想知道是否可以使 y 轴刻度始终从 0 开始 目前它始终从最低的 y 值开始 我尝试过使用tickValues 但我不想更改其他值 我还尝试添加值为 0 的数据点 但这似乎是一种解决方法 它会影响

  • d3 地理投影从正交到 X 的过渡

    我正在开发一个教育地图项目 其中显示不同的地图投影 我想在选择不同投影之间实现变形过渡 我找到了一个很好的例子来实现它 并且我没有遇到太多的麻烦来重新创建它 不幸的是 我还需要裁剪投影的功能 这与目标状态完美配合 但在改变投影时则不然 当选

  • d3.js：非线性图轴

    我正在尝试在轴上添加自定义比例 如下所示 这个想法是 一个刻度总是比前一个刻度大 2 倍 我的理解是 这是一个定制秤 我做了一些研究 但找不到类似的东西 所以我想我的问题实际上是两个问题 这个尺度是数学世界的 标准 吗 这是否可以使用来实现

  • 如何使用 D3 （或只是 javascript）将表单选项设置为“选择”

    有没有一种方法可以搜索选择表单元素中的所有选项 并将具有匹配值的选项指定为 已选择 var xStat G var statOptions Points PTS Goals G Assists A Penalty Minutes PIM c

随机推荐

  • 对预先输入的建议进行排序，准确的输入位于顶部

    我使用 Twitter typeahead js 0 10 5 作为建议引擎 它工作得很好 除了一个例外 我无法按照我想要的方式对建议列表进行排序 举个例子 var data id 1 value no need id 2 value th

  • 基于Count使用IF ELSE语句执行不同的Insert语句

    当我搜索数据库时 如果发现某个特定项目不存在 我会运行 INSERT 语句 如果找到一个或多个该项目 我会运行不同的 INSERT 语句 我不完全确定如何使用 IF ELSE 表达式 到目前为止 我有一个语句 它将计算目标数据出现的次数 如

  • 当数据库中缺少项目时，PHP 或 htaccess 使动态 url 页面转到 404

    典型场景 DB项目显示在页面中http item id 467 用户一天deletes该项目 谷歌或用户 尝试访问http item id 467 PHP 挖掘数据库并发现项目不再存在 所以现在 PHP 必须告诉 通过 404 标头和页面

  • 如何防止 CompileAssemblyFromSource 泄漏内存？

    我有一些 C 代码 它使用 CSharpCodeProvider CompileAssemblyFromSource 在内存中创建程序集 程序集被垃圾收集后 我的应用程序使用的内存比创建程序集之前更多 我的代码位于 ASP NET Web

  • Play Framework 2.4 Writes[-A] 与 OWrites[-A]、Format[A] 与 OFormat[A]。目的？

    PlayFramework Json 库中的 Writes A 和 OWrites A 有什么区别 我使用过 Writes A 但我不明白 OWrites 的用途是什么 同样的问题也适用于 Format A 与 OFormat A 源码可以

  • 如何在 Jasmine 测试中测试 $scope.$on 事件？

    我正在对控制器进行单元测试 并且想测试事件处理程序 假设我的控制器看起来像 myModule controller MasterController scope function scope scope on locationChangeS

  • 如何捕获无线路由器的原始信号？

    我现在看到了几个项目 它们从典型无线路由器收集的无线电数据中获取新颖的空间信息 http wisee cs washington edu http wisee cs washington edu http www extremetech c

  • HERE SDK 在 Android 8 上无法在后台使用

    HERE SDK 尝试启动它的MapService当消费者致电时内部MapEngine init 由于 Android 8 后台执行限制 如果出现以下情况 则会失败MapEngine将从后台服务初始化 有什么办法可以初始化吗MapEngin

  • Python安装libs文件夹中的python3.lib和python3x.lib有什么区别？

    我一直在编译 C 库 并链接 Python3 库文件以进行 Python 绑定 我一直使用 python39 lib 文件作为链接 但我想知道 版本化 数字 例如 python3x lib 与非版本化数字 python3 lib 之间有什么

  • Chrome 85 Service Worker 一直在尝试安装

    在我的 Web 应用程序上更新 chrome 85 后 Service Worker 不再安装 它在 chrome 84 或更早版本 Safari Firefox Microsoft Edge 浏览器上运行良好 尝试查找更改日志或错误报告

  • vue vite动态组件导入

    我正在将现有的 laravel ineria 从 mix 迁移到 vit 我完成了迁移指南中的所有步骤 除了一件事之外 一切正常 我有一个组件接收一个包含组件数组的道具 我曾经这样要求它们 在循环内 this options compone

  • BSD md5 与 GNU md5sum 输出格式？

    任何人都知道为什么 BSD md5 程序会产生这种格式的哈希输出 MD5 checksum md5 9eb7a54d24dbf6a2eb9f7ce7a1853cd0 而 GNU md5sum 会产生像这样更合理的格式 9eb7a54d24d

  • iOS 图表 - 单个值不显示 Swift

    当我在折线图上的一条线的数组中有多个点时 一切都会完美显示 但当只有一个点时 该点就不会显示 我不知道为什么 代表被设置在其他地方 但这似乎不是问题 以下示例显示了测试 2 和测试练习 第一个图像中每个图像都有一个值 第二个图像中每个图像都

  • 如何获取给定一天的本周的所有日期时间实例？

    给定一天 我想获取该天所在星期的所有天 日期时间实例 我有一个解决方案 如果有问题请纠正我是否存在更有效的方法 gt gt gt import datetime gt gt gt today datetime datetime 2013 0

  • Spring Boot 处理 SizeLimitExceededException

    我使用 Spring boot 1 5 7 我还没有配置 CommonsMultipartResolver 因为 Spring Boot 已经处理文件上传了 如果我的上传超过允许的最大大小 则会抛出一个丑陋的异常 这是由我的控制器处理的 C

  • Makefile ：自动编译所有c文件，将.o文件保存在单独的文件夹中

    我所拥有的是一个包含 3 个子目录的目录 src 用于 c 和 h 文件 bin 是编译后的可执行文件应该存放的位置 obj 是我希望 obj 文件存放的位置 现在我希望 makefile 编译 src 中的每个 c 文件 无需将它们全部列

  • 我怎样才能用python挤出一个stl

    我正在尝试转换png图像转 3Dstls 我终于找到了一种方法来做到这一点 但有一个问题 现在导出的图像没有 z 值 也没有厚度 我这样做的方式是针对图像上的白色像素 将三角形绘制到表面上 def define faces numpy ar

  • XSL:FO float 用于显示页边注释 - 破坏文档

    我有一份大型中世纪手稿 已转录为 XML 使用 TEI 模式 我正在使用 xsl fo 和 Apache FOP 处理 PDF 该文件是使用嵌套构造的 p p

  • 更新 Github 上分叉存储库的多个分支

    我有一个分叉的 github 存储库 称为 repo O 称为我的分叉 repo F 其中包含大约 8 个分支 其他贡献者已在 repo O 的多个分支上对 repo O 进行了多次 100 次 提交 我现在想将这些更改放入我的分叉存储库

  • 使用强制布局避免 d3.js 中链接纵横交错/重叠

    如何使用强制布局避免 d3 js 中的链接重叠 我将屏幕分为两半 上半部分节点使用链接连接到下半部分节点 有时链接会纵横交错 我该如何避免这种情况 简短的回答是你不能 更长的答案是 D3 实现的力布局对于防止重叠链接没有任何作用 并且没有可

热门标签