-
Notifications
You must be signed in to change notification settings - Fork 865
Deprecated Graph API
It's possible to include graphs in your problems, hints, and solution/answers. A basic graph is defined with a class
of graph
. Width and height are specified as CSS in a style
attribute like so:
<div class="graph" style="width: 200px; height: 200px;">
<!-- Graph-related commands here. -->
</div>
You can then use graph-related commands to do rendering. At the moment the exact API for rendering is very much in flux. We're currently using a variation of the ASCIIsvg API but are looking to switch to something better.
For a current list of commands see the following: http://www1.chapman.edu/~jipsen/svg/asciisvgcommands.html
If you wish to set the styling for how drawing should look you can currently do this in the data-style
attribute on the graph element. For example:
<div class="graph" style="width: 400px; height: 400px;"
data-style="font-size: 15px; font-family: sans-serif; font-style: bold; stroke: blue;">
</div>
Additionally there are built-in styles of graphs. At the moment the only built-in style is "plane" (which gives you a -10 - 10 x/y coordinate grid). This can be set using the data-graph-type
attribute.
An example full graph definition is as follows:
<div class="graph" style="width: 400px; height: 400px;"
data-style="font-size: 15px; font-family: sans-serif; font-style: bold; stroke: blue;"
data-graph-type="plane">
plot('(' + quadratic + line + ')/' + line);
ASdot([a, limtoa], 4, "black", "white");
</div>