Halbmeter / Tachometer zeichnen (JavaScript Canvas oder Java Swing Beispiel benötigt) [geschlossen]

7

hat jemand ein Javascript Canvas oder Java Swing Beispiel?

In etwa so: Ссылка

Wie soll ich die "Trennlinien" zeichnen?

    
user547064 22.02.2011, 19:58
quelle

5 Antworten

27

Wenn Sie eine einfache, auf JavaScript-Canvas basierende Anzeige verwenden möchten, können Sie eine kleine Lib verwenden, die ich selbst erstellt habe. Es ist einfach zu bedienen und hat einen Wyswig-Konfigurator für die einfache Anpassung. Ich habe es auf den GitHub in Ссылка

geschoben

Eine kleine Vorschau dessen, was Sie bekommen können:

    
berni 13.07.2012 16:35
quelle
11

Ich empfehle, in die Raphael JavaScript-Grafikbibliothek zu schauen. Es funktioniert in allen Browsern (einschließlich der alten Versionen von IE!) Und verwendet Vektorgrafiken, so dass die erzeugten Grafiken skalierbar und drehbar sind, ohne die Bildqualität zu beeinträchtigen, und sogar Animationsfunktionen.

Hier ist ein Link zu einem Typen, der Raphael benutzt hat, um einige sehr gut aussehende Messgeräte zu produzieren: Ссылка

Aber wenn Sie Ihre eigenen zeichnen möchten, sollte es nicht schwer sein, Raffael zu benutzen: Es hat die Fähigkeit, Kreise und Formen zu zeichnen und sie zu animieren. Etwas, das wie dein Beispiel aussieht, sollte nicht schwer zu erreichen sein.

Hier ist ein Code, den ich schnell als Beispiel zusammengestellt habe:

%Vor%

Ich habe diesen Code getestet und er erzeugt ein funktionierendes Zifferblatt. Es ist nicht so schön wie, sagen wir, das andere Beispiel, das ich oben verlinkt habe, aber es verwendet keine externen Grafiken und es wird komplett mit Javascript gemacht. Die einzige externe Abhängigkeit ist die Raphael-Bibliothek.

Es wird offensichtlich einiges an Arbeit brauchen, um es für Ihr Szenario nutzbar zu machen, aber es sollte ein ziemlich guter Anfang für Sie sein.

Ich hoffe, das hilft.

[BEARBEITEN]

Das obige Skript funktioniert für Raphael v1.5. Raphael v2 ändert jedoch die Syntax leicht.

Die Zeile für die Animation muss die neue transform -Syntax verwenden und nicht die veraltete rotate -Syntax. So würde die bearbeitete Zeile wie folgt aussehen:

%Vor%

Der Rest des Codes bleibt derselbe wie oben.

Weitere Informationen zur Syntax der Funktion transform finden Sie im Raphael-Handbuch .

    
Spudley 12.04.2011 08:28
quelle
5

dieser Maßstab Lib ist gut und gut laufen

Ссылка

    
Nati Krisi 17.08.2013 11:33
quelle
3

Haben Sie diese Komponente Open Source Gauge gesehen? Es gibt ungefähr 10 verschiedene Stile, die Sie verwenden können.

    
Dutchie432 22.02.2011 20:10
quelle
1

Schau dir Swing für die Open Source SteelSeries an (entwickelt von Gerrit Grunwald, alias @hansolo) . Es enthält viele Arten von gut aussehenden Messgeräten (und andere lustige Komponenten).

    
kleopatra 28.08.2012 13:01
quelle

Tags und Links