等同于纯JavaScript Graphviz [关闭]

2020/11/18 14:21 · javascript ·  · 0评论

是否有人知道GraphViz能够生成的基于Java的定向流程图的纯实现?我对漂亮的视觉效果输出不感兴趣,但可以计算出每个节点的最大深度以及贝塞尔曲线的布局,这些贝塞尔曲线经过优化,可以最大程度地减少在处理图形(而不是树)时相交的边缘数量信息。我想同时在浏览器中运行此代码;我知道我可以轻松地将Graphviz作为扩展嵌入到我的Node服务器中,甚至popen()可以将其以.dot格式传递到图信息上

作为参考,这是典型的GraphViz输出。请注意元素是如何堆叠和间隔开的,以允许连接线在节点之间传播,而不会(经常)相交或穿过节点。

在此处输入图片说明

看一下.dot canvas渲染器的纯JavaScript实现:

http://ushiroad.com/jsviz/

该库未记录在案-作者当然应该对它进行宣传和记录(我将与他联系,建议他至少将它放在github上)。

更新:代码已推送到github:https :
//github.com/gyuque/livizjs

更新(14/2/2013):出现了另一个竞争者!任何对此主题感兴趣的人都应该看看Viz.js的示例页面github repo

更新(7/16/2020):(七年后)http://webgraphviz.com/也很棒!:-)

经过四处搜寻,我终于找到了答案。

解决方案是有人使用llvm + emscripten将Graphviz编译为Javascript。链接在这里:

http://viz-js.com/

可以在以下位置找到源:https :
//github.com/mdaines/viz.js

要简单地建立一个网页,请使用:

var graphviz_text = ...;
document.body.innerHTML += Viz(graphviz_text, "svg");

在查看了所有选项之后,我发现基于jsviz和graphviz.js的viz.js(https://github.com/mdaines/viz.js/)实际上具有可从网页使用的API,以及足够的示例来理解。

可以尝试将graphviz转换为javascript,就像在“ PDF阅读器”示例中所做的那样:https :
//github.com/kripken/emscripten

这不是现成的graphviz替代品,但d3.js是一个库,可以根据给定的数据进行各种布局,并且将是实现graphviz的绝佳平台。

这是一个力导向布局的示例,它是graphviz的一种形式。

这是有关带有令人敬畏的交互式幻灯片的布局的演讲

为了了解该项目,教程非常好。

这是使用Emscripten完成的Graphviz到Javascript的交叉编译

https://github.com/bpartridge/graphviz.js

本文地址:http://javascript.askforanswer.com/dengtongyuchunjavascript-graphviz-guanbi.html
文章标签: ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇: