jjzjj

javascript - svg、d3、dagre、dagre-d3 和 graphlib 如何相互依赖？

coder 2024-05-08 原文

我使用 dagre 绘制有向图，但我想了解 svg、d3、dagre 和 graphlib 如何相互依赖？基本上，一个停止，另一个开始。

我将尝试指出我在有限的理解下可以收集到的内容。

  1. svg :(是一种基于 XML 的矢量图像格式，但基本上它)是一个 html 标签，您可以使用它绘制圆形、椭圆形、矩形等，然后使用 g 元素对两个或多个形状进行分组并应用转换等。

  2. d3 :d3 是一个 javascript 库，它基本上允许您将数据与 svg 结合起来。因此，您不必每次都编写 svg 标签，您基本上可以使用编程、循环、数据等来创建 svg 代码。

    现在谈到 dagre，dagre-d3 和 graphlib 是我遇到的问题 假设我上面说的一切都有意义:)

  3. dagre,dagre-d3:这就是 dagre 页面所说的“Dagre 是一个 JavaScript 库，可以轻松地在客户端布置有向图。 dagre-d3 库充当 dagre 的前端，使用 D3 提供实际渲染。”

    有人可以给我解释一下吗？那么我可以在 dagre，dagre-d3 中使用 d3 函数吗？嗯..我已经很困惑了，你能举例说明所有这些是如何共存的吗？ 这code snippet是什么让我思考:

    var oldDrawNodes = renderer.drawNodes();
renderer.drawNodes(function(graph, root) {
  var svgNodes = oldDrawNodes(graph, root);
  svgNodes.each(function(u) { 
     d3.select(this).classed(graph.node(u).nodeclass, true); 
  });
  return svgNodes;
});

    在这里，drawNodes 是 dagre-d3 的一个函数，但它被覆盖了，我们在其中传递了一个 d3 函数(d3.select(this).classed)。嗯……这是怎么回事？我认为 d3.select 只能对 html 元素完成？这里的“这个”是什么？

  4. graphlib :这是 graphlib 页面，它说它为多图提供数据结构。但我的意思是，这些库是为 d3 还是为 dagre-d3 构建的？

我知道我听起来很困惑，但你明白了!如果有人可以通过示例向我解释它们之间的关系以及可以在什么内部使用哪些功能，我将能够接受。

谢谢。

最佳答案

graphlib 提供表示图形的数据结构。它不进行布局或渲染。所以下面是纯图形库:

var g = new Graph();
g.setNode(...);
g.setEdge(...);

dagre 执行节点的布局(x 和 y 定位)，其中节点由 graphlib 图表示。它不进行渲染。大多数时候你不会自己调用它，除非你想在没有 dagre-d3 的情况下进行自定义渲染。

dagre-d3 使用dagre 进行布局，并使用d3 进行渲染。请注意，dagre-d3 默认包含 dagre 和 graphlib，如 dagreD3.dagre 和 dagreD3.graphlib。

SVG 是 d3 的输出格式。它是一种通用的矢量图形格式，也可以嵌入普通的 HTML。每个 SVG 节点也是一个 DOM 节点。这就是 d3.select 也适用于 SVG 节点的原因。

您发布的代码片段似乎执行后处理以在节点上设置类。您链接到的示例似乎从那时起已更新，不再包含该代码。

关于javascript - svg、d3、dagre、dagre-d3 和 graphlib 如何相互依赖？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26184357/

dagrejavascriptstrongdagre-dsvgd3.jsdagre-d3

有关javascript - svg、d3、dagre、dagre-d3 和 graphlib 如何相互依赖？的更多相关文章

  1. ruby-on-rails - 在 ruby​​ .gemspec 文件中，如何指定依赖项的多个版本？ - 2

    我正在尝试修改当前依赖于定义为activeresource的gem:s.add_dependency"activeresource","~>3.0"为了让gem与Rails4一起工作，我需要扩展依赖关系以与activeresource的版本3或4一起工作。我不想简单地添加以下内容，因为它可能会在以后引起问题:s.add_dependency"activeresource",">=3.0"有没有办法指定可接受版本的列表？~>3.0还是~>4.0？ 最佳答案 根据thedocumentation,如果你想要3到4之间的所有版本，你可以这

  2. ruby - RuntimeError(自动加载常量 Apps 多线程时检测到循环依赖 - 2

    我收到这个错误:RuntimeError(自动加载常量Apps时检测到循环依赖当我使用多线程时。下面是我的代码。为什么会这样？我尝试多线程的原因是因为我正在编写一个HTML抓取应用程序。对Nokogiri::HTML(open())的调用是一个同步阻塞调用，需要1秒才能返回，我有100,000多个页面要访问，所以我试图运行多个线程来解决这个问题。有更好的方法吗？classToolsController0)app.website=array.join(',')putsapp.websiteelseapp.website="NONE"endapp.saveapps=Apps.order("

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby - 有什么方法可以告诉 sidekiq 一项工作依赖于另一项工作 - 2

    有什么方法可以告诉sidekiq一项工作依赖于另一项工作，并且在后者完成之前无法开始？ 最佳答案 仅使用Sidekiq；答案是否定的。正如DickieBoy所建议的那样，您应该能够在依赖作业完成时将其启动。像这样。#app/workers/hard_worker.rbclassHardWorkerincludeSidekiq::Workerdefperform()puts'Doinghardwork'LazyWorker.perform_async()endend#app/workers/lazy_worker.rbclassLaz

  5. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  6. 关于Qt程序打包后运行库依赖的常见问题分析及解决方法 - 2

    目录一.大致如下常见问题：（1）找不到程序所依赖的Qt库version`Qt_5'notfound(requiredby（2）CouldnotLoadtheQtplatformplugin"xcb"in""eventhoughitwasfound（3）打包到在不同的linux系统下，或者打包到高版本的相同系统下，运行程序时，直接提示段错误即segmentationfault，或者Illegalinstruction(coredumped)非法指令（4）ldd应用程序或者库，查看运行所依赖的库时，直接报段错误二.问题逐个分析，得出解决方法：（1）找不到程序所依赖的Qt库version`Qt_5'

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby - 在多个线程中引用类方法会导致自动加载循环依赖崩溃 - 2

    代码:threads=[]Thread.abort_on_exception=truebegin#throwexceptionsinthreadssowecanseethemthreadseputs"EXCEPTION:#{e.inspect}"puts"MESSAGE:#{e.message}"end崩溃:.rvm/gems/ruby-2.1.3@req/gems/activesupport-4.1.5/lib/active_support/dependencies.rb:478:inload_missing_constant':自动加载常量MyClass时检测到循环依赖稍加研究后，

  9. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  10. ruby-on-rails - 本地 gem 的“bundle 安装”没有解决依赖关系，而 'gem install' 可以 - 2

    我在目录“/home/enterprise/pkg”中有一个本地gem(enterprise-0.0.1.gem)。它依赖于active_directorygem(v1.5.5)，这是在它的enterprise.gemspec文件中指定的，如下所示:-gem.add_dependency("active_directory")在我的应用程序的Gemfile中，我添加了以下行:-gem'enterprise','0.0.1',path=>'/home/enterprise/pkg'当我做的时候bundleinstall在我的应用程序的源目录中，只安装了企业gem。因此，我遇到了引用act

随机推荐