js-sequence-diagrams > 时序图
...
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>时序图</title>
<script src="js/webfont.js"></script>
<script src="js/underscore.js"></script>
<script src="js/snap.svg-min.js"></script>
<script src="js/sequence-diagram-min.js"></script>
</head>
<body>
<pre id="text">
Title: 标题
participant 名称 // 声明
Note left of 名称:注释的内容 (左)
Note right of 名称:注释的内容 (右)
Note over 名称:注释的内容 (中间)
Note over 称呼,名称: 显示的内容 (跨越 | 两个)
称呼->名称:显示的内容 // 直线
称呼-->名称:显示的内容 // 虚线
名称->>称呼:显示的内容 // 大箭头
称呼-->>名称 // 声明:显示的内容 // 虚线加大箭头，返回都最初
名称-->>名称:显示的内容 // 自己》自己 </pre>
<!-- 语法 “” https://github.com/bramp/js-sequence-diagrams/blob/master/src/grammar.jison -->
<div id="diagram"></div>
</body>
<script> /*var t ="Title: This is a title"
+"\nparticipant 镇街收件意见"
+"\nparticipant 镇街初审意见"
+"\nparticipant 镇街复审意见"
+"\nparticipant 中心初审意见"
+"\nparticipant 中心复审意见"
+"\nparticipant 区局终审意见"
+"\nNote right of 镇街收件意见: 镇街收件意见...";*/ //var d = Diagram.parse(t);
var d = Diagram.parse(document.getElementById('text').innerText);
//var diagram = Diagram.parse(document.getElementById('uml').innerText);
var options = {
//更改图表的样式，通常是'simple'，'hand'之一。可以使用registerTheme（...）注册新主题。
theme: 'simple'
//应用于图表svg标记的CSS样式。（仅在使用snap.svg时支持）
};
d.drawSVG('diagram', options); </script>
</html>
js-sequence-diagrams > 时序图的更多相关文章
- Sequence Diagram时序图 - 应该是最简洁有力的业务了
直接看UML吧,一目了然,不用解释.自信男人,无须多言. 这是用ListView显示Post的流程. 这是Uppdate User Profile的流程.自信男人,无须多言.
- 【UML 建模】UML入门 之 交互图 -- 时序图 协作图详解
. 作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/17927131 . 动态图概念 : 从静态图中抽取瞬间值 ...
- UML入门 之 交互图 -- 时序图 协作图详解
作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/17927131 动态图概念 : 从静态图中抽取瞬间值的变化描 ...
- [UML]UML系列——时序图（顺序图）sequence diagram
系列文章 [UML]UML系列——用例图Use Case [UML]UML系列——用例图中的各种关系(include.extend) [UML]UML系列——类图Class [UML]UML系列——类 ...
- 时序图 Sequence Diagram
时序图(Sequence Diagram)是显示对象之间交互的图,这些对象是按时间顺序排列的. 时序图中显示的是参与交互的对象及其对象之间消息交互的顺序. 下面这张图介绍了时序图的基本内容: 下面这张 ...
- UML建模之时序图（Sequence Diagram）
一.时序图简介(Brief introduction) 二.时序图元素(Sequence Diagram Elements) 角色(Actor) 对象(Object) 生命线(Lifeline) 控制 ...
- UML建模之时序图（Sequence Diagram）<转>
UML建模之时序图(Sequence Diagram) 一.时序图简介(Brief introduction) 二.时序图元素(Sequence Diagram Elements) 角色(Acto ...
- UML时序图(Sequence Diagram)学习笔记
什么是时序图时序图(Sequence Diagram),又名序列图.循序图,是一种UML交互图.它通过描述对象之间发送消息的时间顺序显示多个对象之间的动态协作. 让我们来看一看visio2016对时序 ...
- 安装StarUML 及使用时序图（Sequence Diagram）和用例图（use case diagram）
时序图 用例图
- Python设计模式 - UML - 时序图(Sequence Diagram)
简介 时序图表示参与者与对象之间.对象与对象之间的动态交互过程及时序关系. 时序图详细而直观地展示了对象随时间变化的状态.调用关系和消息时序,时序图中的主要元素有:参与者(Actor), 对象(Obj ...
随机推荐
- 自然语言处理标注工具——Brat（安装、测试、使用）
一.Brat标注工具安装 1.安装条件: (1)运行于Linux系统(window系统下虚拟机内linux系统安装也可以) (2)目前brat最新版本(v1.3p1)仅支持python2版本运行使用( ...
- mysql从零开始之MySQL 安装
MySQL 安装 所有平台的 MySQL 下载地址为: MySQL 下载 . 挑选你需要的 MySQL Community Server 版本及对应的平台. 注意:安装过程我们需要通过开启管理员权限来 ...
- Pytorch学习2020春-1-线性回归
线性回归 主要内容包括: 线性回归的基本要素 线性回归模型从零开始的实现 线性回归模型使用pytorch的简洁实现 线性回归的基本要素 模型 为了简单起见,这里我们假设价格只取决于房屋状况的两个因素, ...
- 写学习abcde的简单AI（C++实现）
#include <iostream> #include <time.h> #include <stdlib.h> #include <cmath> u ...
- Kubernetes-Service介绍(二)-服务发现
前言 本篇是Kubernetes第九篇,大家一定要把环境搭建起来,看是解决不了问题的,必须实战. Kubernetes系列文章: Kubernetes介绍 Kubernetes环境搭建 Kuberne ...
- Probius+Prometheus通过API集成POD监控
上一篇文章Probius+Kubernetes任务系统如虎添翼讲了我们把Kubernetes集成进了任务系统Probius,上线后小伙伴反馈虽然摆脱了Kubernetes-Dashboard,但还是得 ...
- 【UE4 C++】关卡切换、流关卡加载卸载
切换关卡 基于 UGameplayStatics:: OenLevel UGameplayStatics::OpenLevel(GetWorld(), TEXT("NewMap") ...
- 395.至少有 K 个重复字符的最长子串
题目 给你一个字符串 s 和一个整数 k ,请你找出 s 中的最长子串, 要求该子串中的每一字符出现次数都不少于k .返回这一子串的长度. 示例 1: 输入:s = "aaabb" ...
- 求求你了，用Docker吧
这是一个开始使用 Docker 的 Tutorial 大无语事件发生!大数据课实验课要用到Hadoop,实验指导是在一个Ubuntu虚机上通过安装包安装Hadoop并运行一个词频统计程序,整个实验就是 ...
- 在kivy中加图片
from kivy.app import App from kivy.uix.scatterlayout import ScatterLayout from kivy.uix.image import ...