Na spletni strani lahko, če uporabimo Javascript, kažemo tudi grafiko in celo kaj animiramo. Tule primer sposojene kode iz spletnega učbenika Javascripta, ki sem jo priredil za svoje potrebe.
Koda je naslednja:
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width; charset=UTF-8; initial-scale=2.0"/>
<style>
.button {
padding: 15px 25px;
font-size: 24px;
text-align: center;
cursor: pointer;
outline: none;
color: #fff;
background-color: #4CAF50;
border: none;
border-radius: 15px;
box-shadow: 0 9px #999;
}
.button:hover {background-color: #3e8e41}
.button:active {
background-color: #3e8e41;
box-shadow: 0 5px #666;
transform: translateY(4px);
}
</style>
</head>
<p>
Kažem kroglico, ki se odbija od tal in sten.
<body>
<p><button class="button" onclick ="startGame();">Klikni tu za začetek</button>
<script>
var mySound;
var myGamePiece;
function startGame() {
myGamePiece = new component(10, "red", 5, 5);
// mySound=new sound("bounce.mp3");
myGameArea.start();
}
var myGameArea = {
canvas : document.createElement("canvas"),
start : function() {
this.canvas.width = 680;
this.canvas.height = 470;
this.canvas.style="border:10px solid #0000FF";
this.context = this.canvas.getContext("2d");
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
this.interval = setInterval(updateGameArea, 20);
},
stop : function() {
clearInterval(this.interval);
},
clear : function() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
}
}
function component(radij, color, x, y, type) {
this.type = type;
this.r = radij;
this.x = x;
this.y = y;
this.speedX = 3;
this.speedY = 0;
this.gravity = 0.1;
this.gravitySpeed = 0;
this.bounce = 0.98;
this.update = function() {
ctx = myGameArea.context;
ctx.beginPath();
ctx.fillStyle = color;
ctx.arc(this.x, this.y, this.r,0,2.1*Math.PI);
ctx.fill();
ctx.stroke()
}
this.newPos = function() {
this.gravitySpeed += this.gravity;
this.speedX=0.9995*this.speedX;
this.x += this.speedX;
this.y += this.speedY + this.gravitySpeed;
this.hitBottom();
}
this.hitBottom = function() {
var rockbottom = myGameArea.canvas.height - this.r;
var rob = myGameArea.canvas.width;
if ((this.y > rockbottom) || (this.y<0)) {
this.y=rockbottom;
//mySound.play();
this.gravitySpeed = -(this.gravitySpeed * this.bounce);
}
if ((this.x > rob-radij) || (this.x<5)) {
this.speedX=-this.speedX};
}
}
function updateGameArea() {
myGameArea.clear();
myGamePiece.newPos();
myGamePiece.update();
}
</script>
</body>
</html>
Z njo dobimo naslednjo animacijo:Z majhno spremembo zgornje kode pa lahko namesto kroglice dobimo prikaz njenega tira:
<!DOCTYPE html>
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width; charset=UTF-8; initial-scale=2.0"/>
<style>
.button {
padding: 15px 25px;
font-size: 24px;
text-align: center;
cursor: pointer;
outline: none;
color: #fff;
background-color: #4CAF50;
border: none;
border-radius: 15px;
box-shadow: 0 9px #999;
}
.button:hover {background-color: #3e8e41}
.button:active {
background-color: #3e8e41;
box-shadow: 0 5px #666;
transform: translateY(4px);
}
</style>
</head>
<p>
Kažem tir kroglice, ki se odbija od tal in sten.
<body>
<p><button class="button" onclick ="startGame();">Klikni tu za začetek</button>
<script>
var mySound;
var myGamePiece;
function startGame() {
myGamePiece = new component(0, "white", 5, 5);
// mySound=new sound("bounce.mp3");
myGameArea.start();
}
var myGameArea = {
canvas : document.createElement("canvas"),
start : function() {
this.canvas.width = 680;
this.canvas.height = 470;
this.canvas.style="border:10px solid #0000FF";
this.context = this.canvas.getContext("2d");
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
this.interval = setInterval(updateGameArea, 20);
},
stop : function() {
clearInterval(this.interval);
},
clear : function() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
}
}
function component(radij, color, x, y, type) {
this.type = type;
this.r = radij;
this.x = x;
this.y = y;
this.speedX = 2;
this.speedY = 0;
this.gravity = 0.1;
this.gravitySpeed = 0;
this.bounce = 0.98;
this.update = function() {
ctx = myGameArea.context;
//ctx.beginPath();
ctx.fillStyle = color;
//ctx.borderStyle="red";
//ctx.style.color="blue";
ctx.arc(this.x, this.y, this.r,0,2.1*Math.PI);
ctx.fill();
ctx.stroke()
}
this.newPos = function() {
this.gravitySpeed += this.gravity;
this.speedX=0.9995*this.speedX;
this.x += this.speedX;
this.y += this.speedY + this.gravitySpeed;
this.hitBottom();
}
this.hitBottom = function() {
var rockbottom = myGameArea.canvas.height - this.r;
var rob = myGameArea.canvas.width;
if ((this.y > rockbottom) || (this.y<0)) {
this.y=rockbottom;
// mySound.play();
this.gravitySpeed = -(this.gravitySpeed * this.bounce);
}
if ((this.x > rob-radij) || (this.x<5)) {
this.speedX=-this.speedX};
}
}
function updateGameArea() {
myGameArea.clear();
myGamePiece.newPos();
myGamePiece.update();
}
</script>
</body>
</html>
polmer večkotniku očrtanega kroga, 
pa število kotov. Kodo lahko vstavimo kakorkoli v telo LaTeXovega dokumenta, če smo le v njegovi preambuli navedli knjižnico 
. Poskusite.
tekem. Ker so na vsaki tekmi tri možnosti izida, je po osnovnem izreku kombinatorike 
vseh možnosti. A število različnih izidov je dosti manjše, saj moramo odšteti njihove permutacije (npr 0,9,6,3 da isti izid kot 9,6,3,0). Imamo kar zapleten kombinatoričen problem. Namesto da bi ga rešili matematično, raje napišimo program, ki bo simuliral število točk po vseh možnih izidih teh tekem. Najprej sestavimo niz vseh izidov, nato pa izide v njem sortiramo in različne prepišemo v novi niz. V Pythonu gre to skoraj tako kot v slovenščini.