WaveDorm数字时序图绘制,专门给IC工程师使用的控件

By admin at 2021-09-25 • 0人收藏 • 280人看过

image.png

image.png

WaveDrom是一个免费的开源在线数字时序图(波形)渲染引擎,它使用javascript、HTML5和SVG将WaveJSON输入文本描述转换为SVG矢量图形。

WaveJSON是JSON格式的应用程序。WaveJSON的目的是为数字HW/IC工程师使用的数字时序图提供一种紧凑的交换格式.

介绍:https://blog.csdn.net/ASimpleMan1/article/details/108921294

https://observablehq.com/@pygc/hitchhiker-wavedrom

https://github.com/zhajio1988/wavedrom

import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio form";right=759;bottom=469)
winform.add()
/*}}*/

import web.form
var wb = web.form(winform);

wb.html = /**
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/1.6.2/skins/default.js" type="text/javascript"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/1.6.2/wavedrom.min.js" type="text/javascript"></script>
</head>
<body onload="WaveDrom.ProcessAll()">
</body>
<script type="WaveDrom">
{signal: [
  {name: 'clk', wave: 'p.....|...'},
  {name: 'dat', wave: 'x.345x|=.x', data: ['head', 'body', 'tail', 'data']},
  {name: 'req', wave: '0.1..0|1.0'},
  {},
  {name: 'ack', wave: '1.....|01.'}
]}
</script>
</html>
**/


winform.show();
win.loopMessage();


2 个回复 | 最后更新于 2021-09-25
2021-09-25   #1

cloudflare 有些奇怪的不正常,用这个就卡住没反应,换成 jsdelivr 就好了。
jsdelivr 在国内访问速度最快最稳定,建议优先用这个。

import win.ui;
/*DSG{{*/
var winform = win.form(text="WaveDorm 数字时序图绘制")
/*}}*/
 
import web.form
var wb = web.form(winform);
 
wb.html = /**
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
    <script src="https://cdn.jsdelivr.net/npm/wavedrom@1.6.2/skins/default.min.js" type="text/javascript"></script>
    <script src="https://cdn.jsdelivr.net/npm/wavedrom@1.6.2/wavedrom.min.js" type="text/javascript"></script>
</head>
<body onload="WaveDrom.ProcessAll()">
</body>
<script type="WaveDrom">
{signal: [
  {name: 'clk', wave: 'p.....|...'},
  {name: 'dat', wave: 'x.345x|=.x', data: ['head', 'body', 'tail', 'data']},
  {name: 'req', wave: '0.1..0|1.0'},
  {},
  {name: 'ack', wave: '1.....|01.'}
]}
</script>
</html>
**/
 
winform.show();
win.loopMessage();


2021-09-25   #2

还可以在 aardio 里直接调用 WaveDrom ,例如:

import win.ui;
/*DSG{{*/
var winform = win.form(text="WaveDorm 数字时序图绘制")
/*}}*/
  
import web.form
var wb = web.form(winform);
  
wb.html = /**
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script src="https://cdn.jsdelivr.net/npm/wavedrom@1.6.2/skins/default.min.js" type="text/javascript"></script>
<script src="https://cdn.jsdelivr.net/npm/wavedrom@1.6.2/wavedrom.min.js" type="text/javascript"></script>
</head> 
<body>
**/

wb.wait();
 
var ele = wb.document.createElement("script");
ele.type = "WaveDrom";

import web.json;
ele.innerHTML = web.json.stringify({
	signal: {
  		{name: 'clk', wave: 'p.....|...'},
  		{name: 'dat', wave: 'x.345x|=.x', data: {'head', 'body', 'tail', 'data'}},
  		{name: 'req', wave: '0.1..0|1.0'},
  		{},
  		{name: 'ack', wave: '1.....|01.'}
	}
})

wb.body.appendChild(ele);
wb.script.WaveDrom.ProcessAll();
  
winform.show();
win.loopMessage();


登录后方可回帖

登 录
信息栏
本站永久域名:HtmLayout.Cn
纯私人站,当笔记本用的,学到哪写到哪,目前在学aardio+halcon机器视觉.
AARDIO语言QQ群:70517368
Aardio 官方站:Aardio官方
Aardio最新功能:Aardio官方更新日志
C大Aardio论坛:Aar爱好者论坛
本 站 主 站:Stm32cube中文网
Sciter中文在线文档Sciter在线学习文档
赞助商:才仁机械




Loading...