Getting Started

To use these tools, add the script to the head of the html document.

These tools use the JavaScript Library Raphaël, so you'll need a copy of that as well.

<script type="text/javascript" src="raphael.js"></script>
<script type="text/javascript" src="linear.js"></script>

The commands are javascript functions that may be called from "inline scripts".

For example, inserting:

<script>
dia=diagram([100,30]);
dia.inductor([15,15],[85,15]);
dia.terminal([15,15],[85,15]);
</script>

into the document would yield:

Continue to the Reference to learn how to make more interesting things, or go back to the index to see examples.

Styling the figures

The diagrams and plots may be styled using the CSS selectors .diagram and .plot, respectively.
For example, adding colored backgrounds and rounded corners might look like this:

.diagram{
	background-color:#FAFAFA;
	border:solid 2px #DDD;
}
.plot{
	background-color:#FAFAFF;
	border:solid 2px #DDF;
}
.diagram, .plot{
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}