Seite 1 von 1

Heizungsschema in OH

Verfasst: 4. Aug 2024 13:43
von mr.b4
Hallo,

habt ihr ein Konzept um ein "klassisches" Heizungsschema mit belebten Werten zu erstellen?
Ich hätte die ganzen Temperaturen gern in einer übersichtlichen Grafik.
Meine Googlesuche war da leider nicht so erfolgreich.

Vielen Dank!

Re: Heizungsschema in OH

Verfasst: 4. Aug 2024 14:59
von udo1toni
Die Ansicht meiner Temperaturverläufe sieht in der Sitemap so aus:

Code: Alles auswählen

        Text item=gTemp {
            Frame item=gTemp {
                Setpoint item=Chart_Period step=1 minValue=1 maxValue=12 
            }
            Frame item=gTempOG {
                Chart item=gTempOG period=h refresh=10000 visibility=[Chart_Period==1]
                Chart item=gTempOG period=4h refresh=10000 visibility=[Chart_Period==2]
                Chart item=gTempOG period=8h refresh=10000 visibility=[Chart_Period==3]
                Chart item=gTempOG period=12h refresh=10000 visibility=[Chart_Period==4]
                Chart item=gTempOG period=D refresh=10000 visibility=[Chart_Period==5]
                Chart item=gTempOG period=3D refresh=10000 visibility=[Chart_Period==6]
                Chart item=gTempOG period=W refresh=10000 visibility=[Chart_Period==7]
                Chart item=gTempOG period=2W refresh=10000 visibility=[Chart_Period==8]
                Chart item=gTempOG period=M refresh=10000 visibility=[Chart_Period==9]
                Chart item=gTempOG period=2M refresh=10000 visibility=[Chart_Period==10]
                Chart item=gTempOG period=4M refresh=10000 visibility=[Chart_Period==11]
                Chart item=gTempOG period=Y refresh=10000 visibility=[Chart_Period==12]
            }
            Frame item=gTempEG {
                Chart item=gTempEG period=h refresh=10000 visibility=[Chart_Period==1]
                Chart item=gTempEG period=4h refresh=10000 visibility=[Chart_Period==2]
                Chart item=gTempEG period=8h refresh=10000 visibility=[Chart_Period==3]
                Chart item=gTempEG period=12h refresh=10000 visibility=[Chart_Period==4]
                Chart item=gTempEG period=D refresh=10000 visibility=[Chart_Period==5]
                Chart item=gTempEG period=3D refresh=10000 visibility=[Chart_Period==6]
                Chart item=gTempEG period=W refresh=10000 visibility=[Chart_Period==7]
                Chart item=gTempEG period=2W refresh=10000 visibility=[Chart_Period==8]
                Chart item=gTempEG period=M refresh=10000 visibility=[Chart_Period==9]
                Chart item=gTempEG period=2M refresh=10000 visibility=[Chart_Period==10]
                Chart item=gTempEG period=4M refresh=10000 visibility=[Chart_Period==11]
                Chart item=gTempEG period=Y refresh=10000 visibility=[Chart_Period==12]
            }
        }
Das Item Chart_Period steuert dabei, welches Diagramm angezeigt wird. Die Group Items gTempOG und gTempEG beinhalten jeweils die Temperatursensoren der einzelnen Räume im jeweiligen Geschoss.

Ober meinst Du was anderes?

Re: Heizungsschema in OH

Verfasst: 4. Aug 2024 17:45
von mr.b4
ich hab dabei an so eine Ansicht gedacht, mit entsprechenden Temperaturen im Bild

Bild

Re: Heizungsschema in OH

Verfasst: 5. Aug 2024 02:06
von udo1toni
Ah, also analog zu den bekannten Solar Widgets.
Ist mir bisher nicht untergekommen, das soll aber nicht heißen, dass so etwas noch nicht umgesetzt wurde.
Wichtig wäre, dass Du beim Suchen im Netz den Begriff Widget verwendest.
Jemand, der eine solche Ansicht entwickelt und sie teilt, verwendet auch den korrekten Terminus, das ist ziemlich sicher :) Eventuell wirst Di um englischen Forum fündig...

Re: Heizungsschema in OH

Verfasst: 5. Aug 2024 17:25
von lenschith
Im Grunde musst du dir nur ein Widget basteln und dir die Werte einblenden. Ich mag das immer sehr einfach und übersichtlich.
Screenshot 2024-08-05 172104.png
Ich habe das so in meiner MainUI gelöst.

Code: Alles auswählen

uid: Heizung_Pufferspeicher
tags:
  - gauge
  - heizung
  - lenschith
  - pufferspeicher
props:
  parameters:
    - description: kleiner Titel der Kachel
      label: Title
      name: title
      required: false
      type: TEXT
  parameterGroups:
    - name: action
      context: action
      label: Kachelaction
      description: Action die ausgeführt wird wenn die Kachel gedrückt wird.
timestamp: Jan 9, 2024, 11:01:24 AM
component: f7-card
config:
  style:
    //background: url(/static/dashboard/cards/heizkoerper.jpg)
    //width: 465px
    background-image: ="linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.8)),
      url(/static/dashboard/cards/heizkoerper.jpg)"
    background-position: center
    background-size: cover
    border-radius: var(--f7-card-expandable-border-radius)
    box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
    height: 245px
    overflow: hidden
  title: Pufferspeicher
slots:
  default:
    - component: f7-card-content
      config:
        style:
          margin: -14px
      slots:
        default:
          - component: oh-image
            config:
              style:
                //opacity: 0.5
                height: 200px
                margin-top: -5px
                padding-left: 50px
              url: \static\dashboard\cards\Pufferspeicher.png
    - component: f7-chip
      config:
        color: red
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 0px
          border-bottom-right-radius: 10px
          border-top-left-radius: 0px
          border-top-right-radius: 10px
          font-size: 16px
          height: 20px
          left: 0px
          opacity: 0.8
          padding-left: 15px
          padding-right: 10px
          position: absolute
          top: 35%
        text: =items.Tasmota13TemperaturHeizung_Pufferspeicheroben.state
        textColor: black
    - component: f7-chip
      config:
        color: orange
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 0px
          border-bottom-right-radius: 10px
          border-top-left-radius: 0px
          border-top-right-radius: 10px
          font-size: 16px
          height: 20px
          left: 0px
          opacity: 0.8
          padding-left: 15px
          padding-right: 10px
          position: absolute
          top: 55%
        text: =items.Tasmota13TemperaturHeizung_Pufferspeichermitte.state
        textColor: black
    - component: f7-chip
      config:
        color: purple
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 0px
          border-bottom-right-radius: 10px
          border-top-left-radius: 0px
          border-top-right-radius: 10px
          font-size: 16px
          height: 20px
          left: 0px
          opacity: 0.8
          padding-left: 15px
          position: absolute
          top: 75%
        text: =items.Tasmota13TemperaturHeizung_Pufferspeicherunten.state
        textColor: black
    - component: f7-chip
      config:
        color: lightblue
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 10px
          border-bottom-right-radius: 0px
          border-top-left-radius: 10px
          border-top-right-radius: 0px
          font-size: 16px
          height: 20px
          left: 130px
          opacity: 0.8
          padding-left: 15px
          padding-right: 100%
          position: absolute
          top: 20%
        text: "='Solar RL: ' + items.Tasmota13TemperaturHeizung_SolarRuecklauf.state"
        textColor: black
    - component: f7-chip
      config:
        color: red
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 10px
          border-bottom-right-radius: 0px
          border-top-left-radius: 10px
          border-top-right-radius: 0px
          font-size: 16px
          height: 20px
          left: 130px
          opacity: 0.8
          padding-left: 15px
          padding-right: 100%
          position: absolute
          top: 30%
        text: "='Heizkreis VL: ' +
          items.Tasmota13TemperaturHeizung_HeizkoerperVorlauf.state"
        textColor: black
    - component: f7-chip
      config:
        color: blue
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 10px
          border-bottom-right-radius: 0px
          border-top-left-radius: 10px
          border-top-right-radius: 0px
          font-size: 16px
          height: 20px
          left: 130px
          opacity: 0.8
          padding-left: 15px
          padding-right: 100%
          position: absolute
          top: 40%
        text: "='Heizkreis RL: ' +
          items.Tasmota13TemperaturHeizung_HeizkoerperRuecklauf.state"
        textColor: black
    - component: f7-chip
      config:
        color: red
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 10px
          border-bottom-right-radius: 0px
          border-top-left-radius: 10px
          border-top-right-radius: 0px
          font-size: 16px
          height: 20px
          left: 130px
          opacity: 0.8
          padding-left: 15px
          padding-right: 100%
          position: absolute
          top: 70%
        text: "='Ladung VL: ' +
          items.Tasmota13TemperaturHeizung_PufferladungVorlauf.state"
        textColor: black
    - component: f7-chip
      config:
        color: blue
        iconColor: black
        iconF7: thermometer
        iconSize: 16
        style:
          border-bottom-left-radius: 10px
          border-bottom-right-radius: 0px
          border-top-left-radius: 10px
          border-top-right-radius: 0px
          font-size: 16px
          height: 20px
          left: 130px
          opacity: 0.8
          padding-left: 15px
          padding-right: 100%
          position: absolute
          top: 80%
        text: "='Ladung RL: ' +
          items.Tasmota13TemperaturHeizung_PufferladungRuecklauf.state"
        textColor: black
    - component: oh-link
      config:
        actionPropsParameterGroup: action
        style:
          height: 100%
          left: 0px
          position: absolute
          top: 0px
          width: 100%
        visible: "=props.action ? true : false"

Gruß Lenschi

Re: Heizungsschema in OH

Verfasst: 5. Aug 2024 22:00
von mr.b4
Danke für eure Tipps.
Ich hab jetzt den Floorplan "umfunktioniert" und die Live-Werte auf das hydraulische Schaltbild der Heizanlage gesetzt

Re: Heizungsschema in OH

Verfasst: 6. Aug 2024 06:05
von lenschith
Und wie und was hast du da gemacht? Wäre schön etwas neugierig.

Gruß Lenschi

Re: Heizungsschema in OH

Verfasst: 8. Aug 2024 14:28
von mr.b4
Ich konnte der der Betriebanleitung vom Heizgerät (PDF) zum Glück das Schema noch als Vektor-Grafik entnehmen.
Dann hab ich mit Inkscape, die Komponten etwas verrückt um bessere Positionen für die Live-Werte zu haben.
In OH, lässt sich das dann wie Ein Raumplan handhaben.
schema_idm.jpg
Wenn ich auf dem Handy eine Querformat-Ansicht in Vollbild hinbekommen würde, wäre das auch dort perfekt zu lesen. Jetzt muss man da etwas scrollen...