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

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. [Gelöst] VIS Icon spiegeln?

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    17
    1
    435

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    17
    1
    5.0k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.4k

[Gelöst] VIS Icon spiegeln?

Geplant Angeheftet Gesperrt Verschoben Visualisierung
vis
9 Beiträge 4 Kommentatoren 1.4k Aufrufe 4 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.
  • H Online
    H Online
    holgerwolf
    schrieb am zuletzt editiert von holgerwolf
    #1

    Hallo,

    kann man in VIS ein Icon einfach spiegeln? Es gibt zwar die css transform Eigenschaft und ich habe rotate(180deg) und scale(-1) probiert, aber es passiert nix.

    Danke
    Holger

    1 Antwort Letzte Antwort
    0
    • H Online
      H Online
      holgerwolf
      schrieb am zuletzt editiert von
      #2

      Ich bräuchte da dochmal Hilfe. Sobald ich die Icons (müssen ja svg sein, sonst klappt das mit der Farbzuordnung nach Zustand sowieso nicht) mit einem Grafikprogramm (inkscape) bearbeite und wieder hochlade, klappt das mit der Farbzuordnung auch nicht mehr. Ich kenne mich mit den Vector basierten Zeichenprograme aber auch wirklich nicht aus.
      Wie macht ihr das?

      Danke
      Holger

      1 Antwort Letzte Antwort
      0
      • OliverIOO Offline
        OliverIOO Offline
        OliverIO
        schrieb am zuletzt editiert von OliverIO
        #3

        Wenn du eine svg Datei hast, kannst du die farben mit css nicht direkt beeinflussen.
        Eine Alternative wäre das svg als Maske zu definieren und die Farbe dann mit der Hintergrundfarbe anzupassen.
        Eine weitere Alternative wäre noch per JavaScript die Eigenschaften nach dem laden zu übertragen.
        Und noch eine weitere habe ich als jquery gesehen. Das kopiert das svg in den dom nachdem die date geladen wurde. Dann kommt man auch wieder dran.

        Meine Adapter und Widgets
        TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
        Links im Profil

        H 1 Antwort Letzte Antwort
        0
        • OliverIOO OliverIO

          Wenn du eine svg Datei hast, kannst du die farben mit css nicht direkt beeinflussen.
          Eine Alternative wäre das svg als Maske zu definieren und die Farbe dann mit der Hintergrundfarbe anzupassen.
          Eine weitere Alternative wäre noch per JavaScript die Eigenschaften nach dem laden zu übertragen.
          Und noch eine weitere habe ich als jquery gesehen. Das kopiert das svg in den dom nachdem die date geladen wurde. Dann kommt man auch wieder dran.

          H Online
          H Online
          holgerwolf
          schrieb am zuletzt editiert von
          #4

          @OliverIO
          Danke, aber das ist alles nicht so einfach und zu viel Aufwand für ein seitenverkehrtes Dachfenster.

          Gruß
          Holger

          1 Antwort Letzte Antwort
          0
          • liv-in-skyL Offline
            liv-in-skyL Offline
            liv-in-sky
            schrieb am zuletzt editiert von
            #5

            ich habe mal das mit dem spiegeln probiert

            habe das in css geschrieben und es hat funktioniert

            Image 2.png

            Image 3.png

            mit :

            Image 4.png

            ohne:

            Image 5.png

            nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

            H 1 Antwort Letzte Antwort
            1
            • liv-in-skyL Offline
              liv-in-skyL Offline
              liv-in-sky
              schrieb am zuletzt editiert von
              #6

              und weil durch zufall gefunden

              mit css:

              .anime { animation: turner 4s infinite linear !important}
              
              @keyframes turner{
                  from{  transform: rotateY(0deg)   }
                  to  {  transform: rotateY(360deg) }
              }
              
              

              kann man dauernd drehen lassen:

              drehen1.gif

              nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

              1 Antwort Letzte Antwort
              2
              • liv-in-skyL liv-in-sky

                ich habe mal das mit dem spiegeln probiert

                habe das in css geschrieben und es hat funktioniert

                Image 2.png

                Image 3.png

                mit :

                Image 4.png

                ohne:

                Image 5.png

                H Online
                H Online
                holgerwolf
                schrieb am zuletzt editiert von holgerwolf
                #7

                @liv-in-sky
                Das klappt :-)
                Prima, sollte in ne FAQ

                .turnImg {
                  transform: scaleX(-1) !important;
                }
                

                Danke und Gruß
                Holger

                1 Antwort Letzte Antwort
                0
                • sigi234S Online
                  sigi234S Online
                  sigi234
                  Forum Testing Most Active
                  schrieb am zuletzt editiert von
                  #8

                  Das ist auch interessant:

                  https://github.com/runsnbunsn/ioBroker.fontui

                  Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                  Immer Daten sichern!

                  H 1 Antwort Letzte Antwort
                  0
                  • sigi234S sigi234

                    Das ist auch interessant:

                    https://github.com/runsnbunsn/ioBroker.fontui

                    H Online
                    H Online
                    holgerwolf
                    schrieb am zuletzt editiert von
                    #9

                    @sigi234 Kenne ich. Aber da muss man mehrere Icons mit unterschiedlichen Stati und Farben übereinanderlegen. Da sind mir die fertigen Widgets schon lieber.

                    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

                    627

                    Online

                    32.7k

                    Benutzer

                    82.5k

                    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