JavaScript - Ansteuerung eines Applets |
![]() ![]() ![]() ![]() ![]() |
Als kleines hübsches Beispiel soll hier noch die Darstellung kleiner Diagramme über ein Java-Applet herhalten.
Diese Seite wurde an Mozilla/Netscape, Konqueror und MSIE erfolgreich getestet. ![]() ![]() Querverweise zum Verständnis : [Einbindung in HTML] [Spezifikation Funktionen] [Objektreferenz applets] Im folgenden Quelltext sind wichtige Bereiche grün und Kommentare gelb markiert. |
![]() ![]() ![]() ![]() ![]() ![]() |
<html> <head> <title> JavaScript - Beispiel </title> <script type="text/javascript"> <!-- Script-Bereich einleiten --> <!-- /* HTML-Kommentar fuer Browser ohne JavaScript */ var diagramApp; // globale Variable fuer Applet-Objekt var initialized=0; // globale Variable: Applet bereits geladen? function waitForInit() // diese Funktion wartet, bis das Applet geladen wurde und veranlasst dann die Darstellung des Titelbildes { var initIt=1; // Objekt zum Applet ermitteln: diagramApp=document.getElementById("diagramApp"); // testen, ob wirklich Objekt: if (typeof(diagramApp)!="object") initIt=0; if (initIt) // testen, ob Methoden des Applets schon bekannt sind: if ((typeof(diagramApp.diagramInit)!="function")&&(typeof(diagramApp.diagramInit)!="object")) initIt=0; // wenn alles bereit: if (initIt) { // globale Variable setzen: initialized=1; // in 0.5s Titelbild erzeugen setTimeout("setze();",500); } // sonst else // nochmal 0.5s warten und dann weiter versuchen setTimeout("waitForInit();",500); } function setze() { if (!initialized) { alert("noch keine Verbindung zum Applet"); return; } diagramApp.diagramBGColor(230,230,230); // Hintergrundfarbe setzen diagramApp.diagramBorderColor(255,255,255); // Randfarbe setzen diagramApp.diagramFGColor(0,0,0); // Farbe für Trennlinie setzen diagramApp.diagramInit(20); // 20 Werte zulassen diagramApp.diagramAdd(30.5 ,192, 0, 0); // Wert: 30.5 , Farbe: mittelrot diagramApp.diagramAdd(28.3 ,192,192, 0); // Wert: 28.3 , Farbe: mittelgelb diagramApp.diagramAdd(17.1 , 0,192, 0); // Wert: 17.1 , Farbe: mittelgruen diagramApp.diagramAdd(10.3 , 0,192,192); // Wert: 10.3 , Farbe: mitteltuerkis diagramApp.diagramAdd(9.4 , 0, 0,192); // Wert: 9.4 , Farbe: mittelblau diagramApp.diagramAdd(5.0 ,192, 0,192); // Wert: 5.0 , Farbe: mittellila diagramApp.diagramAdd(-4.1 ,128, 0, 0); // Wert: -4.1 , Farbe: dunkelrot diagramApp.diagramAdd(-8.4 ,128,128, 0); // Wert: -8.4 , Farbe: dunkelgelb diagramApp.diagramAdd(-10.5 , 0,128, 0); // Wert: -10.5 , Farbe: dunkelgruen diagramApp.diagramAdd(-12.3 , 0,128,128); // Wert: -12.3 , Farbe: dunkeltuerkis diagramApp.diagramAdd(-20.9 , 0, 0,128); // Wert: -20.9 , Farbe: dunkelblau diagramApp.diagramAdd(-22.0 ,128, 0,128); // Wert: -22.0 , Farbe: dunkellila diagramApp.diagramHorzBars(); // als horizontale Balken darstellen } //--> <!-- HTML-Kommentarende --> </script> <!-- Script-Bereich beenden --> </head> <body onLoad="waitForInit();"> <a href="diagram.html">Erklärung</a> <!-- Link zurueck auf diagram.html --> <br> <br> <!-- Diagramm-Applet: --> <applet code="diagram" id="diagramApp" name="diagramApp" alt="your browser cannot show java applets" width="260" height="260" hspace="10" vspace="10" > </applet> <br> <br> <form> <!-- Diagramm neu setzen: --> <input type=button value="Ausgangszustand" onClick="setze();"> <br> <!-- Diagramm als horizontale Balken darstellen: --> <input type=button value="HorzBars" onClick="diagramApp.diagramHorzBars();"> <!-- Diagramm als vertikale Balken darstellen: --> <input type=button value="VertBars" onClick="diagramApp.diagramVertBars();"> <!-- Diagramm als im Kreis angeordnete Balken darstellen: --> <input type=button value="CircleBars" onClick="diagramApp.diagramCircleBars();"> <br> <!-- Absolutwerte-Diagramm als einen horizontalen Balken darstellen: --> <input type=button value="HorzAbs" onClick="diagramApp.diagramHorzAbs();"> <!-- Absolutwerte-Diagramm als einen vertikalen Balken darstellen: --> <input type=button value="VertAbs" onClick="diagramApp.diagramVertAbs();"> <!-- Absolutwerte-Diagramm als einen kreisförmigen Balken darstellen: --> <input type=button value="CircleAbs" onClick="diagramApp.diagramCircleAbs();"> </form> <br> </body> </html> |
![]() ![]() ![]() ![]() ![]() |
Autor: Ulrich Kritzner |