Been walking around with this idea for a while, and always started it but discontinued it thinking it’s no use anyway, but this time I finished it. I don’t know if that makes it of any use, but I thought I’d share it anyway. Maybe it’s handy for some people learning about functions in Math. Part of it is in Dutch, other parts are in English, sorry.
You first create an instance of the class, that will generate an empty graph field. Then, by setting the function f, the class starts drawing the graph of that function automatically. Right now it’s set to f(x) = x³, but you can change it to anything you want and watch the graph of the function you entered.
You can set the center point of the graph field, as well as the amount of pixels to be one unit on the axes. Furthermore you can specify the movieclip to generate the graph in and specify four safe depths for the class to create auxiliary movieclips in. These movieclips and thus the depths as well are necessary - these are the movieclips used to draw in using the Drawing API.
Assenstelsel = function (cx, cy, parent, safedepths, unitlength) {
this.ref = parent;
this.func = undefined;
this.unit = unitlength;
this.center = {x:cx, y:cy};
this.ref.createEmptyMovieClip("__as_veld", safedepths[0]);
this.ref.createEmptyMovieClip("__as_assen", safedepths[1]);
this.ref.createEmptyMovieClip("__as_grafiek", safedepths[2]);
this.ref.createEmptyMovieClip("__as_nummers", safedepths[3]);
Assenstelsel.id == undefined ? Assenstelsel.id=1 : Assenstelsel.id++;
this.tekenAssen();
};
Assenstelsel.prototype.tekenAssen = function() {
this.ref.__as_assen.lineStyle(0, 0x000000, 100);
this.ref.__as_assen.moveTo(0, this.center.y);
this.ref.__as_assen.lineTo(Stage.width, this.center.y);
this.ref.__as_assen.moveTo(this.center.x, 0);
this.ref.__as_assen.lineTo(this.center.x, Stage.height);
this.tekenStrepen();
};
Assenstelsel.prototype.tekenNummers = function() {
var d = 0;
format = new TextFormat();
format.font = "Arial";
format.size = 10;
format.color = 0x000000;
var leftStart = Math.floor(-this.center.x/this.unit);
var rightEnd = Math.floor((Stage.width-this.center.x)/this.unit);
for (var i = leftStart; i<=rightEnd; i++) {
curX = this.center.x+(i*this.unit);
this.ref.__as_nummers.createTextField("nr_x"+i, d++, curX+2, this.center.y+5, 1, 1);
this.ref.__as_nummers["nr_x"+i].autoSize = true;
this.ref.__as_nummers["nr_x"+i].text = i;
this.ref.__as_nummers["nr_x"+i].setTextFormat(format);
}
var bottomStart = -Math.floor((Stage.height-this.center.y)/this.unit);
var topEnd = Math.floor(this.center.y/this.unit);
for (var i = bottomStart; i<=topEnd; i++) {
if (i != 0) {
curY = this.center.y-(i*this.unit);
this.ref.__as_nummers.createTextField("nr_y"+i, d++, this.center.x+5, curY, 1, 1);
this.ref.__as_nummers["nr_y"+i].autoSize = true;
this.ref.__as_nummers["nr_y"+i].text = i;
this.ref.__as_nummers["nr_y"+i].setTextFormat(format);
this.ref.__as_nummers["nr_y"+i]._y = curY-(this.ref.__as_nummers["nr_y"+i]._height/2)
}
}
};
Assenstelsel.prototype.tekenVeld = function(col) {
this.ref.__as_veld.lineStyle(0, col, 100);
var leftStart = Math.floor(-this.center.x/this.unit);
var rightEnd = Math.floor((Stage.width-this.center.x)/this.unit);
for (var i = leftStart; i<=rightEnd; i++) {
curX = this.center.x+(i*this.unit);
this.ref.__as_veld.moveTo(curX, Stage.height);
this.ref.__as_veld.lineTo(curX, 0);
}
var bottomStart = -Math.floor((Stage.height-this.center.y)/this.unit);
var topEnd = Math.floor(this.center.y/this.unit);
for (var i = bottomStart; i<=topEnd; i++) {
curY = this.center.y-(i*this.unit);
this.ref.__as_veld.moveTo(0, curY);
this.ref.__as_veld.lineTo(Stage.width, curY);
}
};
Assenstelsel.prototype.tekenStrepen = function() {
var leftStart = Math.floor(-this.center.x/this.unit);
var rightEnd = Math.floor((Stage.width-this.center.x)/this.unit);
for (var i = leftStart; i<=rightEnd; i++) {
curX = this.center.x+(i*this.unit);
this.ref.__as_assen.moveTo(curX, this.center.y-5);
this.ref.__as_assen.lineTo(curX, this.center.y+5);
}
var bottomStart = -Math.floor((Stage.height-this.center.y)/this.unit);
var topEnd = Math.floor(this.center.y/this.unit);
for (var i = bottomStart; i<=topEnd; i++) {
curY = this.center.y-(i*this.unit);
this.ref.__as_assen.moveTo(this.center.x-5, curY);
this.ref.__as_assen.lineTo(this.center.x+5, curY);
}
this.tekenVeld(0xDDDDDD);
this.tekenNummers();
};
Assenstelsel.prototype.tekenGrafiek = function() {
var startnx = -this.center.x/this.unit;
var startny = this.func(startnx);
var beginy = this.center.y-(startny*this.unit);
this.ref.__as_grafiek.clear();
this.ref.__as_grafiek.lineStyle(0, 0x000000, 100);
this.ref.__as_grafiek.moveTo(0, beginy);
for (var i = 0; i<=Stage.width; i += 0.1) {
var x = (i-this.center.x)/this.unit;
var y = this.func(x);
var gy = this.center.y-(y*this.unit);
gy>=-20 && gy<=Stage.height+20 && !isNaN(gy) ? this.ref.__as_grafiek.lineTo(i, gy) : this.ref.__as_grafiek.moveTo(i, gy);
}
};
Assenstelsel.prototype.setF = function(val) {
this.func = val;
this.tekenGrafiek();
};
Assenstelsel.prototype.getF = function() {
if (this.func != undefined) {
return this.func;
}
trace("Geen functie gedefinieerd.");
};
Assenstelsel.prototype.addProperty("f", Assenstelsel.prototype.getF, Assenstelsel.prototype.setF);
test = new Assenstelsel(Stage.width/2, Stage.height/2, _root, [1, 2, 3, 4], 37);
test.f = function(x) {
return x*x*x
};
