Dieses Objekt ist die Superklasse der Fensterobjekte für eine analoge Messvorrichtung und für ein Balkendiagramm. Es stellt die gesamten Funktionen für diese beiden Fensterobjekte bereit, wozu das Zeichnen der Basisoberfläche, die Handhabung der meisten Mausereignisse und vieles andere mehr gehört. Folgende allgemeine Variablen und Funktionen sind verfügbar:
Objektvariablen | ||
---|---|---|
Number | gaugeWidth | Die Breite der auf der Seite zu erstellenden Oberfläche (in Pixeln) |
Number | gaugeHeight | Die Höhe der auf der Seite zu erstellenden Oberfläche (in Pixeln) |
String|Object | gaugeBackground | Die Farbe für den Hintergrund der Messvorrichtung. In der Regel handelt es sich um eine CSS-Farbe wie #e0e0e0. Verwenden Sie diese Farbe für das Flächenfüllungsobjekt. Sehen Sie sich hierzu das Beispiel an. |
Number | gaugeMin | Der von der Messvorrichtung anzuzeigende Mindestwert |
Number | gaugeMax | Der von der Messvorrichtung anzuzeigende Maximalwert |
String | image | Ein URL, der als Hintergrund für die Messvorrichtung verwendet werden soll |
Number | imageX | Die x-Position für die Positionierung des Bildes. Der Standardwert ist 0 und bezeichnet die untere linke Ecke. |
Number | imageY | Die y-Position für die Positionierung des Bildes. Der Standardwert ist 0 und bezeichnet die untere linke Ecke. |
Number | imageWidth | Die Breite des angegebenen Bildes. Wenn ein Bild verwendet wird, müssen Sie diesen Wert angeben, damit das Bild angezeigt wird. |
Number | imageHeight | Die Höhe des angegebenen Bildes. Wenn ein Bild verwendet wird, müssen Sie diesen Wert angeben, damit das Bild angezeigt wird. |
Boolean | imageOverlay | Gibt an, ob das zuvor angegebene Bild vor dem Hintergrund eingeblendet werden soll |
Number | useRangeStyles | Gibt an, dass die Bereichsfarben im CSS-Stil angegeben werden sollen |
Boolean | hideValues | Gibt an, ob die Textfelder unter der Messvorrichtung verdeckt und die Anzeigewerte sichtbar sein sollen |
In der Markup kann diese Variable nur deklarativ als Zeichenfolge gesetzt werden. In der Regel handelt es sich um eine CSS-Farbzeichenfolge wie gray oder #e0e0e0. In JavaScript können Sie die Variable "gaugeBackground" jedoch gemäß der Definition für Füllobjekte "dojox.gfx" auf ein Füllobjekt setzen. Das lineare Füllobjekt erwartet folgende Bedingungen:
{ type: "linear", x1: 0, // x-Position für Beginn der ersten Farbe y1: 0, // y-Position für Beginn der ersten Farbe x2: 100, // x-Position für Ende der zweiten Farbe y2: 100, // y-Position für Ende der zweiten Farbe colors: [{offset: 0, color: "black"}, // erste Farbe {offset: 1, color: "white"}] // zweite Farbe }Wenn Sie für die Messvorrichtung einen Verlauf von grau nach weiß definieren möchten, der vom Ende der Messvorrichtung bis zum Anfang der Vorrichtung reicht, müssen Sie folgenden Code eingeben:
var gauge = dijit.byId("testGauge"); var fill = new Object(); fill.type = "linear"; fill.x1 = 0; fill.x2 = 0; fill.y2 = 0; fill.y1 = gauge.gaugeHeight; fill.colors = [{offset: 0, color: "#ECECEC"}, {offset: 1, color: "white"}]; gauge.gaugeBackground = fill;
Der Standardwert dieser Variablen ist 0 und gibt an, dass integrierte Bereichsfarben verwendet werden. Ist die Variable auf einen Wert größer als 0 gesetzt, wird für die Darstellung der Farbbereiche jedoch die entsprechende Anzahl CSS-Klassen ibmGaugeRange1, ibmGaugeRange2 usw. verwendet. Dieses Feature funktioniert nicht im Internet Explorer. Die CSS-Klasse hat Eigenschaften wie die im folgenden Beispiel angegebenen:
.ibmGaugeRange1 { fill: #808080 ; stroke: #808080 ; }Wie Sie sehen, sind dies SVG-Darstellungen (skalierbare Vektorgrafiken) und keine HTML-Darstellungen. Attribute wie "background-color" haben keinen Effekt.
Die Variable "hideValues" ist standardmäßig auf false gesetzt, so dass für jeden zur Messvorrichtung hinzugefügten Anzeiger unter der Oberfläche ein Textfeld mit dem Wert dieses Anzeigers erscheint. Dieses Feature wirkt sich auf die Zugänglichkeit aus. Ist diese Variable auf true gesetzt, kann unter Umständen nicht auf die Messvorrichtung zugegriffen werden. Die Entscheidung über den Wert dieser Variable ist wichtig, denn einige Leseeinheiten sind möglicherweise nicht in der Lage, auf den Wert der Messvorrichtungen zuzugreifen, wenn diese Textfelder inaktiviert sind.
Objektfunktionen | |
---|---|
void | addRange(Object range) Fügt diesem Gauge-Fensterobjekt einen Bereich hinzu |
void | addRanges(Array ranges) Fügt der Messvorrichtung eine Sammlung von Bereichsobjekten hinzu |
void | moveIndicatorToFront(Object indicator) Verschiebt den angegebenen Anzeiger an den Anfang der Messvorrichtung |
void | drawText(String txt, Number x, Number y, String align, String vAlign) Schreibt Text auf die Messvorrichtung |
void | removeText(String t) Entfernt den angegebenen Text von der Messvorrichtung |
void | updateTooltip(String text) Aktualisiert die Kurzinfo zur Messvorrichtung mit dem angegebenen Text |
void | handleMouseOver(Object event) Mausunterstützung |
void | handleMouseOut(Object event) Mausunterstützung |
void | handleMouseDown(Object event) Mausunterstützung |
void | handleMouseUp(Object event) Mausunterstützung |
void | handleMouseMove(Object event) Mausunterstützung |
Funktionsdetails |
---|
var gauge = new ibm_gauge.widget.AnalogGauge(); gauge.addRange({low:10, high:20, hover:'10 - 20'});
var gauge = new ibm_gauge.widget.AnalogGauge({}); gauge.addRanges([{low:10, high:20, hover:'10 - 20'},{low:20, high:30, hover:'20 - 30'}]);
var gauge = new ibm_gauge.widget.AnalogGauge({}); gauge.drawText("Sample text", 100, 50, 'right');
var gauge = new ibm_gauge.widget.AnalogGauge({}); gauge.drawText("Sample text", 100, 50, 'right'); gauge.removeText("Sample text");
var gauge = new ibm_gauge.widget.AnalogGauge({}); gauge.updateTooltip("Text für Tooltip!");
Die folgenden Fensterobjekte (Bereich, Verlauf, Farbverlauf und Anzeiger) werden hauptsächlich für die deklarative Erstellung einer Messvorrichtung in Markup oder an Stelle eines anonymen Objekts für die übrigen Funktionen der Messvorrichtung verwendet.
Objektvariablen | ||
---|---|---|
Number | low | Der untere Wert oder Mindestwert dieses Bereichs |
Number | high | Der obere Wert oder Maximalwert dieses Bereichs |
String | hover | Der Text, der in der Kurzinfo angezeigt werden soll, wenn der Mauszeiger auf diesen Bereich bewegt wird |
String|Object | color | Die Farbe dieses Bereichs. Es kann sich auch um ein ibm_gauge.widget.Gradient-Objekt handeln. |
Number | size | Gibt für eine runde Messvorrichtung wie AnalogGauge die Größe des Kreisbogens an |
Objektvariablen | ||
---|---|---|
String | type | Siehe Verlaufstyp. Verfügbare Typen finden Sie in dojox.gfx.*. |
Number | x1 | Die x-Koordinate der Position, an der vorwiegend die erste Farbe verwendet wird |
Number | x2 | Die x-Koordinate der Position, an der vorwiegend die zweite Farbe verwendet wird |
Number | y1 | Die y-Koordinate der Position, an der vorwiegend die erste Farbe verwendet wird |
Number | y2 | Die y-Koordinate der Position, an der vorwiegend die zweite Farbe verwendet wird |
Array | colors | Die beiden für diesen Verlauf verwendeten Farben. In der Regel handelt es sich bei den Farben um ein Objekt ibm_gauge.widget.GradientColor oder ein anonymes Objekt mit vergleichbaren Eigenschaften. |
Objektfunktionen | |
---|---|
Object | getFillObject() Ruft dieses Fensterobjekt als anonymes Flächenfüllungsobjekt ab |
Funktionsdetails |
---|
Objektvariablen | ||
---|---|---|
Number | offset | Die relative Position dieser Farbe. Der Wert ist 0 oder 1. |
String | color | Die zu verwendende Farbe. In der Regel handelt es sich um eine CSS-Farbe wie weiß oder #000000. |
Objektfunktionen | |
---|---|
Object | getColorObject() Ruft dieses Fensterobjekt als anonymes Farbobjekt ab |
Funktionsdetails |
---|
Objektvariablen | ||
---|---|---|
Number | value | Der von diesem Anzeiger repräsentierte Wert der Messvorrichtung |
String | type | Der Typ des Anzeigers. Mögliche Beispielwerte sind line, arrow und bar. Die gültigen Werte hängen vom Typ der jeweiligen Messvorrichtung ab. |
String | color | Die Farbe dieses Anzeigers. Im Allgemeinen handelt es sich um eine CSS-Farbangabe. |
String | label | Die Bezeichnung für diesen Anzeiger |
Number | length | Die Länge des Anzeigers |
Number | width | Die Breite oder Dicke des Anzeigers |
Number | offset | Die relative Position des Anzeigers |
String | hover | Der Text, der in der Kurzinfo angezeigt werden soll, wenn der Mauszeiger auf diesen Anzeiger bewegt wird |
String|Function | onDragMove | Die Funktion, die aufgerufen werden soll, wenn der Anzeiger mit der Maus verschoben wird. Dieser Wert kann ein Funktionsname oder die Funktion selbst sein. |
Das analoge Gauge-Fensterobjekt ist eine Grafik mit einer runden Messvorrichtung für die Anzeige numerischer Werte. Sie ist mit einem Tachometer oder einem Druckmesser vergleichbar. Diese Messvorrichtung kann beliebige Werte für den Anfangs- und Endwinkel haben, solange diese eine Kreisform (Vollkreis, Halbkreis und Kreisbögen) ergeben. Die analoge Messvorrichtung erweitert die Superklasse _Gauge und übernimmt alle Variablen, Eigenschaften und Funktionen dieser Superklasse.
Objektvariablen | ||
---|---|---|
Number | gaugeWidth | Überschreibt die _Gauge-Eigenschaft mit demselben Namen. Diese Variable gibt die Breite der Messvorrichtung an und legt 300 Pixel als Standardwert fest. |
Number | gaugeHeight | Überschreibt die _Gauge-Eigenschaft mit demselben Namen. Diese Variable gibt die Höhe der Messvorrichtung an und legt 200 Pixel als Standardwert fest. |
Number | cx | Die x-Koordinate für den Mittelpunkt der Messvorrichtung innerhalb des beschriebenen Oberflächenbereichs. Der Standardwert ist gaugeWidth/2. |
Number | cy | Die y-Koordinate für den Mittelpunkt der Messvorrichtung innerhalb des beschriebenen Oberflächenbereichs. Der Standardwert ist gaugeHeight/2. |
Number | radius | Der Radius der Messvorrichtung. Der Standardwert ist der niedrigste der beiden Werte cx-25 und cy-25. |
Number | startAngle | Gibt den Anfangswinkel der Messvorrichtung in Grad an. Der Standardwert ist -90. |
Number | endAngle | Gibt den Endwinkel der Messvorrichtung in Grad an. Der Standardwert ist 90. |
Objektfunktionen | |
---|---|
void | addIndicator(Object indicator) Fügt den angegebenen Anzeiger zu dieser Messvorrichtung hinzu |
Number | getAngle(Number value) Gibt den Winkel an, der einem angegebenen numerischen Wert auf der Messvorrichtung entspricht |
Number | getValueForAngle(Number angle) Gibt den Wert an, dem ein angegebener Winkel entspricht |
Number | getRadians(Number angle) Konvertiert die Gradangabe in ein Bogenmaß |
Number | getDegrees(Number radians) Konvertiert das Bogenmaß in eine Gradangabe |
void | draw() Zeichnet die Messvorrichtung (neu) |
void | drawRange(Object range) Zeichnet den angegebenen Bereich dieser Messvorrichtung |
void | drawIndicator(Object indicator) Zeichnet den angegebenen Anzeiger für diese Messvorrichtung |
void | moveIndicator(Object indicator) Verschiebt den angegebenen Anzeiger in dieser Messvorrichtung |
Object | getRangeUnderMouse(Object event) Bestimmt den Bereich, in dem sich gegenwärtig der Mauszeiger befindet |
Funktionsdetails |
---|
Das Fensterobjekt für ein Balkendiagramm stellt eine grafische Darstellung numerischer Daten in Form eines horizontalen Balkens in einer Spalte bereit. Das Balkendiagramm kann in derselben Spalte beliebig viele horizontale Balken enthalten sowie Zielangaben und Teilstriche. Das Fensterobjekt für ein Balkendiagramm erweitert die Superklasse _Gauge und übernimmt alle Variablen, Eigenschaften und Funktionen dieser Superklasse.
Objektvariablen | ||
---|---|---|
Number | gaugeWidth | Überschreibt die _Gauge-Eigenschaft mit demselben Namen. Diese Variable gibt die Breite der Messvorrichtung an und legt 250 Pixel als Standardwert fest. |
Number | gaugeHeight | Überschreibt die _Gauge-Eigenschaft mit demselben Namen. Diese Variable gibt die Höhe der Messvorrichtung an und legt 35 Pixel als Standardwert fest. |
Number | dataX | Die x-Koordinate für den Anfang des Datenbereichs in Pixeln. Der Standardwert ist 5. |
Number | dataY | Die y-Koordinate für den Anfang des Datenbereichs in Pixeln. Der Standardwert ist 5. |
Number | dataWidth | Breite des Datenbereichs in Pixeln. Der Standardwert ist gaugeWidth-10. |
Number | dataHeight | Höhe des Datenbereichs in Pixeln. Der Standardwert ist gaugeHeight-10. |
Objektfunktionen | |
---|---|
void | addIndicator(Object indicator) Fügt den angegebenen Anzeiger zu diesem Balkendiagramm hinzu |
Number | getPosition(Number value) Ruft die Koordinatenposition für einen angegebenen Wert ab |
Number | getValueForPosition(Number position) Ruft den Wert für die angegebene Koordinatenposition ab |
void | draw() Zeichnet das Balkendiagramm (neu) |
void | drawRange(Object range) Zeichnet den angegebenen Bereich dieses Balkendiagramms |
void | drawIndicator(Object indicator) Zeichnet den angegebenen Anzeiger für dieses Balkendiagramm |
void | moveIndicator(Object indicator) Verschiebt den angegebenen Anzeiger in diesem Balkendiagramm |
void | resizeIndicator(Object indicator) Verändert die Größe des angegebenen Anzeigers in diesem Balkendiagramm |
Object | getRangeUnderMouse(Object event) Bestimmt den Bereich, in dem sich der Mauszeiger befindet |
Funktionsdetails |
---|