Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

  1. ioBroker Community Home
  2. Deutsch
  3. Off Topic
  4. Grafana
  5. Hintergrund von Grafana Dashboard in VIS entfernen

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.3k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.0k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.4k

Hintergrund von Grafana Dashboard in VIS entfernen

Geplant Angeheftet Gesperrt Verschoben Grafana
vis
148 Beiträge 33 Kommentatoren 32.9k Aufrufe 40 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • Master67M Master67

    @JB_Sullivan .... Sorry was ist den ein Boom?
    Ich nutze auch Grafana in der Vis wenn ich hinter den http link noch ein "&kiosk" eingebe sehe ich nur das Dashboard ohne Schaltflächen, ist das als Boom gemeint (also die Schaltflächen)?!

    FeuersturmF Online
    FeuersturmF Online
    Feuersturm
    schrieb am zuletzt editiert von Feuersturm
    #22

    @Master67

    Mit dem Boom Plugin für Grafana  https://grafana.com/grafana/plugins/yesoreyeram-boomtheme-panel kann man sich den Hintergrund individuell gestalten. In meinem Fall nutze ich es dafür um den Hintergrund von einem Dashboard transparent zu machen, um es in meine Vis einzusetzen (siehe hier https://forum.iobroker.net/post/520727)

    Master67M 1 Antwort Letzte Antwort
    0
    • FeuersturmF Feuersturm

      @Master67

      Mit dem Boom Plugin für Grafana  https://grafana.com/grafana/plugins/yesoreyeram-boomtheme-panel kann man sich den Hintergrund individuell gestalten. In meinem Fall nutze ich es dafür um den Hintergrund von einem Dashboard transparent zu machen, um es in meine Vis einzusetzen (siehe hier https://forum.iobroker.net/post/520727)

      Master67M Offline
      Master67M Offline
      Master67
      schrieb am zuletzt editiert von
      #23

      @Feuersturm ..... Danke... ich verstehe :v:

      Gruß Master67

      1 Antwort Letzte Antwort
      0
      • FeuersturmF Feuersturm

        @JB_Sullivan Boom greift nur, wenn du das ganze Dasboard in einem iframe darstellst.

        Soll nur ein Panel transparent sein musst du diese Anleitung befolgen: https://forum.iobroker.net/topic/29035/hintergrund-von-grafana-dashboard-in-vis-entfernen/6

        JB_SullivanJ Offline
        JB_SullivanJ Offline
        JB_Sullivan
        schrieb am zuletzt editiert von JB_Sullivan
        #24

        @Feuersturm

        Ja, ich weiß - das ist ja das ganze Dashboard. Ich habe da nur einen Trend drin abgelegt und erstelle einen "Teilen" Link von dem Dashboard und nicht nur von dem Trend - trotzdem geht es nicht.

        Ich habe es sogar soweit, das mit der Sternenhimmel angezeigt wird. Sobald ich aber den generierten Link von dem "Sternen Dashboard" in ein VIS iframe einfüge, ist der Hintergrund wieder schwarz - egal ob KIOSK Mode oder nicht.

        4f6671b9-27a9-462c-8c22-b0939da58d45-image.png

        8191fa3f-4838-40e3-89e8-04a08bc0f06a-image.png

        ioBroker auf Intel Core i3-5005U NUC und Windwos10 Pro

        FeuersturmF 1 Antwort Letzte Antwort
        0
        • JB_SullivanJ JB_Sullivan

          @Feuersturm

          Ja, ich weiß - das ist ja das ganze Dashboard. Ich habe da nur einen Trend drin abgelegt und erstelle einen "Teilen" Link von dem Dashboard und nicht nur von dem Trend - trotzdem geht es nicht.

          Ich habe es sogar soweit, das mit der Sternenhimmel angezeigt wird. Sobald ich aber den generierten Link von dem "Sternen Dashboard" in ein VIS iframe einfüge, ist der Hintergrund wieder schwarz - egal ob KIOSK Mode oder nicht.

          4f6671b9-27a9-462c-8c22-b0939da58d45-image.png

          8191fa3f-4838-40e3-89e8-04a08bc0f06a-image.png

          FeuersturmF Online
          FeuersturmF Online
          Feuersturm
          schrieb am zuletzt editiert von
          #25

          @JB_Sullivan Poste doch mal bitte, was im Feld Custom Style / CSS Override steht. Ich glaube du hast bei dir den falschen Inhalt drin. Es sieht nach dem aus was bei mir in der grafana.css ist, welche man für die transparenten Panesl braucht.

          Bei mir ist folgendes drin:

          body{
          background: transparent;
          }
          
          .page-dashboard .main-view, .page-explore .main-view{
          background: transparent !important;
          border: 0px solid transparent !important;
          }
          
          .panel-container{
              border: 0px solid #1F2129  !important;
          }
          
          .graph-legend-table .graph-legend-series:nth-child(2n) {
              background: transparent;
          }
          
          JB_SullivanJ 1 Antwort Letzte Antwort
          0
          • FeuersturmF Feuersturm

            @JB_Sullivan Poste doch mal bitte, was im Feld Custom Style / CSS Override steht. Ich glaube du hast bei dir den falschen Inhalt drin. Es sieht nach dem aus was bei mir in der grafana.css ist, welche man für die transparenten Panesl braucht.

            Bei mir ist folgendes drin:

            body{
            background: transparent;
            }
            
            .page-dashboard .main-view, .page-explore .main-view{
            background: transparent !important;
            border: 0px solid transparent !important;
            }
            
            .panel-container{
                border: 0px solid #1F2129  !important;
            }
            
            .graph-legend-table .graph-legend-series:nth-child(2n) {
                background: transparent;
            }
            
            JB_SullivanJ Offline
            JB_SullivanJ Offline
            JB_Sullivan
            schrieb am zuletzt editiert von JB_Sullivan
            #26

            @Feuersturm sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

            Das ist interessant - ich habe genau das in dem Custom CSS von BOOM drin stehen. Den ganzen Nachmittag lang immer und immer wieder. Ich habe immer schön brav Apply und Save gedrückt und es hat nie funktioniert.

            Wenn ich dann via Edit wieder zurück gekommen bin, war jedes mal das Custom CSS wieder weg. Ich habe es dann irgend wann aufgegeben. Eben habe ich es nochmal versucht und nun geht es - frag mich nicht was da Sache war.

            Auf jeden Fall ist es jetzt transparent - naja nun geht die Arbeit los ...... alle bereits bestehenden Trends erstmal transparent machen. Man gut das ich gleich von Anfang an nur einen Trend pro Dashbord verwendet habe.

            d2f466c8-f57e-4faa-bbea-ad35d90e6f0f-image.png

            BTW: Gibt es eine schnelle Möglichkeit, das ganze Kontrastreicher zugestalten?

            ioBroker auf Intel Core i3-5005U NUC und Windwos10 Pro

            1 Antwort Letzte Antwort
            0
            • FeuersturmF Feuersturm

              @nousefor82 da kann ich dir leider nicht helfen.
              @jkvarel Hast du da was auf Lager?

              jkvarelJ Offline
              jkvarelJ Offline
              jkvarel
              Developer
              schrieb am zuletzt editiert von jkvarel
              #27

              @Feuersturm @nousefor82
              etwas spät aber ja das geht
              So kannst du für das ganze Dashboard die Schriftart ändern:
              .dashboard-content{
              font-family: cursive;
              }

              S NashraN 2 Antworten Letzte Antwort
              0
              • jkvarelJ jkvarel

                @Feuersturm @nousefor82
                etwas spät aber ja das geht
                So kannst du für das ganze Dashboard die Schriftart ändern:
                .dashboard-content{
                font-family: cursive;
                }

                S Nicht stören
                S Nicht stören
                stenmic
                schrieb am zuletzt editiert von stenmic
                #28

                @jkvarel
                zur Info,
                man kann auch google fonts einbinden.
                den „Link“ dazu muss man ebenfalls in der „ usr\share\grafana\public\views\index.html“ angeben.
                Das gilt auch für den .panel-container
                Die Schriftgröße geht über z.B. font-size: 24px;

                1 Antwort Letzte Antwort
                0
                • jkvarelJ jkvarel

                  @Feuersturm @nousefor82
                  etwas spät aber ja das geht
                  So kannst du für das ganze Dashboard die Schriftart ändern:
                  .dashboard-content{
                  font-family: cursive;
                  }

                  NashraN Offline
                  NashraN Offline
                  Nashra
                  Most Active Forum Testing
                  schrieb am zuletzt editiert von
                  #29

                  @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                  @Feuersturm @nousefor82
                  etwas spät aber ja das geht
                  So kannst du für das ganze Dashboard die Schriftart ändern:
                  .dashboard-content{
                  font-family: cursive;
                  }

                  Cursive funktoniert ja, aber ich bekomme die Schriftfarbe einfach nicht geändert.
                  Normale css-Anweisung nimmt er einfach nicht :white_frowning_face:

                  Gruß Ralf
                  Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                  jkvarelJ 1 Antwort Letzte Antwort
                  0
                  • NashraN Nashra

                    @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                    @Feuersturm @nousefor82
                    etwas spät aber ja das geht
                    So kannst du für das ganze Dashboard die Schriftart ändern:
                    .dashboard-content{
                    font-family: cursive;
                    }

                    Cursive funktoniert ja, aber ich bekomme die Schriftfarbe einfach nicht geändert.
                    Normale css-Anweisung nimmt er einfach nicht :white_frowning_face:

                    jkvarelJ Offline
                    jkvarelJ Offline
                    jkvarel
                    Developer
                    schrieb am zuletzt editiert von
                    #30

                    @Nashra cursive ist in dem Fall der Name der Schriftart. Das klappt auch mit Arial usw.

                    NashraN 1 Antwort Letzte Antwort
                    0
                    • jkvarelJ jkvarel

                      @Nashra cursive ist in dem Fall der Name der Schriftart. Das klappt auch mit Arial usw.

                      NashraN Offline
                      NashraN Offline
                      Nashra
                      Most Active Forum Testing
                      schrieb am zuletzt editiert von
                      #31

                      @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                      @Nashra cursive ist in dem Fall der Name der Schriftart. Das klappt auch mit Arial usw.

                      Hey @jkvarel, das funktioniert ja auch, aber mir geht es um die Schriftfarbe und die bekomme ich einfach nicht geändert.

                      Gruß Ralf
                      Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                      jkvarelJ 1 Antwort Letzte Antwort
                      0
                      • NashraN Nashra

                        @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                        @Nashra cursive ist in dem Fall der Name der Schriftart. Das klappt auch mit Arial usw.

                        Hey @jkvarel, das funktioniert ja auch, aber mir geht es um die Schriftfarbe und die bekomme ich einfach nicht geändert.

                        jkvarelJ Offline
                        jkvarelJ Offline
                        jkvarel
                        Developer
                        schrieb am zuletzt editiert von
                        #32

                        @Nashra hattest du oben nicht nach Schriftart gefragt?

                        Farbe müsste eigentlich in der gleichen Klasse mit "color: ..." funktionieren

                        NashraN 1 Antwort Letzte Antwort
                        0
                        • jkvarelJ jkvarel

                          @Nashra hattest du oben nicht nach Schriftart gefragt?

                          Farbe müsste eigentlich in der gleichen Klasse mit "color: ..." funktionieren

                          NashraN Offline
                          NashraN Offline
                          Nashra
                          Most Active Forum Testing
                          schrieb am zuletzt editiert von
                          #33

                          @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                          @Nashra hattest du oben nicht nach Schriftart gefragt?

                          Farbe müsste eigentlich in der gleichen Klasse mit "color: ..." funktionieren

                          Hallo @jkvarel , nein war Schriftfarbe :blush:
                          Das ist ja das Problem zb. color: #db1424; nimmt er einfach nicht an.

                          Gruß Ralf
                          Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                          Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                          jkvarelJ 1 Antwort Letzte Antwort
                          0
                          • NashraN Nashra

                            @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                            @Nashra hattest du oben nicht nach Schriftart gefragt?

                            Farbe müsste eigentlich in der gleichen Klasse mit "color: ..." funktionieren

                            Hallo @jkvarel , nein war Schriftfarbe :blush:
                            Das ist ja das Problem zb. color: #db1424; nimmt er einfach nicht an.

                            jkvarelJ Offline
                            jkvarelJ Offline
                            jkvarel
                            Developer
                            schrieb am zuletzt editiert von
                            #34

                            @Nashra said in Hintergrund von Grafana Dashboard in VIS entfernen:

                            #db1424

                            habs mal versucht und es funktioniert. der Text ist rot

                            .dashboard-content{
                            font-family: cursive;
                            color: #db1424;
                            }

                            7d78cdd4-dd9e-4344-a10d-368105c2de37-image.png

                            NashraN 1 Antwort Letzte Antwort
                            0
                            • jkvarelJ jkvarel

                              @Nashra said in Hintergrund von Grafana Dashboard in VIS entfernen:

                              #db1424

                              habs mal versucht und es funktioniert. der Text ist rot

                              .dashboard-content{
                              font-family: cursive;
                              color: #db1424;
                              }

                              7d78cdd4-dd9e-4344-a10d-368105c2de37-image.png

                              NashraN Offline
                              NashraN Offline
                              Nashra
                              Most Active Forum Testing
                              schrieb am zuletzt editiert von
                              #35

                              @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                              @Nashra said in Hintergrund von Grafana Dashboard in VIS entfernen:

                              #db1424

                              habs mal versucht und es funktioniert. der Text ist rot

                              .dashboard-content{
                              font-family: cursive;
                              color: #db1424;
                              }

                              7d78cdd4-dd9e-4344-a10d-368105c2de37-image.png

                              Hi @jkvarel,
                              ich meinte diese Schriftfarbe (rot markiert)
                              graf-schriftfarbe.JPG
                              da habe ich schon fast alles abgesucht, aber egal was ich geändert habe, es wird
                              nicht angenommen.

                              Gruß Ralf
                              Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                              Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                              SegwayS 1 Antwort Letzte Antwort
                              0
                              • NashraN Nashra

                                @jkvarel sagte in Hintergrund von Grafana Dashboard in VIS entfernen:

                                @Nashra said in Hintergrund von Grafana Dashboard in VIS entfernen:

                                #db1424

                                habs mal versucht und es funktioniert. der Text ist rot

                                .dashboard-content{
                                font-family: cursive;
                                color: #db1424;
                                }

                                7d78cdd4-dd9e-4344-a10d-368105c2de37-image.png

                                Hi @jkvarel,
                                ich meinte diese Schriftfarbe (rot markiert)
                                graf-schriftfarbe.JPG
                                da habe ich schon fast alles abgesucht, aber egal was ich geändert habe, es wird
                                nicht angenommen.

                                SegwayS Offline
                                SegwayS Offline
                                Segway
                                schrieb am zuletzt editiert von Segway
                                #36

                                @Nashra
                                Ich hatte meine ich mal was auf Github dazu gelesen und es gibt wohl auch ein Feature request dazu.
                                Es soll ein Workaround geben in dem man eine Textbox hinterlegt und als HTML konfiguriert und dann zB sowas eingibt:

                                .left-yaxis-label {
                                    left: 24px;
                                }
                                

                                Nur ne Idee, weiss nicht ob das geht

                                Gruß Dirk
                                Intel Proxmox Cluster (3x NUC) mit Debian & Proxmox / IoB als VM unter Debian / 60+ Adapter installiert

                                1 Antwort Letzte Antwort
                                0
                                • NashraN Offline
                                  NashraN Offline
                                  Nashra
                                  Most Active Forum Testing
                                  schrieb am zuletzt editiert von Nashra
                                  #37

                                  @jkvarel @Segway
                                  So, habe es jetzt hinbekommen :grinning:
                                  Bin jetzt, anstatt über Boom Theme wo trotzdem die Schriftfarbe im iframe bei Vis in weiß kam,
                                  nach dieser Anweisung vorgegangen und habe in der css folgendes eingetragen

                                  @charset "UTF-8";
                                  
                                  .panel-container {
                                      background-color: #2D343c !important; 
                                      border: 0px solid #2D343c !important;
                                  }
                                  .dashboard-container{
                                      background-color: #2D343c !important; 
                                  }
                                  div.flot-text {
                                  	color: #787D83 !important;
                                  }
                                  

                                  Ergebnis, Textfarbe wird angepasst
                                  internet-ping.PNG
                                  ws.PNG

                                  Gruß Ralf
                                  Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                  jkvarelJ 1 Antwort Letzte Antwort
                                  0
                                  • NashraN Nashra

                                    @jkvarel @Segway
                                    So, habe es jetzt hinbekommen :grinning:
                                    Bin jetzt, anstatt über Boom Theme wo trotzdem die Schriftfarbe im iframe bei Vis in weiß kam,
                                    nach dieser Anweisung vorgegangen und habe in der css folgendes eingetragen

                                    @charset "UTF-8";
                                    
                                    .panel-container {
                                        background-color: #2D343c !important; 
                                        border: 0px solid #2D343c !important;
                                    }
                                    .dashboard-container{
                                        background-color: #2D343c !important; 
                                    }
                                    div.flot-text {
                                    	color: #787D83 !important;
                                    }
                                    

                                    Ergebnis, Textfarbe wird angepasst
                                    internet-ping.PNG
                                    ws.PNG

                                    jkvarelJ Offline
                                    jkvarelJ Offline
                                    jkvarel
                                    Developer
                                    schrieb am zuletzt editiert von jkvarel
                                    #38

                                    @Nashra im Boom Theme klappt das auch nicht, wenn du das im iframe hast, da das Panel in dem Moment nicht da ist. Hätte ich dir auch sagen können :smile:
                                    Boom Theme wird nur im Dashboard geladen. Wenn du also das ganze Dashboard per iframe einbindest, dann sollten die Änderung drin sein.
                                    Die Lösung von Feuersturm kenne ich.

                                    1 Antwort Letzte Antwort
                                    1
                                    • NashraN Offline
                                      NashraN Offline
                                      Nashra
                                      Most Active Forum Testing
                                      schrieb am zuletzt editiert von
                                      #39

                                      Das war ja das was mir nicht in den Kopf wollte, in Grafana wurde es geändert
                                      und beim iframe dann nicht. Naja egal, jetzt funktioniert es :blush:
                                      Danke für deine Hilfe @jkvarel :+1:

                                      Gruß Ralf
                                      Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

                                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                      Jens MeyerJ 1 Antwort Letzte Antwort
                                      1
                                      • NashraN Nashra

                                        Das war ja das was mir nicht in den Kopf wollte, in Grafana wurde es geändert
                                        und beim iframe dann nicht. Naja egal, jetzt funktioniert es :blush:
                                        Danke für deine Hilfe @jkvarel :+1:

                                        Jens MeyerJ Offline
                                        Jens MeyerJ Offline
                                        Jens Meyer
                                        schrieb am zuletzt editiert von
                                        #40

                                        Hallo,
                                        Mal ne Frage... wenn man dann ein Update von Grafana macht ist alles wieder hinfällig und man muss alles neu machen?

                                        JB_SullivanJ 1 Antwort Letzte Antwort
                                        0
                                        • Jens MeyerJ Jens Meyer

                                          Hallo,
                                          Mal ne Frage... wenn man dann ein Update von Grafana macht ist alles wieder hinfällig und man muss alles neu machen?

                                          JB_SullivanJ Offline
                                          JB_SullivanJ Offline
                                          JB_Sullivan
                                          schrieb am zuletzt editiert von JB_Sullivan
                                          #41

                                          @jens-meyer Wenn man die Konfig nicht sichert - ja

                                          abc8baf1-1cc2-4751-b55f-10b2d583c57e-image.png

                                          ioBroker auf Intel Core i3-5005U NUC und Windwos10 Pro

                                          Jens MeyerJ 1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          603

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe