QuickGraph

Enter Javascript here. Put your text results into a string variable called output. Graphics commands will be attached to a variable called canvas.

Output

Canvas
Your browser does not support the CANVAS tag, loser.

This page contains a Javascript text editor and interpreter that provides a fully-functional run-time composition and execution environment. The magic was produced from uncounted minutes of effort and essentially one line of code (i.e., use of the eval function).

Feel free to practice your Javascript by writing code in the upper text box. By pressing the Go! button, your routine is executed and any text that you have assigned to a string variable called output is inserted into the lower text box. Information on processing time and cost is attached to the output. Please keep track of all run-time costs. When the total gets to be $10,000, drop me an email and we can discuss payment options.

For most modern browsers, you can now use the CANVAS tag in HTML to do graphics. On this page there's a 600 by 400 pixel box which is set up to draw commands attached to a canvas variable. See the initial Javascript code for an example of how to do this.

There are some rudimentary storage tools (Catalog, Save, Load, Delete) based on localStorage where you can keep your Javascript snippets.

Some error checking is in place, but I haven't figured out yet how to break out of infinite loops.

This page is functional on an iPhone or iPod Touch, but the versions of Javascript on these devices do not seem to support scroll bars in text boxes, so you'll have to keep your code and output short. Also be careful with the helpful typing correction features of these devices; autocapitalization and automatic conversion of two spaces to a period may interfere with the execution of your code.

Here are some canvas instructions:

    fillStyle = "rgb(200,0,0)"
    fillStyle = "blue"
    fillStyle = "#FFA500"
    strokeStyle = "red"

    fillRect(10, 10, 55, 50)
    clearRect(45,45,60,60)
    strokeRect(50,50,50,50)

    beginPath()
    moveTo(30, 30)
    lineTo(150, 150)
    bezierCurveTo(60, 70, 60, 70, 70, 150)
    lineTo(30, 30)
    fill()
    stroke()

    fillStyle = "black"
    textBaseline = "top"
    font= "9pt Helvetica"
    font="24pt Times"
    textAlign = "center"
    fillText("Your ad here", 100, 100)
    strokeStyle="red"
    strokeText("Your ad here", 200, 200)

Jeffrey Clymer -- Debut: May 7, 2009. Revision 4: December 31, 2016 -- Email -- Homepage

Visitors: