Graphics.js (system script)

From Spheriki

Jump to: navigation, search

The system script graphics.js by rizen provides functions to draw outlined rectangles and polygons.

1 Usage
2 Variables and functions of graphics.js
3 Examples
4 Notes
5 Known bugs

[edit]

Usage

RequireSystemScript("graphics.js");

[edit]

Variables and functions of graphics.js

TraceRectangle(x, y, width, height, color)
- draws an outlined rectangle on the video buffer at position (x,y) using the given 'width' and 'height'. The 'color' has to be an object of color type.
TracePoly(x, y, color)
- draws the outlines of a polygon. The x- and y-coordinates of its vertices are given as an array of numbers each. The polygone is drawn from (x[0],y[0]) to (x[1],y[1]) to ... to (x[n],y[n]) and from (x[n],y[n]) back to (x[0],y[0]). The 'color' has to be an object of color type.

[edit]

Examples

This draws an outlined rectangle at screen size onto the screen and waits until a key is pressed:

 RequireSystemScript("graphics.js");
 TraceRectangle(0, 0, GetScreenWidth()-1, GetScreenHeight()-1, CreateColor(255,0,255));
 FlipScreen();
 GetKey();

Now let's use TracePoly() to draw an outlined triangle:

 RequireSystemScript("graphics.js");
 var scrW = GetScreenWidth();
 var scrH = GetScreenHeight();
 TracePoly([0, scrW-1, 0], [0, scrH-1, scrH-1], CreateColor(255, 255, 0));
 FlipScreen();
 GetKey();

This'll draw a random pentagon:

 RequireSystemScript("graphics.js");
 
 // Calculating coordinates
 var x = new Array();
 var y = new Array();
 for (var a=0; a<5; a++) {
   x.push(Math.floor(Math.random()*GetScreenWidth()));
   y.push(Math.floor(Math.random()*GetScreenHeight()));
 }
 
 // Draw and wait for keypress
 TracePoly(x, y, CreateColor(255, 255, 255));
 FlipScreen();
 GetKey();

[edit]

Notes

It is necessary to call FlipScreen() after drawing graphics primitives to see something.
The Sphere API has even more functions to draw graphics primitives.
For circles, see circles.js (system script).

[edit]