search

Adrninistrator / java-all-call-graph

Generate all call graph for Java Code.
Apache License 2.0
437 stars 111 forks source link

如何展示生成的链路 #8

Open likunpeng003 opened 2 years ago

likunpeng003 commented 2 years ago

大佬，有没有比较好的展示链路结果的插件吗

Adrninistrator commented 2 years ago

https://github.com/mermaid-js/mermaid 试过这个，就是层级太多了字体会被缩小了，看不清楚，而且没法拖动

image

likunpeng003 commented 2 years ago

使用这个，处理链路数据的过程复杂吗

likunpeng003 commented 2 years ago

需要把生成的链路数据处理成什么格式呢，过程复杂吗

在 2022-05-10 20:35:26，"Adrninistrator" @.***> 写道：

https://github.com/mermaid-js/mermaid 试过这个，就是层级太多了字体会被缩小了，看不清楚，而且没法拖动

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

Adrninistrator commented 2 years ago

新建一个html文件，输入以下内容并保存

<body>
  <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
  <div class="mermaid">
graph LR
A1[test1] --> B[test2]
B --> C3[n]
B --> D[b]
  </div>
</body>

打开网页，生成效果如下所示： image

如果使用这种方式展示的话，需要自己按上述格式生成html文件

jiangyongbing24 commented 2 years ago

https://github.com/mermaid-js/mermaid 试过这个，就是层级太多了字体会被缩小了，看不清楚，而且没法拖动

image

提供一些思路，使用https://github.com/mdaines/viz.js， graphviz 的js版本，研究一下subgraph的rank属性，可以通过一些算法策略控制，当某个深度太深的时候创建rank=same控制一下树的深度，并且可以根据字段数量设置合理的fontsize，并且可以设置合理的scale保证单个节点不会太小，可以大大优化可视效果。

除此之外，这是 https://github.com/nidi3/graphviz-java 的java版本，用纯Java直接生成图，只是把dot脚本换成了Java代码。集成之后开发者不需要去进行额外的工作就可以查看图。

Adrninistrator commented 2 years ago

https://github.com/mermaid-js/mermaid 试过这个，就是层级太多了字体会被缩小了，看不清楚，而且没法拖动 image

提供一些思路，使用https://github.com/mdaines/viz.js， graphviz 的js版本，研究一下subgraph的rank属性，可以通过一些算法策略控制，当某个深度太深的时候创建rank=same控制一下树的深度，并且可以根据字段数量设置合理的fontsize，并且可以设置合理的scale保证单个节点不会太小，可以大大优化可视效果。

除此之外，这是 https://github.com/nidi3/graphviz-java 的java版本，用纯Java直接生成图，只是把dot脚本换成了Java代码。集成之后开发者不需要去进行额外的工作就可以查看图。

感谢感谢，最近在加其他的功能，有空了研究下

beanww commented 2 years ago

使用mermaid的flowchart，解析向下调用链，生成 n[class1:method1] n --> n.1.1[class2:method2] 如上类似的语法文本，mermaid可以生成svg图形，是可以随浏览器伸缩的 构造js类似如下，useMaxWidth:false时默认生成的图形就会大于显示器屏幕不至于太小了:

Githubissues.
  • Githubissues is a development platform for aggregating issues.