PoD-BoT
Banned
- Registriert
- Feb. 2006
- Beiträge
- 598
Hallo Leute,
ich habe da ein kleines Projekt vor mir, bei dem Ihr mir ein wenig helfen könnntet...
und zwar will ich ein kleines Programm (Animation) schreiben, das auf Rechnern mit Minimalkonfiguration, bzw. langsamer Hardware läuft (z.B. 800-1000 MHz Single-Core-CPU). Das nur, weil das Programm in ein Hardware-Projekt übernommen wird, bei dem die Kosten möglichst gering ausfallen sollen.
Das Programm soll folgendermaßen aussehen:
Optional sollen über ein Menü "Szenen" ausgewählt werden können, die bestimmte Farbschemen enthalten. Außerdem sollte man das aktuelle Bild anhalten können.
Das Ganze sollte Plattform unabhängig sein, deshalb habe ich mal in HTML5 angefangen, was mir jedoch ziemlich hardwarehungrig zu sein scheint.
Mit dem Code habe ich bisher leider nur Bewegungen auf der X und Y-Achse hinbekommen, so wie ich ihn poste, sind es zehn standhafte Kreise auf zufälligen Positionen mit variabler Größe von bis zu 100 Pixeln.
Bräuchte erstmal ein Statement zur Realisierbarkeit und ob sich das alles plausibel anhört.
Bitte habt Verständnis mit mir, ich bin "nur" Systemintegrator
Danke im Voraus und Gruß,
Domi
ich habe da ein kleines Projekt vor mir, bei dem Ihr mir ein wenig helfen könnntet...
und zwar will ich ein kleines Programm (Animation) schreiben, das auf Rechnern mit Minimalkonfiguration, bzw. langsamer Hardware läuft (z.B. 800-1000 MHz Single-Core-CPU). Das nur, weil das Programm in ein Hardware-Projekt übernommen wird, bei dem die Kosten möglichst gering ausfallen sollen.
Das Programm soll folgendermaßen aussehen:
- Farbüberlauf im Hintergrund (zufällige Farben, aber passend)
- Diagonal und quer wechselnd (überlaufend)
---- - Kreise auf zufälligen Positionen
- die von ca. 5 auf ca. 200 Pixel wachsen
- und auf dem Weg zur 200 erblassen
- Kreise in passenden Farben zum Hintergrund
Optional sollen über ein Menü "Szenen" ausgewählt werden können, die bestimmte Farbschemen enthalten. Außerdem sollte man das aktuelle Bild anhalten können.
Das Ganze sollte Plattform unabhängig sein, deshalb habe ich mal in HTML5 angefangen, was mir jedoch ziemlich hardwarehungrig zu sein scheint.
Mit dem Code habe ich bisher leider nur Bewegungen auf der X und Y-Achse hinbekommen, so wie ich ihn poste, sind es zehn standhafte Kreise auf zufälligen Positionen mit variabler Größe von bis zu 100 Pixeln.
Bräuchte erstmal ein Statement zur Realisierbarkeit und ob sich das alles plausibel anhört.
Bitte habt Verständnis mit mir, ich bin "nur" Systemintegrator
Danke im Voraus und Gruß,
Domi
Code:
<!DOCTYPE HTML>
<title>Test 1</title>
<!--[if IE]><script type="text/javascript" src="excanvas.js"></script><![endif]-->
<body onload="init()">
<h1>Test 1</h1>
<canvas id="canv" class="output" width="720" height="1280" style="width:720px;height:1280px"></canvas>
<script>
var width = 720;
var height = 1280;
var y1 = 0;
var bflip = false;
var elt;
var context;
function Item(x,y,w,h,vy,c){
this.x = x;
this.y = y;
this.w = w;
this.h = h;
this.vy = vy;
this.c = c;
}
var items = new Array();
function init() {
elt = document.getElementById('canv');
context = elt.getContext('2d');
for (i = 0; i < 10; i++) {
x = Math.floor(Math.random()*(width+1));
y = Math.floor(Math.random()*(height+1));
w = Math.floor(Math.random()*100)+1;
h = Math.floor(Math.random()*51)+50;
vy = Math.floor(Math.random()*0)+0;
if (vy == 0) vy = 0;
// random color
c = "rgba(";
for (j = 0; j < 3; j++) {
v = Math.floor(Math.random()*230);
c += v + ",";
}
c += "0.6)";
it = new Item(x, y, w, h, vy, c);
items.push(it);
}
setInterval("draw();", 50);
}
function draw() {
// background
var g = context.createLinearGradient(0, 0, 0, height);
g.addColorStop(0, '#c0a');
g.addColorStop(1, '#ff0');
context.fillStyle = g;
context.fillRect(0, 0, width, height);
for (i in items) {
context.fillStyle = items[i].c;
context.beginPath();
context.arc(items[i].x,items[i].y,items[i].w,20,Math.PI*2,true);
context.fill();
items[i].y = items[i].y+items[i].vy;
if (items[i].y>height+items[i].w) items[i].y = -items[i].w;
else if (items[i].y<-items[i].w) items[i].y = height+items[i].w;
}
y1++;
if (y1>100) {
y1 = 0; // 0
bflip = !bflip;
}
}
</script>
