Skip to content

dnaura/wavedrom

 
 

Repository files navigation

Build Status NPM version Built with Grunt Analytics Flattr this git repo

EDITOR | TUTORIAL

Introduction

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.

Screenshot

alt text

Web usage

WaveDrom timing diagrams can be embedded into the web pages, blogs, wikis to be rendered by the most of modern browsers:

alt text 4+ alt text 10+ alt text 5.1+ alt text 12+ alt text 11

HTML pages

There are 3 steps to insert WaveDrom diagrams directly into your page:

  1. 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.js" type="text/javascript"></script>
  1. Set onload event for HTML body.
<body onload="WaveDrom.ProcessAll()">
  1. 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.

impress.js

(http://wavedrom.com/impress.html)

Blogs & Wikis

Blogger integration: (http://wavedrom.blogspot.com/2011/08/wavedrom-digital-timing-diagram-in-your.html)

Editor

WaveDromEditor is online real-time editor of digital timing diagrams based on WaveDrom engine and WaveJSON format.

Community

Please use WaveDrom user group for discussions, questions, ideas, whatever.

License

See LICENSE.

About

Digital timing diagram in your browser

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 87.8%
  • CSS 8.3%
  • Perl 3.9%