当前位置 博文首页 > 依稀_yixy的博客:WaveDrom——数字时序图渲染引擎

    依稀_yixy的博客:WaveDrom——数字时序图渲染引擎

    作者:[db:作者] 时间:2021-09-15 10:23

    WaveDrom

    1. WaveDrom介绍

    WaveDrom官网 https://wavedrom.com/

    在这里插入图片描述
    WaveDrom是一个免费开源的在线数字时序图渲染引擎。它可以使用JavaScript, HTML5和SVG来将时序图的WaveJSON描述转成SVG矢量图形,从而进行显示。WaveDrom可以嵌入到任何网页中。

    1.1 WaveDrom功能

    1.1.1 绘制数字时序图

    在这里插入图片描述

    1.1.2 绘制寄存器图

    在这里插入图片描述

    1.1.3 绘制逻辑电路图

    在这里插入图片描述

    WaveDrom编辑器可在浏览器中运行,也可以安装在系统上。渲染引擎可以嵌入到任何网页中。

    2. WaveDrom的使用

    WaveDrom 在线编辑器 https://wavedrom.com/editor.html
    WaveDrom官网 https://wavedrom.com/
    WaveJSON https://github.com/wavedrom/schema/blob/master/WaveJSON.md

    WaveDrom可以在线编辑也可以下载安装,可以在官网首页找到这两个入口。

    • 在线编辑方式,版本较新,但需要联网。
    • 下载安装方式,版本较官网旧一些,无需联网即可使用。

    在这里插入图片描述

    在编辑器中输入 WaveJSON 格式的数字时序图描述,即可实时渲染出相应的数字时序图。

    WaveJSON 格式是十分简单的,主要需要记忆的是各个符号所对应的波形。
    在这里插入图片描述

    3. WaveDrom文档

    3.1 WaveDrom官网

    WaveDrom官网: https://wavedrom.com/
    Github: https://github.com/wavedrom/wavedrom

    进入官网,可以看到如下界面。
    在这里插入图片描述

    3.1.1 WaveDrom在线编辑器(WaveDrom Editor)

    官网首页上方Editor 可进入WaveDrom的在线编辑器。
    在这里插入图片描述
    WaveDrom在线编辑器显示如下图,上方是WaveJSON格式的数字时序图描述文本,下方是对应的数字时序图。

    可以看到,绘制出来的图形是十分美观的,而且WaveDrom语法简单,用不同的字符表示不同的波形,十分容易学习
    在这里插入图片描述

    3.1.2 官方教程1(数字时序图)

    WaveDrom Tutorial https://wavedrom.com/tutorial.html

    官网首页上方Tutorial 可进入WaveDrom的官网教程。
    在这里插入图片描述
    里面包含多个示例,可以很好地对WaveDrom进行学习。
    在这里插入图片描述

    3.1.3 官方教程2(逻辑电路图)

    WaveDrom Tutorial2(schematic) https://wavedrom.com/tutorial2.html

    官网首页下方Tutorial2(schematic) 可进入WaveDrom的逻辑电路图绘制官方教程。
    在这里插入图片描述
    教程里面讲解了逻辑电路图的绘制示例。
    在这里插入图片描述

    3.1.3 SNUG2016 Pager

    官网首页下方SNUG2016 Pager 可以进入。
    在这里插入图片描述
    里面包含了一些对WaveDrom的描述,可以了解地更深入一些。
    在这里插入图片描述

    3.2 WaveDrom Github主页

    WaveDrom Github https://github.com/wavedrom/wavedrom

    在这里插入图片描述

    3.3 Obserable WaveDrom

    Observable https://observablehq.com/collection/@drom/wavedrom

    作者在Obserable社区上发布的一些博客
    在这里插入图片描述

    cs
    下一篇:没有了
aisi3613的博客:【Alpha】阶段第二次Scrum Meeting aisi3613的博客:Gamma阶段 测试报告 aisi3613的博客:Gamma阶段发布说明 aisi3613的博客:团队事后分析 aisi3613的博客:[技术博客]采用Bootstrap框架进行排版布局 aisi3613的博客:[技术博客]使用CDN加快网站访问速度 aisi3613的博客:压力测试报告 aisi3613的博客:[技术博客]JSCover+selenium获得js代码覆盖率 aisi3613的博客:使用highcharts绘制美观的燃尽图 a12435的博客:Beta阶段项目总结 weixin_30622107的博客:【Beta】Phylab 测试报告 weixin_33763244的博客:Beta阶段总结 weixin_30920597的博客:Beta版本测试报告以及Beta版本发布说明 weixin_33696822的博客:Beta版测试报告 weixin_30810583的博客:Beta阶段综合报告 weixin_30755709的博客:Beta阶段总结分析报告 洛克儿Roark的博客:软件压力和兼容性测试报告 dbb553371的博客:[Gamma阶段]测试报告 weixin_30338743的博客:gamma测试报告 weixin_30697239的博客:Beta版本――项目测试 S_zhangmin的博客:计算机组成原理边学边记 S_zhangmin的博客:一点微信小程序小动画连接 S_zhangmin的博客:简单爬虫 post篇 S_zhangmin的博客:Python对于私有变量的使用 S_zhangmin的博客:Python 时间格式 S_zhangmin的博客:python 继承方法小总结 S_zhangmin的博客:python 几种常见的复制操作小结 S_zhangmin的博客:scrapy在存储数据到json文件中时,中文变成为 S_zhangmin的博客:ORACLE sql走过的一些坑 S_zhangmin的博客:Matlab智能算法chap1 S_zhangmin的博客:python 图片整理成文字 S_zhangmin的博客:Talend 连接数据库时,其他基本信息都正确时 S_zhangmin的博客:install gensim 安装Gensim的坑 S_zhangmin的博客:python 安装库时 出现 ChecksumMismatchError S_zhangmin的博客:干净的Edge 初始页面 S_zhangmin的博客:python数据分析常用库简介 S_zhangmin的博客:Python easygui中没有msgbox或者巴拉巴拉模块 S_zhangmin的博客:回归方程怎么得出的 S_zhangmin的博客:HDFS 第一名称节点和第二名称节点 S_zhangmin的博客:MATLAB安装后出现“License Manager Error -8 甜筒冰激凌的博客:Alpha测试 / Beta测试 / 黑盒测试 /白盒测试 Alpha和Beta测试之间的区别_culing2941的博客:alpha beta测试 慎思知行:Alpha 测试与 Beta 测试:有什么区别? cptj5564的博客:alpha测试 什么是ALPHA?_cumtb2002的博客:什么是alpha测试 xiaojing0511的博客:Alpha测试和Beta测试的区别 SecondJanuary:Alpha测试(α测试) / Beta测试(β测试) 英雄哪里出来:??13万字《C语言动漫对话教程(入门篇)》??(建议收 xpj8888的博客:第三周 超参数调试、Batch正则化和程序框架:3. xpj8888的博客:wordpress插件管理(五)WP 数学公式插件 LaTeX ASP.NET Core MVC 修改视图的默认路径及其实现原理解析 docker compose 一键部署分布式配置中心Apollo的过程详解 使用SQL SERVER存储过程实现历史数据迁移方式 Django框架之django admin的命令行详解 解决python将xml格式文件转换成txt文件的问题(xml.etree方法) 网站加速哪家强?四大免费CDN服务评测大PK php session无法传值怎么办 macbook pro怎么安装php7 高质量笔记来了!关于PHP7性能优化 php轻松实现可爱的随机头像 微信公众账号怎么注册申请?微信公众账号注册流程 微信公众平台服务号、订阅号和企业号之间有什么区别? android Chronometer控件使用大全 关于python变量的引用以及在底层存储原理 SpringBoot 在项目启动之后执行自定义方法的两种方式小结 uniapp实现滑动评分效果 vue中LocalStorage与SessionStorage的区别与用法 SEO案例分析 alimama做SEO引流量的方法 如何解决php图片名中文乱码问题 php命令行输出乱码怎么办