Difference between revisions of "Programming turtle graphics"

From JSXGraph Wiki
Jump to navigationJump to search
Line 48: Line 48:
 
function clearturtle() {
 
function clearturtle() {
 
   t.cs();
 
   t.cs();
   $('inputtext').value = 't.fd(100);';
+
   //$('inputtext').value = 't.fd(100);';
 
}
 
}
 
function clearlog() {
 
function clearlog() {
Line 88: Line 88:
 
function clearturtle() {
 
function clearturtle() {
 
   t.cs();
 
   t.cs();
   $('inputtext').value = 't.fd(100);';
+
   //$('inputtext').value = 't.fd(100);';
 
}
 
}
 
function clearlog() {
 
function clearlog() {

Revision as of 12:47, 21 December 2008

List of available commands

There is a predefined turtle object t. Therefore, all commands start with t, like t.fd(100);

* t.forward(len); or t.fd(len);
* t.back(len); or t.bk(len);
* t.right(angle); or t.rt(angle); (<math>0\leq angle \leq 360</math>)
* t.left(angle); or t.lt(angle);
* t.penUp(); or t.pu();
* t.penDown(); or t.pd();
* t.clearScreen(); or t.cs();
* t.clean();
* t.setPos(x,y); 
* t.home();
* t.hideTurtle(); or t.ht();
* t.showTurtle(); or t.st();
* t.setPenSize(size); (size: number)
* t.setPenColor(col); (col: colorString, e.g. 'red' or '#ff0000')

Input


Output

Log window



Source code

<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script>
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxturtle.js"></script>
<form><textarea id="inputtext" rows=3 cols=35 wrap="off" style="width:600px;">t.fd(100);</textarea><br />
<input type="button" value="run" onClick="run()">
<input type="button" value="clear" onClick="clearturtle()">
<input type="button" value="clear log" onClick="clearlog()">
</form>
<div id="box" class="jxgbox" style="width:600px; height:600px;"></div>
<pre id="logwindow" class="javascript javascript" style="font-family:monospace;"></pre>
var brd = JXG.JSXGraph.initBoard('box', {originX: 300, originY: 300, unitX: 1, unitY: 1});
var t = new JSXTurtleObj(brd);
function run() {
  //brd.suspendUpdate();
  var code = $('inputtext').value;
  if (code=='') { return; }
  eval(code);
  $('logwindow').innerHTML += code+'\n';
  //$('inputtext').value = '';
  //brd.unsuspendUpdate();
}
function clearturtle() {
  t.cs();
  //$('inputtext').value = 't.fd(100);';
}
function clearlog() {
  $('logwindow').innerHTML = '';
}
</script>