markdown+gravizo画UML类图

1. 将请求参数进行url编码
2. 不需要编码使用<>将网址括起来

本文不对plantUML的语法进行解释,直接戳

对url进行编码

需要编码的字符如下

1
2
3
abstract class AbstractList;
interface List;
List <|.. AbstractList;

使用在线编码网站提供的服务,直接戳

编码后的代码如下:

1
abstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B

请求的url为:

1
http://g.gravizo.com/svg?abstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B

在markdown文件中使用:

1
![示例1](http://g.gravizo.com/svg?abstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B)

结果如下:
示例1

使用python的库urllib进行编码

  1. 打开终端
  2. 输入python,显示结果如下:

    1
    2
    3
    4
    5
    $ python
    Python 2.7.10 (default, Jul 14 2015, 19:46:27)
    [GCC 4.2.1 Compatible Apple LLVM 6.0 (clang-600.0.39)] on darwin
    Type "help", "copyright", "credits" or "license" for more information.
    >>>
  3. 引入urllib库:import urllib

  4. 为变量raw赋值:raw = ‘’’abstract class AbstractList;interface List;List <|.. AbstractList;’’’
  5. 使用urllib的quote()方法:urllib.quote(raw),将得到如下的结果:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    >>> import urllib
    >>> raw = '''
    ... abstract class AbstractList;
    ... interface List;
    ... List <|.. AbstractList;
    ... '''
    >>> urllib.quote(raw)
    '%0Aabstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B%0A'
    >>>

得到结果与gravizo的网址组合在一起,如下:

1
http://g.gravizo.com/svg?%0Aabstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B%0A

在markdown文件中使用:

1
![示例2](http://g.gravizo.com/svg?%0Aabstract%20class%20AbstractList%3B%0Ainterface%20List%3B%0AList%20%3C%7C..%20AbstractList%3B%0A)

结果如下:
示例2

不需要编码使用<>将网址括起来

沿用上面的字符如下

1
2
3
abstract class AbstractList;
interface List;
List <|.. AbstractList;

在markdown中使用

1
![示例3](<http://g.gravizo.com/g?abstract class AbstractList;interface List;List <|.. AbstractList;>)

示例3
注意<>中的url连接不能有回车符号,但可以有空格

UML类图各线条怎么表示

继承

1
2
3
4
child --|> parent
![继承](http://g.gravizo.com/svg?Child --|> Parent;)
or
![继承](http://g.gravizo.com/svg?Parent <|-- Child;)

继承
or
继承

实现接口

1
2
3
4
ServiceImpl ..|> Service
![实现接口](http://g.gravizo.com/svg?ServiceImpl ..|> interface Service;)
or
![实现接口](http://g.gravizo.com/svg?nterface Service <|.. ServiceImpl;)

实现接口
or
实现接口

关联

1
2
Class09 -- Class10
![关联](http://g.gravizo.com/svg?Class09 -- Class10)

关联

依赖

1
2
Class13 --> Class14
![依赖](http://g.gravizo.com/svg?Class13 --> Class14)

依赖

组合

1
2
3
4
5
6
7
Person1 --* Hand1
or
Person --* Hand : 2 contains 1 <
eg:
![组合](http://g.gravizo.com/svg?Person *-- Hand : 1 contains 2 >;Person1 --* Hand1)
or
![组合](http://g.gravizo.com/svg?Person --* Hand : 2 contains 1 <;Person1 --* Hand1)

组合
or
组合

聚合

1
2
3
4
5
6
7
Wheel : 1 have 4 >
or
Car1 "1" o-- "4" Wheel1
eg:
![聚合](http://g.gravizo.com/svg?Car o-- Wheel : 1 have 4 >;Car o-- Wheel)
or
![聚合](http://g.gravizo.com/svg?Wheel1 --o Car1 : 4 have 1 <;Wheel1 --o Car1)

聚合
or
聚合

参考链接

https://www.ibm.com/support/knowledgecenter/zh/SS4JE2_7.5.5/com.ibm.xtools.modeler.doc/topics/cassn.html?pos=2