Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Material Design Widgets: Bar Chart Widget

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Material Design Widgets: Bar Chart Widget

    This topic has been deleted. Only users with topic management privileges can see it.
    • Scrounger
      Scrounger Developer @MeinzIsAs last edited by Scrounger

      @meinzisas sagte in Material Design Widgets: Bar Chart Widget:

      @Scrounger
      Guten Morgen. Wir bekomme ich 2 Werte als Anzeige über die Balken? Ich hätte das gerne so angezeigt, wie Du es im ersten Post hast ( Verbrauch und Kosten).

      Vielen Dank

      Entweder mittels Binding im Feld Textanhang[x] für jede einzelne Bar.

      Oder elegant und performanter per Skript ein json string für das chart erstellen:
      https://github.com/Scrounger/ioBroker.vis-materialdesign#dataset-json-properties

      MeinzIsAs 1 Reply Last reply Reply Quote 0
      • MeinzIsAs
        MeinzIsAs @Scrounger last edited by

        @scrounger Besten Dank. Das mit den Bindings hat super funktioniert. 👍

        1 Reply Last reply Reply Quote 0
        • Bostil
          Bostil last edited by

          Hallo @Scrounger hast du eine Idee für die Umsetzung eines gestapelten Säulendiagramms ?

          • Möchte gerne die Monate von Januar - Dezember auf der X-Achse zeigen
          • gestapelt übereinander sollen dann gerne Hausverbrauch / Eigenverbrauch der PV-Anlage / Netzbezug übereinander dargestellt werden

          Danke für eine Eingebung.

          Scrounger 1 Reply Last reply Reply Quote 0
          • Scrounger
            Scrounger Developer @Bostil last edited by

            @bostil
            Das geht nur mit dem JSON Chart

            1 Reply Last reply Reply Quote 1
            • Bostil
              Bostil last edited by Bostil

              @scrounger Dankeschön. Habe verschiedene Datenpunkte im iobroker liegen, die ich dann wohl in eine JSON-Tabelle konvertieren muss. Habe leider hierzu im Forum noch nichts gefunden.

              Hast du ggf. ein Beispiel vorliegen, das du Teilen kannst? Ggf. auch ein Script / Blockly, wie du eine JSON-Tabelle für das JSON-Chart erstellst ?

              dba9f8f3-5cbf-4ab7-b71a-d6fb651f13c2-image.png

              Scrounger 1 Reply Last reply Reply Quote 0
              • Scrounger
                Scrounger Developer @Bostil last edited by

                @bostil

                siehe 2. Beispiel in der Doku:
                https://github.com/Scrounger/ioBroker.vis-materialdesign#example
                42d0cf8f-31a8-4391-b772-1f1eb79da442-grafik.png

                Weitere Beispiele findest du Theme zum JSON Chart:
                https://forum.iobroker.net/topic/31871/material-design-widgets-json-chart-widget

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

                  @scrounger Wenn ich das Widget Bar Chart in meine Vis ziehe und nichts anpasse, friert meine ganze Visu ein und reagiert sehr träge. Ist da was bekannt?

                  1 Reply Last reply Reply Quote 0
                  • I
                    IOBaer last edited by

                    Hallo zusammen,

                    gibt es eine Möglichkeit, einen Zeilenumbruch in die Spaltenbeschriftungen einzufügen?

                    Vielen Dank.

                    1 Reply Last reply Reply Quote 0
                    • M
                      Marc9025 last edited by

                      Hallo @Scrounger
                      erstmal vielen Dank für deine Tolle arbeit mit Material Design. So macht es echt spaß in der Vis was zu erstellen.
                      Jetzt zu meiner Frage.
                      Balken.png

                      Ist es möglich die Abstände zwischen den Balken zu verkleinern ? Ich habe dazu leider keine Einstellung gefunden,

                      Ro75 1 Reply Last reply Reply Quote 0
                      • Ro75
                        Ro75 @Marc9025 last edited by

                        @marc9025 Du kannst die Balkenbreite vergrößern oder das Widget von der Höher her verringern. So mache ich das bei mir.

                        1 Reply Last reply Reply Quote 0
                        • M
                          Marc9025 last edited by

                          @ro75
                          super vielen Dank genau das was ich wollte:)

                          1 Reply Last reply Reply Quote 0
                          • M
                            Marc9025 last edited by

                            Hallo @Ro75
                            vielleicht kannst du mir ja noch mal helfen.
                            Weißt du ob man die Werte automatisch sortieren lassen kann ? Also der größte wert oben.

                            Ro75 1 Reply Last reply Reply Quote 0
                            • Ro75
                              Ro75 @Marc9025 last edited by Ro75

                              @marc9025 Das geht mit dem JSON Chart. Da musst du dir die JSON mit den Daten erstellen und da kannst ja auch sortiert die Daten schreiben. Bei den Widgets gibt es immer ganz oben bei den Eigenschaften einen Link wo alles erklärt wird. Schaue dir das mal an.

                              49a8d9e6-d85c-4e40-8cff-5fe3736cc9d8-image.png

                              Link

                              M 1 Reply Last reply Reply Quote 0
                              • M
                                Marc9025 @Ro75 last edited by

                                @ro75
                                bis jetzt nutze ich das nur für Graphen. Aber stimmt, Balken gehen damit ja auch :).

                                Ro75 1 Reply Last reply Reply Quote 0
                                • Ro75
                                  Ro75 @Marc9025 last edited by

                                  @marc9025 Du kannst natürlich auch die jetzige Variante nutzen. Bar Chart mit Datenpunkten. Dann musst du nur, wenn du z.B. 5 Balken hast (jeder Balken ein Datenpunkt), die Daten sortiert in den Datenpunkt schreiben und die Achsenbeschriftung ebenfalls mittels Datenpunkt versuchen (habe ich jetzt nicht getestet ob das mit {Datenpunkt} funktioniert).

                                  1 Reply Last reply Reply Quote 0
                                  • E
                                    eitljoerggmx.at last edited by

                                    Hallo Scrouger,

                                    erst mal will ich sagen, dass die Widgets klasse sind! Danke dafür!
                                    Ich würde gern in einem Bar Chart einen Wert invertieren (grün) , leider finde ich aber keine multiply Option (-1).
                                    Da die Daten aus sourceanalytics kommen ist es auch schwierig die mit nem einfachen Script zu drehen.

                                    Hast du vielleicht nen Tip?

                                    BarChart.png

                                    Danke, LG

                                    Scrounger 1 Reply Last reply Reply Quote 0
                                    • Scrounger
                                      Scrounger Developer @eitljoerggmx.at last edited by

                                      @eitljoerggmx-at
                                      Gibt mehre Lösungen.
                                      Z.B alias verwenden und Datenpunkt mit -1 multiplizieren. Oder Jason Objekt per Skript blockly etc erstellen

                                      E 1 Reply Last reply Reply Quote 0
                                      • E
                                        eitljoerggmx.at @Scrounger last edited by

                                        @scrounger Daran hatte ich auch gedacht, ich hab aber teils alte Daten in der DB, die müsste ich ja dann alle umrechnen wenn ich diese anzeigen will.
                                        Jahresrückblick der PV Produktion wäre zB so ein Fall.

                                        Ich habs nun mit nem Kreisdiagramm gelöst,
                                        Damit ist die Übersicht eigentlich besser und die Negativen Werte werden trotzdem als Kreissegment dargestellt. Das passt nun so für mich.

                                        LG

                                        1 Reply Last reply Reply Quote 0
                                        • Z
                                          ZockerFloh7 last edited by

                                          Hey, ich habe das Problem, dass sich mein Diagram nach gewisser Zeit nicht mehr aktualisiert.
                                          Ich bekomme dann folgende Meldung:

                                          dce8b3db-cb8c-44e3-8042-f44383db3588-grafik.png

                                          Wenn ich in der VIS die Seite wechsele und dann wieder auf die Seite mit dem Fehler gehe, dann lädt das Widget wieder korrekt.

                                          Hier meine Einstellungen:

                                          0cdd4bff-608d-4bb5-bb6e-ccb1f4bda477-grafik.png
                                          b4f9915e-2769-41b8-8536-b1fb79c1af37-grafik.png

                                          Das Datenformat stimmt.

                                          [{"label":"Birke","value":6,"dataColor":"rgb(221, 86, 122)","valueColor":"rgb(255, 0, 0)"},{"label":"Esche","value":5,"dataColor":"rgb(221, 86, 122)","valueColor":"rgb(255, 0, 0)"}]
                                          
                                          1 Reply Last reply Reply Quote 0
                                          • First post
                                            Last post

                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          925
                                          Online

                                          31.9k
                                          Users

                                          80.1k
                                          Topics

                                          1.3m
                                          Posts

                                          vis
                                          10
                                          24
                                          4962
                                          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