So far, when drawing a function, the range of x for which the graph is to be drawn has been given as parameters to the drawFunction method:
wGraph.drawFunction("sin(x),-5,5");
And the resulting graph is sized so that the function can be drawn over this range. If there are several drawings on a graph, the graph is sized so that each can be drawn on the graph, but any function will only be drawn over the range given.
If the range is not given, MathymaGraph uses its default range of −1 ≤ x ≤ 1 :
var wGraph = new mathyma.Graph(280,280);
wGraph.drawFunction("sin(x)");
wGraph.printInWindow();
Alternatively the range can be defined "globally" for the graph, in which case all functions without a defined range will be drawn for the whole range of the graph:
var wGraph = new mathyma.Graph(280,280);
wGraph.setXrange(-5,5);
wGraph.setXrange(-5,5);
wGraph.drawFunction("sin(x)");
wGraph.drawFunction("cos(x)");
wGraph.printInWindow();
If ranges are defined both for the graph and for the function, the function will be restricted to the range given with drawFunction, but once the range has been defined by setXrange, the graph will not be resized to accommodate the whole of the function range, or indeed any other drawing:
var wGraph = new mathyma.Graph(280,280);
wGraph.setXrange(-5,5);
wGraph.drawFunction("sin(x)",-10,0);
wGraph.drawPolygon("1,0,7,0.9,4,-0.7",true);
wGraph.printInWindow();
MathymaGraph will try to draw the optimal grid on the graph, so that as much information is given without it appearing too cluttered. However if you want to over-ride this you can set your own grid by defining the distance between the minor x-axes:
var wGraph = new mathyma.Graph(280,280);
wGraph.setXgrid(5);
wGraph.drawFunction("x*sin(x)",-7,7);
wGraph.printInWindow();
If you don't want the axes drawn at all, just set the x-grid to zero:
var wGraph = new mathyma.Graph(280,280);
wGraph.setXgrid(0);
wGraph.drawPolygon("1,0,7,1,2,-4",true);
wGraph.drawPolygon("0,1,8,-3,5,3",true);
wGraph.printInWindow();
MathymaGraph stretches or compresses the y-axis so that the drawing or drawings fill as much space as possible in the available window:
var wGraph = new mathyma.Graph(280,280);
wGraph.drawFunction("sin(x)",-11,11);
wGraph.printInWindow();
If you want to control the stretching yourself then use the setYstretch ( ) method:
var wGraph = new mathyma.Graph(280,280);
wGraph.setYstretch(Math.PI);
wGraph.setXgrid(Math.PI);
wGraph.drawFunction("sin(x)",-11,11);
wGraph.printInWindow();
Not that in this example we have stretched the y-axis by π, which means that a unit on the y-axis takes π times as much space as a unit on the x-axis. But in this example we have also set the x-grid to π, so on MathymaGraph's square grid the squares are π wide by 1 high.
Here's an alternative way of graphing the sine function:
var wGraph = new mathyma.Graph(360,200);
wGraph.setYstretch(1);
wGraph.setXgrid(1);
wGraph.drawFunction("sin(x*PI )",-3.5,3.5);
wGraph.printInWindow();
"Smooth" functions and curves are actually drawn as a large number of short straight lines. MathymaGraph defaults to 100 points, but in some cases this is not sufficient to give the impression of a smooth curve:
var wGraph = new mathyma.Graph(280,280);
wGraph.drawCurve("t*cos(t)","t*sin(t)",0,63);
wGraph.printInWindow();
Compare this with this curve using 1000 points:
var wGraph = new mathyma.Graph(280,280);
wGraph.drawCurve("t*cos(t)","t*sin(t)",0,63,1000);
wGraph.printInWindow();
alternatively you could set the default number of points for every function or curve on the graph:
var wGraph = new mathyma.Graph(280,280);
wGraph.setPoints(1000);
wGraph.drawCurve("t*cos(t)","t*sin(t)",0,63);
wGraph.printInWindow();
Of course sometimes it may be useful to have a coarse resolution, take a look at this example of a 'circle' drawn with between three and ten points:
var myWin=window.open('','', ...
.
for (var wPts = 3; wPts lt; 11; wPts++) {
var wGraph = new mathyma.Graph(180,180);
wGraph.setXgrid(0);
wGraph.setYstretch(1);
wGraph.drawCurve("cos(t)","sin(t)",Math.PI/2,5*Math.PI/2,wPts);
wGraph.print(myWin);
}
.