Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [gelöst]Richtungsanzeige in Landkarte, wie mache ich das ?

    NEWS

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    • Save The Date: ioBroker@Smart Living Forum Solingen, 14.06.

    [gelöst]Richtungsanzeige in Landkarte, wie mache ich das ?

    This topic has been deleted. Only users with topic management privileges can see it.
    • W
      WillyIobrok @Glasfaser last edited by WillyIobrok

      @glasfaser
      Die Nadel im Bild wurde von mir selbst gemacht. Da bastel ich gerade dran rum... (sorry für die Verwirrung!)

      Ich habe auch die Kompassnadel von dir genommen, da sieht das Bild schöner aus:

      Karte2.png

      Das ist auch nicht das Problem ...

      Aber in beiden Fällen reagiert das Bild nicht auf "rotate({mqtt.0.curAntDir}deg)" die Nadel bleibt immer senkrecht.

      mit z.B. "rotate(20deg)" gehts so wie gewünscht ...
      jetzt suche ich nach einer Übersetzungsmöglichkeit von ASCII String auf Zahl an dieser Stelle ...

      ich hoffe doch, daß meine Interpretation der Variable "mqtt.0.curAntDir" richtig ist ...
      objects.png

      Glasfaser 1 Reply Last reply Reply Quote 0
      • Glasfaser
        Glasfaser @WillyIobrok last edited by Glasfaser

        @willyiobrok

        du kannst es so machen :

        1.JPG

        dein Datenpunkt mqtt.0.curAntDir kommt oben im Trigger Baustein und im Block nach Zahl ausgewählt rein .

        Für Steuer nimmst du einen eigenen Datenpunkt Zahl und diesen erzeugten Datetenpunkt trägts du dann im Widget ein .

        W 1 Reply Last reply Reply Quote 0
        • W
          WillyIobrok @Glasfaser last edited by

          @glasfaser
          Ok, müsste ich mir mal anschauen ... aber mit blockly hatte ich bis jetzt noch gar nix zu tun, da würde ich jetzt nochmal ein neues Fass aufmachen ...
          Ich komme eher von der Firmware-Seite C, C++ auf Microcontrollern und hatte eher sowas wie "atoi" o.Ä. im Sinn... ☺

          Glasfaser 1 Reply Last reply Reply Quote 0
          • Glasfaser
            Glasfaser @WillyIobrok last edited by

            @willyiobrok

            probiere mal , gehe mal in die Objekte und ändere es auf Zahl bei mqtt.0.curAntDir

            Beispiel :

            1.JPG
            2.JPG

            W 1 Reply Last reply Reply Quote 0
            • W
              WillyIobrok @Glasfaser last edited by

              @glasfaser
              so, habe die Änderung gemacht, gleiches Verhalten wie vorher - aber:

              Ich bin auf einen wirklich dämlichen Fehler meinerseits gestossen 😠 😊 :

              Im vis Editor tut sich nix, aber in der vis - Runtime funktionierts - auch wenn die Variable ein String ist 🙄

              -> alles gut - jetzt funktionierts ! 👍

              Zwar noch nicht schön, aber die Feinheiten kriege ich jetzt hoffentlich schon hin !
              Vielen Dank nochmal für die Hilfe !

              Willyiobrok

              Glasfaser 1 Reply Last reply Reply Quote 0
              • Glasfaser
                Glasfaser @WillyIobrok last edited by

                @willyiobrok sagte in Richtungsanzeige in Landkarte, wie mache ich das ?:

                -> alles gut - jetzt funktionierts !

                Freut mich , das es jetzt funktioniert 🙂

                Zwar noch nicht schön,

                Kann ich dir noch helfen !?

                W 1 Reply Last reply Reply Quote 0
                • W
                  WillyIobrok @Glasfaser last edited by

                  @glasfaser said in Richtungsanzeige in Landkarte, wie mache ich das ?:

                  Zwar noch nicht schön

                  Kann ich dir noch helfen !?

                  Ja, vielleicht schon.
                  Das sind die Schönheitssachen, die ich noch angehen will:

                  • im Safari- Browser auf dem iPad pulst die Kompassnadel im 1/2 sek Takt - zwar nicht stark aber doch sichtbar. Im Windows-Browser(Edge) sieht man davon nix, da ist alles gut.
                    Ich will aber sowieso ein anderes Design ... mal schauen wie‘s dann aussieht, wenn ich mein eigenes Bild von der Kompassnadel fertig habe.
                  • im Compas Widget dreht sich die Nadel „smooth“, also gedämpfte Bewegungen. In diesem Widget „ruckt“ die Nadel bei Bewegung ... naja, es gibt schlimmeres, zugegeben...😉🙄
                    Wenn ich das nicht ändern kann machts auch nix.

                  Ich bin jetzt das Wochenende nicht bei meinem iobroker, kann deshalb erst am Montag weiterbasteln - ich melde mich dann wieder. 👋

                  Willyiobrok

                  Glasfaser 1 Reply Last reply Reply Quote 0
                  • Glasfaser
                    Glasfaser @WillyIobrok last edited by

                    @willyiobrok sagte in Richtungsanzeige in Landkarte, wie mache ich das ?:

                    im Compas Widget dreht sich die Nadel „smooth“,

                    Ich habe das Compas Widget für dich mal geändert , dein Datenpunkt mqtt.0.curAntDir habe ich schon eingetragen .

                    Der Hindergrund ist transparent und die Nadel ist größer .

                    Du kannst es auch selber dann noch weiter anpassen .
                    .

                    [{"tpl":"tplCGCompas","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","minValue":"0","maxValue":"360","factor":"1","valueOffset":"0","hCount":"1","majorTicks":"N,NE,E,SE,S,SW,W,NW,N","minorTicks":"22","strokeTicks":"false","animation":"true","animationDuration":"1000","colorPlate":"transparent","colorMajorTicks":"transparent","colorMinorTicks":"transparent","colorNumbers":"transparent","colorNeedle":"rgba(240,128,128,1)","colorNeedleEnd":"rgba(255,160,122,.9)","colorBorderOuter":"transparent","colorBorderOuterEnd":"transparent","colorNeedleShadowDown":"transparent","needleType":"arrow","needleStart":"75","needleEnd":"90","needleWidth":"4","borders":true,"borderOuterWidth":"2","borderMiddleWidth":"0","borderInnerWidth":"0","borderShadowWidth":"0","valueBox":"false","valueTextShadow":"false","ticksAngle":"360","startAngle":"180","colorNeedleCircleOuter":"#ccc","needleCircleSize":"5","needleCircleOuter":true,"signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"oid":"mqtt.0.curAntDir","units":"","title":"","needle":true,"needleShadow":false,"valueBoxStroke":"0","valueInt":"0","animationRule":"debounce","lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"needleCircleInner":false},"style":{"left":"372px","top":"23px","width":"632px","height":"559px","z-index":"10","font-family":"Jura-DemiBold","font-size":"xx-small"},"widgetSet":"canvas-gauges"}]
                    


                    .
                    Unbenannt.JPG

                    W 2 Replies Last reply Reply Quote 0
                    • W
                      WillyIobrok @Glasfaser last edited by

                      @glasfaser
                      👍👍👍
                      Wow, super, das ist ein Service!😊
                      Wenn ich wieder an meinen iobroker rankomme werde ich‘s gleich ausprobieren😁

                      1 Reply Last reply Reply Quote 0
                      • W
                        WillyIobrok @Glasfaser last edited by WillyIobrok

                        @glasfaser
                        super, hat alles auf Anhieb geklappt. Jetzt habe ich das, was ich wollte. 😊

                        Vielen Dank !!!

                        Willyiobrok

                        Glasfaser 1 Reply Last reply Reply Quote 1
                        • Glasfaser
                          Glasfaser @WillyIobrok last edited by

                          @willyiobrok sagte in Richtungsanzeige in Landkarte, wie mache ich das ?:

                          Jetzt habe ich das, was ich wollte. ......
                          Vielen Dank !!

                          Kein Problem ...freut mich das es jetzt paßt 😉

                          W 1 Reply Last reply Reply Quote 0
                          • W
                            WillyIobrok @Glasfaser last edited by

                            Falls es jemanden interessiert - so sieht's jetzt im Moment (immer noch "Baustelle") aus:

                            Bild.png

                            Rechts daneben kommt noch eine Europa und/oder Deutschlandkarte und ein Fenster mit der Richtung in Grad hin, dann wird die Seite auf dem iPad hoffentlich noch etwas besser aussehen.

                            1 Reply Last reply Reply Quote 1
                            • S
                              stefu87_CH last edited by

                              Hallo

                              Ich wollte mir jetzt auch die Windrose einfügen bei mir, aber es passiert bei mir nichts, obwohl ich den Pfad angepasst habe bei mir:

                              714e3cac-bf8e-4be3-94fd-cbd6a2c087eb-grafik.png

                              Als HTML Code habe ich es so drin:

                              <img style="transform: rotate({sainlogic.0.weather.current.windheading}deg); position: absolute; width: 100%;" src="/vis.0/testvisu/Meine_Icons/Wetterstation/kompass_2_nadel.png" data-pin-nopin="true">
                              

                              Wieso ändert sich den die Nadel nicht?

                              1 Reply Last reply Reply Quote 0
                              • First post
                                Last post

                              Support us

                              ioBroker
                              Community Adapters
                              Donate

                              552
                              Online

                              31.6k
                              Users

                              79.4k
                              Topics

                              1.3m
                              Posts

                              3
                              23
                              1639
                              Loading More Posts
                              • Oldest to Newest
                              • Newest to Oldest
                              • Most Votes
                              Reply
                              • Reply as topic
                              Log in to reply
                              Community
                              Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                              The ioBroker Community 2014-2023
                              logo