- √ - Quadra in smartVISU

[2ndsky]

Hallo Leute,

bevor ich die Arbeit doppelt mach, hat schon jemand seine Quadra in der smartVISU? Wegen Windstärkemapping und -richtung vor allem.

[Robert]

Hi Nico!

Nein, leider noch nicht.

Was genau stellst du dir vor? Mapping von Windrichtung auf Text oder sogar verschiedene Bilder? Animierte Windrose mit JQueryMobile?

Bin gerne bereit zuzuarbeiten, wenngleich ich von CSS und JQueryMobile keinen Plan habe...

Grüße
Robert

[2ndsky]

Hallo Robert,

in erster Linie wollte ich eigentlich nur Texte, aber die Ideen von dir sind besser. Wenn sich da niemand mehr meldet der vielleicht doch schon was hat, werde ich da vielleicht mal ein Widget mit sowas bauen.

[Robert]

Als Idee? Auch mit Highcharts... Frag mich nicht wie man die Werte da rein bringt...

Edit this Fiddle - jsFiddle

Ist aber schon vielleicht wieder zu komplex...

[2ndsky]

Wow, das sieht interessant aus. Ist aber eher was für die spätere Auswertung. Momentan geht es mir eher darum, wie man die aktuellen Werte anständig visualisieren kann. Aber ich werde das im Auge behalten und mich bei Zeiten darum kümmern, historische Daten zu visualisieren.

[Robert]

Ja, hast du völlig recht - initial hatte ich nach sowas gesucht:

https://drupal.org/project/compass_rose
oder
https://github.com/jeffarrubla/Compass-Rose-jQuery

benutzen beide

https://code.google.com/p/jqueryrotate/

Vielleicht kann Apollo uns sagen, wie man dass dann dynamisch bekommt?

[panzaeron]

Ein Widget für die Quadra wäre cool, ich hatte mir das auch vorgenommen aber noch nicht realisiert. Ich würde auch erstmal die einfache Variante mit Texten realisieren (allerdings wollte ich das Mapping in linKNX umsetzen).

Aber zur Zeit bin ich im Garten beschäftigt, wenn der soweit fertig ist, dann kommt wieder die SmartVISU an die Reihe...

[Apollo]

Ich würde zustimmen: Der Highchart-Plot ist um ne Langzeitmessung zu machen.

Was man brächte, wäre doch eher was in der Größe eines Symbols oder?

Dann würde sich canvas oder svg anbieten um das dymanisch anzeigen zu lassen. (svg geht halt nicht auf allen [Android] Browsern).

Ich würde es wahrscheinlich erstmal mit canvas probieren.

Gruss

[Apollo]

Hab mal ein bischen gespielt: Ich glaub es wird ne svg basierte Lösung geben

Abwarten


Gruss

[2ndsky]

Quadra in smartVISU

Gibts schon einen Appetitanreger zu sehen?

[Apollo]

Ja .

Ist ein SVG - Bild, welches dynamsch angepasst wird. In diesem Fall dreht sich die Nadel kontinuierlich.

Damit sind nun auch SVGs in smartVISU möglich, die Ihr Aussehn verändern. Natürlich wird das auch an das jeweilige Layout farblich angepasst, genauso wie an die jeweilige Größe, ohne Qualitätsverlust.

Gefällts?

[2ndsky]

Quadra in smartVISU

SVGs an und für sich ja... diese Icons im Speziellen eher weniger. Liegt einfach daran, dass ich auf den ersten Blick nicht sagen kann, in welche Richtung der Wind weht. Aber vielleicht gehts auch nur mir so

[2ndsky]

Quadra in smartVISU

Btw: gibts eigentlich eine Möglichkeit, Wertebereiche zu mappen? Sowohl Text als auch Icons? Beispiel Windstärke: bei Werten zwischen 0 und 1 soll z.B. "schwacher Wind" stehen und eine hängende Windhose als Icon erscheinen usw.

[Apollo]

Hi Niko,

naja, möglich ist nun alles [ok, 3 € fürs Phrasenschwein]... Das Problem bei den "kleinen" Icons ist die Fläche, das passt nicht so unendlich viel drauf. Die Windrichtung ist halt an einen Kompass angelehnt, der "dicke" Pfeil zeigt nach in die Windrichtung, oben ist Norden...

Die Windsträke könnte man klar mit einer Windhose machen...

Ich werde im nächsten Update die SVG-Sachen einchecken, es sind nur ca. 5 Zeilen Code. Der Kompass z. B. nur:

    <svg id="{{ uid(page, id) }}" data-widget="icon.compass" data-item="{{ gad_angle }}" 
        class="icon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100">   
        <g>
            <polyline id="pin0" points="40,50, 50,15, 60,50" fill="#aaa" />
            <polyline id="pin1" points="40,50, 50,85, 60,50" fill="none" />
            <text x="25" y="35">N</text>
            <rect rx="20" x="3" y="3" width="94" height="94"/>
        </g>
    </svg> 

Also ein paar Linien.

Gruss

[2ndsky]

Quadra in smartVISU

Sieht einfach aus

Aber nochmal zur anderen Frage: gibt es die Möglichkeit etwas anzuzeigen (Text bzw. Icon) wenn sich der Itemwert in einer Range bewegt?