lollypop

<style>
body {cursor:"crosshair"; color:#00FF00; background-color:#000000;}
</style>
<script>

	var npunkt = new Array();
function dreh_x(punkt,winkel)
{
	if(winkel!=0)
	{
	var z = punkt["z"];
	var y = punkt["y"];
	var Z= Math.cos(Math.atan2(y,z)+winkel)*Math.sqrt(y*y+z*z);
	var Y= Math.sin(Math.atan2(y,z)+winkel)*Math.sqrt(y*y+z*z);
	npunkt["x"] = punkt["x"];
	npunkt["y"] = Y;
	npunkt["z"] = Z;
	return(npunkt);
	}else
	{
	return(punkt)
	}
}

function dreh_y(punkt,winkel)
{
	if(winkel!=0)
	{
	var z = punkt["z"];
	var x = punkt["x"];
	var Z= Math.cos(Math.atan2(x,z)+winkel)*Math.sqrt(x*x+z*z);
	var X= Math.sin(Math.atan2(x,z)+winkel)*Math.sqrt(x*x+z*z);
	npunkt["x"] = X;
	npunkt["y"] = punkt["y"];
	npunkt["z"] = Z;
	return(npunkt);
	}else
	{
	return(punkt)
	}
}

function dreh_z(punkt,winkel)
{
	if(winkel!=0)
	{
	var x = punkt["x"];
	var y = punkt["y"];
	var X= Math.cos(Math.atan2(y,x)+winkel)*Math.sqrt(x*x+y*y);
	var Y= Math.sin(Math.atan2(y,x)+winkel)*Math.sqrt(x*x+y*y);
	npunkt["x"] = X
	npunkt["y"] = Y
	npunkt["z"] = punkt["z"];
	return(npunkt);
	}else
	{
	return(punkt)
	}
}

function drehen(punkt,x,y,z)
{
	npunkt = dreh_x(punkt,x);
	npunkt = dreh_y(npunkt,y);
	npunkt = dreh_z(npunkt,z);
	npunkt["name"] = punkt["name"];
	alle_punkte[punkt["stelle"]]["x"] = npunkt["x"];
	alle_punkte[punkt["stelle"]]["y"] = npunkt["y"];
	alle_punkte[punkt["stelle"]]["z"] = npunkt["z"];
	alle_punkte[punkt["stelle"]]["name"] = npunkt["name"];
}

	var alle_punkte = new Array();
function neuer_punkt(x,y,z)
{
	var neu = alle_punkte.length;
	alle_punkte[neu] = new Array();
	alle_punkte[neu]["x"]=x;
	alle_punkte[neu]["y"]=y;
	alle_punkte[neu]["z"]=z;
	alle_punkte[neu]["stelle"]=neu;		//stelle im array -> wichtig zu werte-zurückschreiben
	alle_punkte[neu]["name"]="p" + neu;
	document.all["inhalt"].innerHTML += "<span id='p"+neu+"' class='p"+neu+"'>"+symbol+"</span>";
	document.all["p"+neu].style.position  = "absolute";
	darstellen(alle_punkte[neu]);
	document.all["zahl"].innerHTML = alle_punkte.length;
}

function wuerfel()
{
	neuer_punkt(0,0,0);
	neuer_punkt(5000,5000,5000);
	neuer_punkt(0,5000,5000);
	neuer_punkt(5000,0,5000);
	neuer_punkt(-5000,-5000,5000);
	neuer_punkt(-5000,0,5000);
	neuer_punkt(0,-5000,5000);
	neuer_punkt(-5000,5000,5000);
	neuer_punkt(5000,-5000,5000);
	neuer_punkt(5000,5000,0);
	neuer_punkt(-5000,-5000,0);
	neuer_punkt(-5000,5000,0);
	neuer_punkt(5000,-5000,0);
	neuer_punkt(5000,5000,-5000);
	neuer_punkt(0,5000,-5000);
	neuer_punkt(5000,0,-5000);
	neuer_punkt(-5000,-5000,-5000);
	neuer_punkt(-5000,0,-5000);
	neuer_punkt(0,-5000,-5000);
	neuer_punkt(-5000,5000,-5000);
	neuer_punkt(5000,-5000,-5000);
}

function wuerfel2()
{
	neuer_punkt(0,0,0);
	neuer_punkt(5,5,5);
	neuer_punkt(0,5,5);
	neuer_punkt(5,0,5);
	neuer_punkt(-5,-5,5);
	neuer_punkt(-5,0,5);
	neuer_punkt(0,-5,5);
	neuer_punkt(-5,5,5);
	neuer_punkt(5,-5,5);
	neuer_punkt(5,5,0);
	neuer_punkt(-5,-5,0);
	neuer_punkt(-5,5,0);
	neuer_punkt(5,-5,0);
	neuer_punkt(5,5,-5);
	neuer_punkt(0,5,-5);
	neuer_punkt(5,0,-5);
	neuer_punkt(-5,-5,-5);
	neuer_punkt(-5,0,-5);
	neuer_punkt(0,-5,-5);
	neuer_punkt(-5,5,-5);
	neuer_punkt(5,-5,-5);
}

function kreuz()
{
	neuer_punkt(0,0,0);
	neuer_punkt(0,0,10);
	neuer_punkt(0,0,20);
	neuer_punkt(0,0,30);
	neuer_punkt(0,0,40);
	neuer_punkt(0,0,-10);
	neuer_punkt(0,0,-20);
	neuer_punkt(0,0,-30);
	neuer_punkt(0,0,-40);
	neuer_punkt(0,0,-50);
	neuer_punkt(0,0,50);
	neuer_punkt(0,-50,0);
	neuer_punkt(0,50,0);
	neuer_punkt(-50,0,0);
	neuer_punkt(50,0,0);
	neuer_punkt(0,10,0);
	neuer_punkt(0,20,0);
	neuer_punkt(0,30,0);
	neuer_punkt(0,40,0);
	neuer_punkt(0,-10,0);
	neuer_punkt(0,-20,0);
	neuer_punkt(0,-30,0);
	neuer_punkt(0,-40,0);
	neuer_punkt(10,0,0);
	neuer_punkt(20,0,0);
	neuer_punkt(30,0,0);
	neuer_punkt(40,0,0);
	neuer_punkt(-10,0,0);
	neuer_punkt(-20,0,0);
	neuer_punkt(-30,0,0);
	neuer_punkt(-40,0,0);
}

function kugel(n,radius)
{
	var N=n;
	var M=0;
		neuer_punkt(0,0,0);
	while(N>=0)
	{
		neuer_punkt(Math.sin(M)*radius*Math.sin(Math.PI*N/n),Math.cos(M)*radius*Math.sin(Math.PI*N/n),Math.cos(Math.PI*N/n)*radius);
		N--;
		M+=0.5;
	}
}

var h=0.5;
var v=0.5;

function darstellen(punkt)		//schräge parallelperspektive
{
	document.all[punkt["name"]].style.pixelLeft = punkt["x"] - h*punkt["z"] + rx;
	document.all[punkt["name"]].style.pixelTop  = punkt["y"] + v*punkt["z"] + ry;
	document.all[punkt["name"]].style.fontSize = Math.abs(20 + punkt["z"]/4);
}

function alle_neu_ausrichten()
{
	var nummer = alle_punkte.length - 1;
	while(nummer>=0)
	{
		darstellen(alle_punkte[nummer]);
		nummer--;
	}
}

function alle_drehen(wx,wy,wz)
{
	var nummer = alle_punkte.length - 1;
	while(nummer>=0)
	{
		drehen(alle_punkte[nummer],wx,wy,wz);
		nummer--;
	}
	alle_neu_ausrichten();
}

var bx=0.05,by=-0.05,Timer;
function beweg_dich()
{
	alle_drehen(bx,by,bz);
	timer1 = setTimeout("beweg_dich()",2);
	var Timer="true"
}

function erfasse()
{
	var mausx = window.event.offsetX;
	var mausy = window.event.offsetY;
	by = Math.round(0.15*Math.sin(Math.atan2(mausx-rx,ry))*100)/100;
	bx = Math.round(0.15*Math.cos(Math.atan2(rx,mausy-ry))*100)/100;
}

function zuruecksetzen()
{
	if(Timer)
	{
		clearTimeout(timer1);
		Timer=false;
	}
	alle_punkte = new Array();
	document.all["inhalt"].innerHTML="|";
	document.all["zahl"].innerHTML = "0";
}

function loadme()
{
beweg_dich();
wuerfel();

}

//Hier der Punkt(0,0,0) des Koordinatensytems relativ zur Seite!
var rx = 800;
var ry = 600;
var bz = 0.15; //Rotation um die Z-Achse (max. 0.15)
var symbol="*";
</script>
</head>
<body onmousemove="erfasse();" onload="loadme();">

<div id="inhalt"></div>

<form>
<input type=button value="kreuz();" onclick="kreuz();"><br>
<input type=button value="wuerfel();" onclick="wuerfel();"><br>
<input type=button value="kugel(n,radius);" onclick="kugel(500,70);"><br>
<input type=button value="zurücksetzen();" onclick="zuruecksetzen();"></form>
Es sind <span id="zahl">0</span> Punkte dargestellt.