在graphviz中创建可点击的图形
2024-08-24 02:13:57
1.创建一个dot文件,在节点属性中使用URL关键字:
target关键字指定链接打开的方式
//test.dot
digraph Arch {
A;
B [URL="http://docs.qq.com/", target="_blank"];
C;
A -> B -> C;
}
2. 生成图形:
dot -Tpng test.dot -o test.png
3. 生成HTML文件:
dot -Tcmapx test.dot -o test.html
生成的HTML如下:
<map id="Arch" name="Arch">
<area shape="poly" id="node2" href="http://docs.qq.com/" target="_blank" title="B" alt="" coords="77,125,76,118,70,111,62,106,52,103,41,101,30,103,20,106,12,111,7,118,5,125,7,133,12,139,20,145,30,148,41,149,52,148,62,145,70,139,76,133"/>
</map>
4.在HTML代码里加入一行:
<img src="test.png" usemap="#Arch"/>
<map id="Arch" name="Arch">
<area shape="poly" id="node2" href="http://docs.qq.com/" target="_blank" title="B" alt="" coords="77,125,76,118,70,111,62,106,52,103,41,101,30,103,20,106,12,111,7,118,5,125,7,133,12,139,20,145,30,148,41,149,52,148,62,145,70,139,76,133"/>
</map>
保存,打开这个HTML,就会发现B节点可点击,点击后新窗口打开了链接 docs.qq.com
Have fun!
最新文章
- jQuery-1.9.1源码分析系列(一)整体架构续
- i2c总线,设备,驱动之间的关系
- 纯C#实现Hook功能
- iOS出现<;object returned empty description>;的解决方法
- hdoj 2680 choose the best route
- java BigInteger
- poj2286The Rotation Game(迭代加深dfs)
- Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据
- 美化 - DropDownList控件
- webpack4升级指南
- java配置、IntelliJ IDEA Ultimate激活、
- [ZJOI2012]波浪弱化版(带技巧的DP)
- Python序列化之Json基础
- ML(5)——神经网络3(随机初始化与梯度检验)
- font-style字体设置
- pgm7
- 矩阵乘法优化DP
- 防火墙 Firewalld
- eclipse and systemtap
- geoserver-manager发布style失败