The tutor shows how to produce a graph of sinx on a web page using jsDraw2DX.

I’ve mentioned jsDraw2DX in a couple of posts (here and here).

For producing a graph of sinx, the basic construct is

Above, A,b,c,and d are numbers to customize the sin graph. x_start and x_end are the start and end x-coordinates of the graph. thePen is an instance of jxPen, used to draw curves and outlines. graphics_div is the <div> element in which the graphics will be displayed.

Since webpage coordinates often start from the upper corner, then go across and down (rather than up), you may find you need the parameter A to be negative for the graph to look as expected. For instance, y=-sinx might be needed to produce a graph that looks like y=sinx should.

Here’s an example:

The actual function to produce the graph above in jsDraw2DX:

Source:

jsDraw2DX

Jack of Oracle Tutoring by Jack and Diane, Campbell River, BC.