WaveDrom is Free and Open Source online digital timing diagram (waveform) rendering engine that uses javascript, HTML5 and SVG to convert WaveJSON input text description into SVG vector graphics.
WaveJSON is an application of the JSON format. The purpose of WaveJSON is to provide a compact exchange format for digital timing diagrams utilized by digital HW / IC engineers.
The engine using WaveDromSkin skin mechanism to render complete picture.
WaveDrom timing diagrams can be embedded into the web pages, blogs, wikis to be rendered by the most of modern browsers:
There are 3 steps to insert WaveDrom diagrams directly into your page:
- Put following line into your HTML page
<header>
or<body>
:
<script src="http://wavedrom.com/skins/default.js" type="text/javascript"></script>
<script src="http://wavedrom.com/wavedrom.min.js" type="text/javascript"></script>
or from CDN:
<script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/1.4.1/skins/default.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wavedrom/1.4.1/wavedrom.min.js" type="text/javascript"></script>
- Set
onload
event for HTML body.
<body onload="WaveDrom.ProcessAll()">
- Insert WaveJSON source inside HTML
<body>
wrapped with<script>
tag:
<script type="WaveDrom">
{ signal : [
{ name: "clk", wave: "p......" },
{ name: "bus", wave: "x.34.5x", data: "head body tail" },
{ name: "wire", wave: "0.1..0." },
]}
</script>
Script will find all <script type="WaveDrom">
instances and insert timing diagram at that point.
(http://wavedrom.com/impress.html)
Blogger integration: (http://wavedrom.blogspot.com/2011/08/wavedrom-digital-timing-diagram-in-your.html)
WaveDromEditor is online real-time editor of digital timing diagrams based on WaveDrom engine and WaveJSON format.
- Download latest
wavedrom-editor-v1.4.2-win-{ia32|ia64}.zip
release from here: releases - Unzip it into working direactory.
- run the editor:
WaveDromEditor.exe
- Download latest
wavedrom-editor-v1.4.2-linux-{ia32|x64}.tar.gz
release from here: releases - unzip-untar the package:
tar -xvzf wavedrom-editor-v1.3.0-linux-x64.tar.gz
- run the editor:
./WaveDromEditor/linux64/WaveDromEditor
- Download latest
wavedrom-editor-v1.4.2-osx-x64.zip
release: - unzip
- run
The directory server
contains a script file that runs as a console application when
executed with phantomjs. Allows one to render the wavedrom-scripts to a SVG or PNG file.
Please use WaveDrom user group for discussions, questions, ideas, whatever.
See LICENSE.