I wanted to draw some waveforms for my NEC IR decoder for SparkCore post. I suppose I could have drawn them by hand, or maybe researched some hopefully free software that would make drawing them easier. I did not do that, however.
I instead wrote a small Javascript library that creates SVG waveform diagrams in a web browser. It should not be considered the end-all of waveform drawing libraries, as I only implemented enough to draw the diagrams I wanted to draw. It could be a starting point for a full-featured library. Or an example of how to create SVG drawings from Javascript.
SVG is the scalable vector graphics image format. Unlike formats like JPEG or PNG, it specifies lines, arcs, and text mathematically rather than by pixel, so you can zoom in. And when you print, the text is always clear and printed at the full resolution of your printer.
Important Caveat: SVG does not display in Internet Explorer 8 and earlier! It works in pretty much everything else, however. This site has a good list of browser support for SVG.
My library relies on three Javascript libraries:
jquery
Keith Wood's jquery.svg for creating SVG images
FileSaver.js for locally saving the SVG images
You can view the sample site here.
Here's the Javascript for how the waveforms are described.
And, finally, the library. It's pretty straightforward, I think.
