...

<!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 > 时序图的更多相关文章

  1. Sequence Diagram时序图 - 应该是最简洁有力的业务了

    直接看UML吧,一目了然,不用解释.自信男人,无须多言. 这是用ListView显示Post的流程. 这是Uppdate User Profile的流程.自信男人,无须多言.

  2. 【UML 建模】UML入门 之 交互图 -- 时序图 协作图详解

    . 作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/17927131 . 动态图概念 : 从静态图中抽取瞬间值 ...

  3. UML入门 之 交互图 -- 时序图 协作图详解

    作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/17927131 动态图概念 : 从静态图中抽取瞬间值的变化描 ...

  4. [UML]UML系列——时序图（顺序图）sequence diagram

    系列文章 [UML]UML系列——用例图Use Case [UML]UML系列——用例图中的各种关系(include.extend) [UML]UML系列——类图Class [UML]UML系列——类 ...

  5. 时序图 Sequence Diagram

    时序图(Sequence Diagram)是显示对象之间交互的图,这些对象是按时间顺序排列的. 时序图中显示的是参与交互的对象及其对象之间消息交互的顺序. 下面这张图介绍了时序图的基本内容: 下面这张 ...

  6. UML建模之时序图（Sequence Diagram）

    一.时序图简介(Brief introduction) 二.时序图元素(Sequence Diagram Elements) 角色(Actor) 对象(Object) 生命线(Lifeline) 控制 ...

  7. UML建模之时序图（Sequence Diagram）<转>

    UML建模之时序图(Sequence Diagram)   一.时序图简介(Brief introduction) 二.时序图元素(Sequence Diagram Elements) 角色(Acto ...

  8. UML时序图(Sequence Diagram)学习笔记

    什么是时序图时序图(Sequence Diagram),又名序列图.循序图,是一种UML交互图.它通过描述对象之间发送消息的时间顺序显示多个对象之间的动态协作. 让我们来看一看visio2016对时序 ...

  9. 安装StarUML 及使用时序图（Sequence Diagram）和用例图（use case diagram）

    时序图 用例图

  10. Python设计模式 - UML - 时序图(Sequence Diagram)

    简介 时序图表示参与者与对象之间.对象与对象之间的动态交互过程及时序关系. 时序图详细而直观地展示了对象随时间变化的状态.调用关系和消息时序,时序图中的主要元素有:参与者(Actor), 对象(Obj ...

随机推荐

  1. xLua自定义加载器

    xLua入门基础 环境配置 github下载xLua文件: xLua是腾讯开发,据说比较先进: 下载下来后将Plugins和XLua文件夹考进项目: Plugins多平台权限:XLua和C#交互: t ...

  2. Windows 11正式版来了，下载、安装教程、一起奉上!

    Windows 11正式版已经发布了,今天给大家更新一波Win11系统的安装方法,其实和Win10基本一样,有多种方法.   安装Win11前请先查看电脑是否支持Win11系统,先用微软自家的PC H ...

  3. Rafy 框架 - 实体支持只更新部分变更的字段

    Rafy 快一两年没有大的更新了.并不是这个框架没人维护了.相反,主要是因为自己的项目.以及公司在使用的项目,都已经比较稳定了,也没有新的功能添加.但是最近因为外面使用了 Rafy 的几个公司,找到我 ...

  4. Rclone使用教程 - 挂载Onedrive和谷歌网盘

    1. 介绍 Rclone 是一个用于多个云平台之间同步文件和目录的命令行工具,其支持多种运营商网盘. 官网网址:https://rclone.org 开源地址:https://github.com/n ...

  5. MySQL的详细讲解

    目录 Mysql的架构与历史 MySQL的逻辑架构 更新中---- Mysql的架构与历史 MySQL的逻辑架构 第二层的架构是所有的跨引擎的功能实现的地方,例如:存储,触发器,视图等. 第三层半酣了 ...

  6. HCNP Routing&Switching之BGP防环机制和路由聚合

    前文我们了解了BGP路由宣告相关话题,回顾请参考https://www.cnblogs.com/qiuhom-1874/p/15440860.html:今天我们来聊一聊BGP防环机制和路由聚合相关话题 ...

  7. Coursera Deep Learning笔记 改善深层神经网络：超参数调试 Batch归一化 Softmax

    摘抄:https://xienaoban.github.io/posts/2106.html 1. 调试(Tuning) 超参数 取值 #学习速率:\(\alpha\) Momentum:\(\bet ...

  8. AIApe问答机器人Scrum Meeting 4.23

    Scrum Meeting 1 日期:2021年4月23日 会议主要内容概述:各成员汇报进度情况,前后端针对WebAPI进行协调与统一工作. 一.进度情况 组员 负责 两日内已完成的工作 后两日计划完 ...

  9. SpringBoot小知识点

    记录SpringBoot的小知识点 一.在 Spring 上下文刷新之前设置一些自己的环境变量 1.实现 EnvironmentPostProcessor 接口 2.spring.factories ...

  10. poi实现生成下拉选

    在我们日常开发中,经常需要使用poi操作excel文件,现在就简单介绍一下在poi中是如何生成下拉选的. 1.创建workbook 2.创建数据约束 3.设置数据的有效性 @Test public v ...