PowerFlow [animiertes SVG, dummy, javascript]

Begonnen von schwatter, 20 Oktober 2024, 21:56:34

Vorheriges Thema - Nächstes Thema
Drucken
Nach unten Seiten 1 2 Alle
Benutzer-Aktionen

schwatter

#15
31 Oktober 2024, 11:31:51
Moin,

ein weiteres Update auf Basis des dummyNew.pm.

- setList und readingList ausgedünnt.
- neue setList für batteryState_v: stop, gridLoad, gridUnload, solarLoad, houseUnload. Je nach Status werden die Linien angesteuert.
- Battery wird zum Housering nur dazugerechnet, wenn der Status houseUnload ist.
- Battery um %-Wert erweitert. Setzen mit battery_p.
- Low-Carbon funktioniert jetzt und kann gesetzt werden.


1.dummy
Code Auswählen
defmod powerGrid dummyNew
attr powerGrid readingList airdryer_v battery_v battery_p batteryState_v dishwasher_v dryer_v fridge_v grid_v house_v lowcarbon_v solar_v solarToBattery_v washer_v
attr powerGrid room Energy1
attr powerGrid setList airdryer_v:textField battery_v:textField battery_p:textField batteryState_v:select,stop,gridLoad,gridUnload,solarLoad,houseUnload dishwasher_v:textField dryer_v:textField fridge_v:textField grid_v:textField house_v:textField lowcarbon_v:textField solar_v:textField washer_v:textField
attr powerGrid stateFormat <!DOCTYPE html>\
<html>\
<head>\
<title>powerGrid</title>\
<style>\
#wrapper {\
    background: black;;\
}\
svg {\
    width: 100%;;\
    height: auto;;\
}\
</style>\
</head>\
<body>\
\
<div id="wrapper">\
<svg viewBox='0 0 650 500' xmlns='http://www.w3.org/2000/svg' style='background-color: black;; width: 90%;; height: auto;;'>\
 \
 <!-- Titel -->\
  <text x='20' y='30' font-family='Arial' font-size='24' fill='white'>Power Flow</text>\
\
  <!-- Kohlenstoffarm (Grün) -->\
  <circle id='lowCarbonCircle' cx='100' cy='100' r='45' fill='none' stroke='green' stroke-width='10' opacity='0.4'/>\
  <circle cx='100' cy='100' r='40' fill='none' stroke='green' stroke-width='5'/>\
  <text x='100' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Low-Carbon</text>\
  <text id='lowCarbonPower' x='100' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>0 %</text>\
\
  <!-- Solar (Orange) -->\
  <circle id='solarCircle' cx='250' cy='100' r='45' fill='none' stroke='orange' stroke-width='10' opacity='0.4'/>\
  <circle cx='250' cy='100' r='40' fill='none' stroke='orange' stroke-width='5'/>\
  <text x='250' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Solar</text>\
  <text id='solarPower' x='250' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Netz (Blau) -->\
  <circle id='gridCircle' cx='100' cy='250' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='100' cy='250' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='100' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Grid</text>\
  <text id='gridPower' x='100' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Batterie Label -->\
  <text x="250" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Battery</text>\
  <text id="batteryPower" x="250" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="batteryPercent" x="250" y="385" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie stop (Turkis) -->\
  <circle id='batteryCircle' cx='250' cy='400' r='45' fill='none' stroke='turquoise' stroke-width='10' opacity='0.4'/>\
  <circle id="batteryStatic" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5"/>\
\
  <!-- Batterie dreht links -->\
  <circle id="batteryClockwise" cx="250" cy="400" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Batteriering dreht rechts -->\
  <circle id="batteryCounterClockwise" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="-360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Haus + Ringsegmente -->\
  <circle id='houseCircle' cx='400' cy='250' r='45' fill='none' stroke='purple' stroke-width='10' opacity='0.4'/>\
  <circle id='solarSegment' cx='400' cy='250' r='40' fill='none' stroke='orange' stroke-width='5' stroke-dasharray='0 100' />\
  <circle id='gridSegment' cx='400' cy='250' r='40' fill='none' stroke='blue' stroke-width='5' stroke-dasharray='0 100' />\
  <circle id='batterySegment' cx='400' cy='250' r='40' fill='none' stroke='purple' stroke-width='5' stroke-dasharray='0 100' />\
  <text x='400' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>House</text>\
  <text id='housePower' x='400' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Lufttrockner (Blau) -->\
  <circle id='airDryerCircle' cx='400' cy='100' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='400' cy='100' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='400' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Airdryer</text>\
  <text id='airdryerPower' x='400' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Kühlschrank (Gelb) -->\
  <circle id='fridgeCircle' cx='400' cy='400' r='45' fill='none' stroke='yellow' stroke-width='10' opacity='0.4'/>\
  <circle cx='400' cy='400' r='40' fill='none' stroke='yellow' stroke-width='5'/>\
  <text x='400' y='400' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Fridge</text>\
  <text id='fridgePower' x='400' y='415' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Waschmaschine (Gelb) -->\
  <circle id='washerCircle' cx='550' cy='100' r='45' fill='none' stroke='yellow' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='100' r='40' fill='none' stroke='yellow' stroke-width='5'/>\
  <text x='550' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Washer</text>\
  <text id='washerPower' x='550' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Trockner (Grün) -->\
  <circle id='dryerCircle' cx='550' cy='250' r='45' fill='none' stroke='green' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='250' r='40' fill='none' stroke='green' stroke-width='5'/>\
  <text x='550' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Dryer</text>\
  <text id='dryerPower' x='550' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Geschirrspüler (Blau) -->\
  <circle id='dishwasherCircle' cx='550' cy='400' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='400' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='550' y='400' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Dishwasher</text>\
  <text id='dishwasherPower' x='550' y='415' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Verbindungslinien -->\
\
  <!-- Verbindungslinie von Batterie zu Haus (Lila) --> \
  <path id='batteryToHousePath' d='M 260 354 A 110 100 0 0 1 357 260' stroke='purple' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='purple'>\
    <animateMotion id='batteryToHouse' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#batteryToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Haus (Orange) -->\
  <path id='solarToHousePath' d='M 260 145 A 110 100 0 0 0 357 240' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToHouse' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Batterie (Orange) -->\
  <path id='solarToBatteryPath' d='M 250 145 A 0 100 0 0 1 250 354' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToBattery' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToBatteryPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Lufttrockner (Blau) -->\
  <path id='houseToAirdryerPath' d='M 400 203 A 0 67 0 0 1 400 145' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='houseToAirdryer' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToAirdryerPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Kühlschrank (Gelb) -->\
  <path id='houseToFridgePath' d='M 400 298 A 0 67 0 0 1 400 354' stroke='yellow' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='yellow'>\
    <animateMotion id='houseToFridge' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToFridgePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Kohlenstoffarm (Grün) -->\
  <path id='gridToLowCarbonPath' d='M 100 208 A 0 68 0 0 1 100 145' stroke='green' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='green'>\
    <animateMotion id='gridToLowCarbon' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#gridToLowCarbonPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Haus (Blau) -->\
  <path id='gridToHousePath' d='M 146 250 H 357' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='gridToHouse' dur='3s' repeatCount='indefinite'>\
      <mpath href='#gridToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Trockner (Green) -->\
  <path id='houseToDryerPath' d='M 446 250 A 0 0 0 0 1 505 250' stroke='green' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='green'>\
    <animateMotion id='houseToDryer' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToDryerPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Geschirrspüler (Blue) -->\
  <path id='houseToDishwasherPath' d='M 446 260 A 110 110 0 0 1 550 354' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='houseToDishwasher' dur='3s' repeatCount='indefinite'>\
      <mpath href='#houseToDishwasherPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Netz (Orange) -->\
  <path id='solarToGridPath' d='M 240 145 A 110 100 0 0 1 146 240' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToGrid' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToGridPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Batterie (Turkis) -->\
  <path id='gridToBatteryPath' d='M 146 260 A 110 100 0 0 1 240 354' stroke='turquoise' stroke-width='2' fill='transparent'/>\
  <circle id="gridToBatteryStatic" r='5' fill='turquoise' style="display:none;;" />\
  <circle id="gridToBatteryForward" r='5' fill='turquoise' style="display:none;;">\
    <animateMotion id='gridToBatteryForwardAnim' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#gridToBatteryPath'/>\
    </animateMotion>\
  </circle>\
  <circle id="gridToBatteryBackward" r='5' fill='turquoise' style="display:none;;">\
    <animateMotion id='gridToBatteryBackwardAnim' dur='3s' repeatCount='indefinite' keyPoints='1;;0' keyTimes='0;;1'>\
      <mpath href='#gridToBatteryPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Waschmaschine (Gelb) -->\
  <path id='houseToWasherPath' d='M 550 145 A 110 100 0 0 1 446 240' stroke='yellow' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='yellow'>\
    <animateMotion id='houseToWasher' dur='3s' repeatCount='indefinite' keyPoints='1;;0' keyTimes='0;;1'>\
      <mpath href='#houseToWasherPath'/>\
    </animateMotion>\
  </circle>\
\
</svg>\
</div>\
</body>\
</html>\


setstate powerGrid <!DOCTYPE html>\
<html>\
<head>\
<title>powerGrid</title>\
<style>\
#wrapper {\
    background: black;;\
}\
svg {\
    width: 100%;;\
    height: auto;;\
}\
</style>\
</head>\
<body>\
\
<div id="wrapper">\
<svg viewBox='0 0 650 500' xmlns='http://www.w3.org/2000/svg' style='background-color: black;; width: 90%;; height: auto;;'>\
 \
 <!-- Titel -->\
  <text x='20' y='30' font-family='Arial' font-size='24' fill='white'>Power Flow</text>\
\
  <!-- Kohlenstoffarm (Grün) -->\
  <circle id='lowCarbonCircle' cx='100' cy='100' r='45' fill='none' stroke='green' stroke-width='10' opacity='0.4'/>\
  <circle cx='100' cy='100' r='40' fill='none' stroke='green' stroke-width='5'/>\
  <text x='100' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Low-Carbon</text>\
  <text id='lowCarbonPower' x='100' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>0 %</text>\
\
  <!-- Solar (Orange) -->\
  <circle id='solarCircle' cx='250' cy='100' r='45' fill='none' stroke='orange' stroke-width='10' opacity='0.4'/>\
  <circle cx='250' cy='100' r='40' fill='none' stroke='orange' stroke-width='5'/>\
  <text x='250' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Solar</text>\
  <text id='solarPower' x='250' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Netz (Blau) -->\
  <circle id='gridCircle' cx='100' cy='250' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='100' cy='250' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='100' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Grid</text>\
  <text id='gridPower' x='100' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Batterie Label -->\
  <text x="250" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Battery</text>\
  <text id="batteryPower" x="250" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="batteryPercent" x="250" y="385" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie stop (Turkis) -->\
  <circle id='batteryCircle' cx='250' cy='400' r='45' fill='none' stroke='turquoise' stroke-width='10' opacity='0.4'/>\
  <circle id="batteryStatic" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5"/>\
\
  <!-- Batterie dreht links -->\
  <circle id="batteryClockwise" cx="250" cy="400" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Batteriering dreht rechts -->\
  <circle id="batteryCounterClockwise" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="-360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Haus + Ringsegmente -->\
  <circle id='houseCircle' cx='400' cy='250' r='45' fill='none' stroke='purple' stroke-width='10' opacity='0.4'/>\
  <circle id='solarSegment' cx='400' cy='250' r='40' fill='none' stroke='orange' stroke-width='5' stroke-dasharray='0 100' />\
  <circle id='gridSegment' cx='400' cy='250' r='40' fill='none' stroke='blue' stroke-width='5' stroke-dasharray='0 100' />\
  <circle id='batterySegment' cx='400' cy='250' r='40' fill='none' stroke='purple' stroke-width='5' stroke-dasharray='0 100' />\
  <text x='400' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>House</text>\
  <text id='housePower' x='400' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Lufttrockner (Blau) -->\
  <circle id='airDryerCircle' cx='400' cy='100' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='400' cy='100' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='400' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Airdryer</text>\
  <text id='airdryerPower' x='400' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Kühlschrank (Gelb) -->\
  <circle id='fridgeCircle' cx='400' cy='400' r='45' fill='none' stroke='yellow' stroke-width='10' opacity='0.4'/>\
  <circle cx='400' cy='400' r='40' fill='none' stroke='yellow' stroke-width='5'/>\
  <text x='400' y='400' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Fridge</text>\
  <text id='fridgePower' x='400' y='415' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Waschmaschine (Gelb) -->\
  <circle id='washerCircle' cx='550' cy='100' r='45' fill='none' stroke='yellow' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='100' r='40' fill='none' stroke='yellow' stroke-width='5'/>\
  <text x='550' y='100' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Washer</text>\
  <text id='washerPower' x='550' y='115' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Trockner (Grün) -->\
  <circle id='dryerCircle' cx='550' cy='250' r='45' fill='none' stroke='green' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='250' r='40' fill='none' stroke='green' stroke-width='5'/>\
  <text x='550' y='250' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Dryer</text>\
  <text id='dryerPower' x='550' y='265' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Geschirrspüler (Blau) -->\
  <circle id='dishwasherCircle' cx='550' cy='400' r='45' fill='none' stroke='blue' stroke-width='10' opacity='0.4'/>\
  <circle cx='550' cy='400' r='40' fill='none' stroke='blue' stroke-width='5'/>\
  <text x='550' y='400' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'>Dishwasher</text>\
  <text id='dishwasherPower' x='550' y='415' font-family='Arial' font-size='12' fill='white' text-anchor='middle' alignment-baseline='middle'></text>\
\
  <!-- Verbindungslinien -->\
\
  <!-- Verbindungslinie von Batterie zu Haus (Lila) --> \
  <path id='batteryToHousePath' d='M 260 354 A 110 100 0 0 1 357 260' stroke='purple' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='purple'>\
    <animateMotion id='batteryToHouse' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#batteryToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Haus (Orange) -->\
  <path id='solarToHousePath' d='M 260 145 A 110 100 0 0 0 357 240' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToHouse' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Batterie (Orange) -->\
  <path id='solarToBatteryPath' d='M 250 145 A 0 100 0 0 1 250 354' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToBattery' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToBatteryPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Lufttrockner (Blau) -->\
  <path id='houseToAirdryerPath' d='M 400 203 A 0 67 0 0 1 400 145' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='houseToAirdryer' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToAirdryerPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Kühlschrank (Gelb) -->\
  <path id='houseToFridgePath' d='M 400 298 A 0 67 0 0 1 400 354' stroke='yellow' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='yellow'>\
    <animateMotion id='houseToFridge' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToFridgePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Kohlenstoffarm (Grün) -->\
  <path id='gridToLowCarbonPath' d='M 100 208 A 0 68 0 0 1 100 145' stroke='green' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='green'>\
    <animateMotion id='gridToLowCarbon' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#gridToLowCarbonPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Haus (Blau) -->\
  <path id='gridToHousePath' d='M 146 250 H 357' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='gridToHouse' dur='3s' repeatCount='indefinite'>\
      <mpath href='#gridToHousePath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Trockner (Green) -->\
  <path id='houseToDryerPath' d='M 446 250 A 0 0 0 0 1 505 250' stroke='green' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='green'>\
    <animateMotion id='houseToDryer' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#houseToDryerPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Geschirrspüler (Blue) -->\
  <path id='houseToDishwasherPath' d='M 446 260 A 110 110 0 0 1 550 354' stroke='blue' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='blue'>\
    <animateMotion id='houseToDishwasher' dur='3s' repeatCount='indefinite'>\
      <mpath href='#houseToDishwasherPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Netz (Orange) -->\
  <path id='solarToGridPath' d='M 240 145 A 110 100 0 0 1 146 240' stroke='orange' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='orange'>\
    <animateMotion id='solarToGrid' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#solarToGridPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Batterie (Turkis) -->\
  <path id='gridToBatteryPath' d='M 146 260 A 110 100 0 0 1 240 354' stroke='turquoise' stroke-width='2' fill='transparent'/>\
  <circle id="gridToBatteryStatic" r='5' fill='turquoise' style="display:none;;" />\
  <circle id="gridToBatteryForward" r='5' fill='turquoise' style="display:none;;">\
    <animateMotion id='gridToBatteryForwardAnim' dur='3s' repeatCount='indefinite' keyPoints='0;;1' keyTimes='0;;1'>\
      <mpath href='#gridToBatteryPath'/>\
    </animateMotion>\
  </circle>\
  <circle id="gridToBatteryBackward" r='5' fill='turquoise' style="display:none;;">\
    <animateMotion id='gridToBatteryBackwardAnim' dur='3s' repeatCount='indefinite' keyPoints='1;;0' keyTimes='0;;1'>\
      <mpath href='#gridToBatteryPath'/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Waschmaschine (Gelb) -->\
  <path id='houseToWasherPath' d='M 550 145 A 110 100 0 0 1 446 240' stroke='yellow' stroke-width='2' fill='transparent'/>\
  <circle r='5' fill='yellow'>\
    <animateMotion id='houseToWasher' dur='3s' repeatCount='indefinite' keyPoints='1;;0' keyTimes='0;;1'>\
      <mpath href='#houseToWasherPath'/>\
    </animateMotion>\
  </circle>\
\
</svg>\
</div>\
</body>\
</html>\

setstate powerGrid 2024-10-31 11:22:56 airdryer_v 210
setstate powerGrid 2024-10-31 11:13:29 batteryState_v houseUnload
setstate powerGrid 2024-10-31 11:21:32 battery_p 33
setstate powerGrid 2024-10-31 11:14:29 battery_v 33
setstate powerGrid 2024-10-31 11:22:59 dishwasher_v 0
setstate powerGrid 2024-10-31 11:24:35 dryer_v 0
setstate powerGrid 2024-10-31 11:24:26 fridge_v 76
setstate powerGrid 2024-10-31 11:24:41 grid_v 489
setstate powerGrid 2024-10-31 11:24:41 house_v 724.1
setstate powerGrid 2024-10-31 11:12:09 lowcarbon_v 9
setstate powerGrid 2024-10-31 11:24:44 solar_v 235.1
setstate powerGrid 2024-10-31 11:24:34 washer_v 0



2. Mein DOIF
Code Auswählen
defmod Powergrid_DOIF DOIF ## Grid + House\
([MQTT2_Smartmeter_2E1F50:"APOX_Power"])\
        ( set powerGrid grid_v {(ReadingsNum("MQTT2_Smartmeter_2E1F50","APOX_Power",0))} )\
        ( set powerGrid house_v {(ReadingsVal("MQTT2_Smartmeter_2E1F50","APOX_Power",0) + ReadingsVal("MQTT2_OpenDTU_585584","power",0))} ) \
\
## Airdryer\
DOELSEIF  ([Luftentfeuchter:"ENERGY_Power"])\
        ( set powerGrid airdryer_v {(ReadingsNum("Luftentfeuchter","ENERGY_Power",0))} )\
\
## Dishwasher\
DOELSEIF  ([MQTT2_zigbee_Geschirrspueler:"power"])\
        ( set powerGrid dishwasher_v {(ReadingsNum("MQTT2_zigbee_Geschirrspueler","power",0))} )\
\
## Dryer\
DOELSEIF  ([MQTT2_zigbee_Trockner:"power"])\
        ( set powerGrid dryer_v {(ReadingsNum("MQTT2_zigbee_Trockner","power",0))} )\
\
## Fridge\
DOELSEIF  ([MQTT2_zigbee_Kuehlschrank:"^power:.*$"])\
        ( set powerGrid fridge_v {(ReadingsNum("MQTT2_zigbee_Kuehlschrank","power",0))} )\
\
## Solar\
DOELSEIF   ([MQTT2_OpenDTU_585584:"power"] )\
        ( set powerGrid solar_v {(ReadingsNum("MQTT2_OpenDTU_585584","power",0))} )\
\
## Washer\
DOELSEIF  ([MQTT2_zigbee_Waschmaschine:"power"])\
        ( set powerGrid washer_v {(ReadingsNum("MQTT2_zigbee_Waschmaschine","power",0))} )\


setstate Powergrid_DOIF cmd_6
setstate Powergrid_DOIF 2024-10-31 11:28:52 Device MQTT2_OpenDTU_585584
setstate Powergrid_DOIF 2024-10-31 11:28:37 cmd 6
setstate Powergrid_DOIF 2024-10-31 11:28:37 cmd_event MQTT2_OpenDTU_585584
setstate Powergrid_DOIF 2024-10-31 11:28:37 cmd_nr 6
setstate Powergrid_DOIF 2024-10-31 11:27:56 e_Luftentfeuchter_events ENERGY_Voltage: 221,ENERGY_Period: 17,ENERGY_Power: 210,ENERGY_Current: 1.498,ENERGY_Factor: 0.63,ENERGY_Yesterday: 0.604,Time: 2024-10-31T12:27:55,ENERGY_Total: 77.216,ENERGY_TotalStartTime: 2024-08-17T10:11:53,ENERGY_ApparentPower: 331,ENERGY_Today: 0.193,ENERGY_ReactivePower: 256
setstate Powergrid_DOIF 2024-10-31 11:28:52 e_MQTT2_OpenDTU_585584_events 116483796003_0_efficiency: 95.247,ForecastToday: 6592 Wh,ForecastTomorrow: 4486 Wh
setstate Powergrid_DOIF 2024-10-31 11:28:37 e_MQTT2_Smartmeter_2E1F50_events StatusSNS_APOX_E_in: 407.821,StatusSNS_APOX_Power: 568,StatusSNS_Time: 2024-10-31T11:28:36
setstate Powergrid_DOIF 2024-10-31 11:28:19 e_MQTT2_zigbee_Geschirrspueler_events current: 0,linkquality: 216,on,voltage: 229,power_outage_memory: restore,energy: 11.15,last_seen: 2024-10-31T11:28:19+01:00,child_lock: UNLOCK,power: 0,countdown: 0,indicator_mode: off/on
setstate Powergrid_DOIF 2024-10-31 11:27:59 e_MQTT2_zigbee_Kuehlschrank_events last_seen: 2024-10-31T11:27:59+01:00,current: 0.37,ON,voltage: 225,child_lock: UNLOCK,linkquality: 172,power: 76,countdown: 0,indicator_mode: off/on,power_outage_memory: restore,energy: 17.98
setstate Powergrid_DOIF 2024-10-31 11:28:28 e_MQTT2_zigbee_Trockner_events energy: 213.93,power_outage_memory: restore,update_state: available,update_installed_version: 77,voltage: 230,on,linkquality: 132,current: 0.03,update_latest_version: 192,indicator_mode: off/on,countdown: 0,power: 15,child_lock: UNLOCK,last_seen: 2024-10-31T11:28:28+01:00
setstate Powergrid_DOIF 2024-10-31 11:27:23 e_MQTT2_zigbee_Waschmaschine_events indicator_mode: off/on,countdown: 0,last_seen: 2024-10-31T11:27:23+01:00,power: 0,child_lock: UNLOCK,power_outage_memory: restore,energy: 248.71,current: 0,update_latest_version: 192,update_state: available,update_installed_version: 77,on,voltage: 228,linkquality: 124
setstate Powergrid_DOIF 2024-10-29 22:09:44 mode enabled
setstate Powergrid_DOIF 2024-10-31 11:28:37 state cmd_6




Gruß schwatter

carlos

#16
31 Oktober 2024, 13:26:30
So langsam ist es perfekt.
Sieht richtig gut aus.
Danke dir.
denkst du noch an
Zitat2. Bei Grid evtl gleich 3 Werte:
   Momentaner Grid Export/import mit + oder -
   Heutiger Export
   Heutiger Import

Hier würde ich gerne zugunsten des aktuellen Preises(z.B. von Tibber) auf den heutigen Export/Import verzichten wollen.

Ansonsten gute Arbeit.

Gruß

Hubert
FHEM svn auf Intel NUC mit proxmox, 3 Raspberry Pi, signalduino, nanoCUL,  toom Baumarkt Funksteckdosen, einige sonoffs, hue, shelly

schwatter

#17
31 Oktober 2024, 19:33:25
Nabend,

ah super. Dann kommen endlich die Werte.
Hatte schon gedacht, ich hab etwas vermurkst.

Bei der Batterie bin ich mir noch unschlüssig.
- so lassen.
- maximal 2 Werte im Ring.
- 3 Werte im Ring, Namen außerhalb. Dann für alle.
- extra Readings unter dem Grid, für alles mögliche.

Gruß schwatter

schwatter

#18
08 November 2024, 20:47:32 Letzte Bearbeitung: 09 November 2024, 19:31:31 von schwatter
Nabend,

ich habe einen Kompromiss aus beiden zusammengebaut. Falls es doof aussieht, würde ich die animierten Ringe Haus und Batterie
demnächst versuchen, auch auf animierte Kästen umzubauen. Ganz zufrieden bin ich noch nicht.

Update:
- Grid, Solar, Fridge und Washer auf Kasten mit abgerundeten Ecken umgebaut.
- Grid hat dadurch jetzt 3 Werte (grid_v, grid_in_v, grid_out_v)
- Im JS habe ich die 2 neuen Werte grid_in_v und grid_out_v auf eine Nachkommastelle begrenzt.
- Außerdem sind die angezeigten Bezeichnungen ausnahmsweise kWh. Da mein SmartMeterReader die Werte so ausgibt.
Umrechnen möchte ich nicht, da es Platz spart.

Wer das anpassen möchte im JS, hier sind die Stellen:

Code Auswählen
        const gridReadingIn = parseFloat(parseFloat(doc.querySelector("div[informid='powerGrid-grid_in_v']").textContent).toFixed(1));
        const gridReadingOut = parseFloat(parseFloat(doc.querySelector("div[informid='powerGrid-grid_out_v']").textContent).toFixed(1));


        document.getElementById('gridPowerIn').textContent = gridReadingIn + " kWh";
        document.getElementById('gridPowerOut').textContent = gridReadingOut + " kWh";


1.dummyNew
Code Auswählen
defmod powerGrid dummyNew
attr powerGrid readingList airdryer_v battery_v battery_p batteryState_v dishwasher_v dryer_v fridge_v grid_v grid_in_v grid_out_v house_v lowcarbon_v solar_v solarToBattery_v washer_v
attr powerGrid room Energy1
attr powerGrid setList airdryer_v:textField battery_v:textField battery_p:textField batteryState_v:select,stop,gridLoad,gridUnload,solarLoad,houseUnload dishwasher_v:textField dryer_v:textField fridge_v:textField grid_v:textField grid_in_v:textField grid_out_v:textField house_v:textField lowcarbon_v:textField solar_v:textField washer_v:textField
attr powerGrid stateFormat <!DOCTYPE html>\
<html>\
<head>\
<title>powerGrid</title>\
<style>\
#wrapper {\
    background: black;;\
}\
svg {\
    width: 100%;;\
    height: auto;;\
}\
</style>\
</head>\
<body>\
\
<div id="wrapper">\
<svg viewBox="0 0 650 500" xmlns="http://www.w3.org/2000/svg" style="background-color: black;; width: 90%;; height: auto;;">\
 \
 <!-- Titel -->\
  <text x="20" y="30" font-family="Arial" font-size="24" fill="white">Power Flow</text>\
\
  <!-- Kohlenstoffarm (Grün) -->\
  <circle id="lowCarbonCircle" cx="100" cy="100" r="45" fill="none" stroke="green" stroke-width="10" opacity="0.4"/>\
  <circle cx="100" cy="100" r="40" fill="none" stroke="green" stroke-width="5"/>\
  <text x="100" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Low-Carbon</text>\
  <text id="lowCarbonPower" x="100" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">0 %</text>\
\
  <!-- Solar (Orange) - Glow Kasten -->\
  <rect x="205" y="55" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="orange" stroke-width="10"/>\
  <rect x="210" y="60" rx="20" ry="20" width="80" height="80" fill="none" stroke="orange" stroke-width="5" />\
  <text x="250" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Solar</text>\
  <text id="solarPower" x="250" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Netz (Blau) -->\
  <rect x="55" y="205" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="blue" stroke-width="10"/>\
  <rect x="60" y="210" rx="20" ry="20" width="80" height="80" fill="none" stroke="blue" stroke-width="5" />  \
  <text id="gridPower" x="100" y="235" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text x="100" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Grid</text>\
  <text id="gridPowerIn" x="100" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="gridPowerOut" x="100" y="280" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie Label -->\
  <text x="250" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Battery</text>\
  <text id="batteryPower" x="250" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="batteryPercent" x="250" y="385" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie stop (Turkis) -->\
  <circle id="batteryCircle" cx="250" cy="400" r="45" fill="none" stroke="turquoise" stroke-width="10" opacity="0.4"/>\
  <circle id="batteryStatic" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5"/>\
\
  <!-- Batterie dreht links -->\
  <circle id="batteryClockwise" cx="250" cy="400" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Batteriering dreht rechts -->\
  <circle id="batteryCounterClockwise" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="-360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Haus + Ringsegmente -->\
  <circle id="houseCircle" cx="400" cy="250" r="45" fill="none" stroke="purple" stroke-width="10" opacity="0.4"/>\
  <circle id="solarSegment" cx="400" cy="250" r="40" fill="none" stroke="orange" stroke-width="5" stroke-dasharray="0 100" />\
  <circle id="gridSegment" cx="400" cy="250" r="40" fill="none" stroke="blue" stroke-width="5" stroke-dasharray="0 100" />\
  <circle id="batterySegment" cx="400" cy="250" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="0 100" />\
  <text x="400" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">House</text>\
  <text id="housePower" x="400" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Lufttrockner (Blau) -->\
  <circle id="airDryerCircle" cx="400" cy="100" r="45" fill="none" stroke="blue" stroke-width="10" opacity="0.4"/>\
  <circle cx="400" cy="100" r="40" fill="none" stroke="blue" stroke-width="5"/>\
  <text x="400" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Airdryer</text>\
  <text id="airdryerPower" x="400" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Kühlschrank (Gelb) -->\
  <rect x="355" y="355" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="yellow" stroke-width="10"/>\
  <rect x="360" y="360" rx="20" ry="20" width="80" height="80" fill="none" stroke="yellow" stroke-width="5" />\
  <text x="400" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Fridge</text>\
  <text id="fridgePower" x="400" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Waschmaschine (Gelb) -->\
  <rect x="505" y="55" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="yellow" stroke-width="10"/>\
  <rect x="510" y="60" rx="20" ry="20" width="80" height="80" fill="none" stroke="yellow" stroke-width="5" />\
  <text x="550" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Washer</text>\
  <text id="washerPower" x="550" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Trockner (Grün) -->\
  <circle id="dryerCircle" cx="550" cy="250" r="45" fill="none" stroke="green" stroke-width="10" opacity="0.4"/>\
  <circle cx="550" cy="250" r="40" fill="none" stroke="green" stroke-width="5"/>\
  <text x="550" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Dryer</text>\
  <text id="dryerPower" x="550" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Geschirrspüler (Blau) -->\
  <circle id="dishwasherCircle" cx="550" cy="400" r="45" fill="none" stroke="blue" stroke-width="10" opacity="0.4"/>\
  <circle cx="550" cy="400" r="40" fill="none" stroke="blue" stroke-width="5"/>\
  <text x="550" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Dishwasher</text>\
  <text id="dishwasherPower" x="550" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Verbindungslinien -->\
\
  <!-- Verbindungslinie von Batterie zu Haus (Lila) --> \
  <path id="batteryToHousePath" d="M 260 354 A 110 100 0 0 1 357 260" stroke="purple" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="purple">\
    <animateMotion id="batteryToHouse" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#batteryToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Haus (Orange) -->\
  <path id="solarToHousePath" d="M 260 145 A 110 100 0 0 0 357 240" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToHouse" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Batterie (Orange) -->\
  <path id="solarToBatteryPath" d="M 250 145 A 0 100 0 0 1 250 354" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToBattery" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToBatteryPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Lufttrockner (Blau) -->\
  <path id="houseToAirdryerPath" d="M 400 203 A 0 67 0 0 1 400 145" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="houseToAirdryer" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToAirdryerPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Kühlschrank (Gelb) -->\
  <path id="houseToFridgePath" d="M 400 298 A 0 67 0 0 1 400 354" stroke="yellow" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="yellow">\
    <animateMotion id="houseToFridge" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToFridgePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Kohlenstoffarm (Grün) -->\
  <path id="gridToLowCarbonPath" d="M 100 208 A 0 68 0 0 1 100 145" stroke="green" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="green">\
    <animateMotion id="gridToLowCarbon" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#gridToLowCarbonPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Haus (Blau) -->\
  <path id="gridToHousePath" d="M 146 250 H 357" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="gridToHouse" dur="3s" repeatCount="indefinite">\
      <mpath href="#gridToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Trockner (Green) -->\
  <path id="houseToDryerPath" d="M 446 250 A 0 0 0 0 1 505 250" stroke="green" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="green">\
    <animateMotion id="houseToDryer" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToDryerPath"/>\
    </animateMotion>\
  </circle>\
\
    <!-- Verbindungslinie von Haus zu Waschmaschine (Gelb) -->\
  <path id="houseToWasherPath" d="M 446 240 A 110 110 0 0 0 550 145" stroke="yellow" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="yellow">\
    <animateMotion id="houseToWasher" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToWasherPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Geschirrspüler (Blue) -->\
  <path id="houseToDishwasherPath" d="M 446 260 A 110 110 0 0 1 550 354" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="houseToDishwasher" dur="3s" repeatCount="indefinite">\
      <mpath href="#houseToDishwasherPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Netz (Orange) -->\
  <path id="solarToGridPath" d="M 240 145 A 110 100 0 0 1 146 240" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToGrid" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToGridPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Batterie (Turkis) -->\
  <path id="gridToBatteryPath" d="M 146 260 A 110 100 0 0 1 240 354" stroke="turquoise" stroke-width="2" fill="transparent"/>\
  <circle id="gridToBatteryStatic" r="5" fill="turquoise" style="display:none;;" />\
  <circle id="gridToBatteryForward" r="5" fill="turquoise" style="display:none;;">\
    <animateMotion id="gridToBatteryForwardAnim" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#gridToBatteryPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Batterie zu Netz (Turkis) -->\
  <path id="batteryToGridPath" d="M 240 354 A 110 100 0 0 0 146 260" stroke="turquoise" stroke-width="2" fill="transparent"/>\
  <circle id="batteryToGridForward" r="5" fill="turquoise" style="display:none;;">\
    <animateMotion id="batteryToGridForwardAnim" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#batteryToGridPath"/>\
    </animateMotion>\
  </circle>\
\
</svg>\
</div>\
</body>\
</html>

setstate powerGrid <!DOCTYPE html>\
<html>\
<head>\
<title>powerGrid</title>\
<style>\
#wrapper {\
    background: black;;\
}\
svg {\
    width: 100%;;\
    height: auto;;\
}\
</style>\
</head>\
<body>\
\
<div id="wrapper">\
<svg viewBox="0 0 650 500" xmlns="http://www.w3.org/2000/svg" style="background-color: black;; width: 90%;; height: auto;;">\
 \
 <!-- Titel -->\
  <text x="20" y="30" font-family="Arial" font-size="24" fill="white">Power Flow</text>\
\
  <!-- Kohlenstoffarm (Grün) -->\
  <circle id="lowCarbonCircle" cx="100" cy="100" r="45" fill="none" stroke="green" stroke-width="10" opacity="0.4"/>\
  <circle cx="100" cy="100" r="40" fill="none" stroke="green" stroke-width="5"/>\
  <text x="100" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Low-Carbon</text>\
  <text id="lowCarbonPower" x="100" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">0 %</text>\
\
  <!-- Solar (Orange) - Glow Kasten -->\
  <rect x="205" y="55" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="orange" stroke-width="10"/>\
  <rect x="210" y="60" rx="20" ry="20" width="80" height="80" fill="none" stroke="orange" stroke-width="5" />\
  <text x="250" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Solar</text>\
  <text id="solarPower" x="250" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Netz (Blau) -->\
  <rect x="55" y="205" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="blue" stroke-width="10"/>\
  <rect x="60" y="210" rx="20" ry="20" width="80" height="80" fill="none" stroke="blue" stroke-width="5" />  \
  <text id="gridPower" x="100" y="235" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text x="100" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Grid</text>\
  <text id="gridPowerIn" x="100" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="gridPowerOut" x="100" y="280" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie Label -->\
  <text x="250" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Battery</text>\
  <text id="batteryPower" x="250" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
  <text id="batteryPercent" x="250" y="385" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Batterie stop (Turkis) -->\
  <circle id="batteryCircle" cx="250" cy="400" r="45" fill="none" stroke="turquoise" stroke-width="10" opacity="0.4"/>\
  <circle id="batteryStatic" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5"/>\
\
  <!-- Batterie dreht links -->\
  <circle id="batteryClockwise" cx="250" cy="400" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Batteriering dreht rechts -->\
  <circle id="batteryCounterClockwise" cx="250" cy="400" r="40" fill="none" stroke="turquoise" stroke-width="5" stroke-dasharray="9 5" stroke-dashoffset="3" style="display:none;;">\
    <animateTransform attributeName="transform" type="rotate" from="0 250 400" to="-360 250 400" dur="5s" repeatCount="indefinite" />\
  </circle>\
\
  <!-- Haus + Ringsegmente -->\
  <circle id="houseCircle" cx="400" cy="250" r="45" fill="none" stroke="purple" stroke-width="10" opacity="0.4"/>\
  <circle id="solarSegment" cx="400" cy="250" r="40" fill="none" stroke="orange" stroke-width="5" stroke-dasharray="0 100" />\
  <circle id="gridSegment" cx="400" cy="250" r="40" fill="none" stroke="blue" stroke-width="5" stroke-dasharray="0 100" />\
  <circle id="batterySegment" cx="400" cy="250" r="40" fill="none" stroke="purple" stroke-width="5" stroke-dasharray="0 100" />\
  <text x="400" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">House</text>\
  <text id="housePower" x="400" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Lufttrockner (Blau) -->\
  <circle id="airDryerCircle" cx="400" cy="100" r="45" fill="none" stroke="blue" stroke-width="10" opacity="0.4"/>\
  <circle cx="400" cy="100" r="40" fill="none" stroke="blue" stroke-width="5"/>\
  <text x="400" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Airdryer</text>\
  <text id="airdryerPower" x="400" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Kühlschrank (Gelb) -->\
  <rect x="355" y="355" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="yellow" stroke-width="10"/>\
  <rect x="360" y="360" rx="20" ry="20" width="80" height="80" fill="none" stroke="yellow" stroke-width="5" />\
  <text x="400" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Fridge</text>\
  <text id="fridgePower" x="400" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Waschmaschine (Gelb) -->\
  <rect x="505" y="55" rx="25" ry="25" width="90" height="90" fill="none" opacity="0.3" stroke="yellow" stroke-width="10"/>\
  <rect x="510" y="60" rx="20" ry="20" width="80" height="80" fill="none" stroke="yellow" stroke-width="5" />\
  <text x="550" y="100" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Washer</text>\
  <text id="washerPower" x="550" y="115" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Trockner (Grün) -->\
  <circle id="dryerCircle" cx="550" cy="250" r="45" fill="none" stroke="green" stroke-width="10" opacity="0.4"/>\
  <circle cx="550" cy="250" r="40" fill="none" stroke="green" stroke-width="5"/>\
  <text x="550" y="250" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Dryer</text>\
  <text id="dryerPower" x="550" y="265" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Geschirrspüler (Blau) -->\
  <circle id="dishwasherCircle" cx="550" cy="400" r="45" fill="none" stroke="blue" stroke-width="10" opacity="0.4"/>\
  <circle cx="550" cy="400" r="40" fill="none" stroke="blue" stroke-width="5"/>\
  <text x="550" y="400" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle">Dishwasher</text>\
  <text id="dishwasherPower" x="550" y="415" font-family="Arial" font-size="12" fill="white" text-anchor="middle" alignment-baseline="middle"></text>\
\
  <!-- Verbindungslinien -->\
\
  <!-- Verbindungslinie von Batterie zu Haus (Lila) --> \
  <path id="batteryToHousePath" d="M 260 354 A 110 100 0 0 1 357 260" stroke="purple" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="purple">\
    <animateMotion id="batteryToHouse" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#batteryToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Haus (Orange) -->\
  <path id="solarToHousePath" d="M 260 145 A 110 100 0 0 0 357 240" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToHouse" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Batterie (Orange) -->\
  <path id="solarToBatteryPath" d="M 250 145 A 0 100 0 0 1 250 354" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToBattery" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToBatteryPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Lufttrockner (Blau) -->\
  <path id="houseToAirdryerPath" d="M 400 203 A 0 67 0 0 1 400 145" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="houseToAirdryer" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToAirdryerPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Kühlschrank (Gelb) -->\
  <path id="houseToFridgePath" d="M 400 298 A 0 67 0 0 1 400 354" stroke="yellow" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="yellow">\
    <animateMotion id="houseToFridge" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToFridgePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Kohlenstoffarm (Grün) -->\
  <path id="gridToLowCarbonPath" d="M 100 208 A 0 68 0 0 1 100 145" stroke="green" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="green">\
    <animateMotion id="gridToLowCarbon" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#gridToLowCarbonPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Haus (Blau) -->\
  <path id="gridToHousePath" d="M 146 250 H 357" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="gridToHouse" dur="3s" repeatCount="indefinite">\
      <mpath href="#gridToHousePath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Trockner (Green) -->\
  <path id="houseToDryerPath" d="M 446 250 A 0 0 0 0 1 505 250" stroke="green" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="green">\
    <animateMotion id="houseToDryer" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToDryerPath"/>\
    </animateMotion>\
  </circle>\
\
    <!-- Verbindungslinie von Haus zu Waschmaschine (Gelb) -->\
  <path id="houseToWasherPath" d="M 446 240 A 110 110 0 0 0 550 145" stroke="yellow" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="yellow">\
    <animateMotion id="houseToWasher" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#houseToWasherPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Haus zu Geschirrspüler (Blue) -->\
  <path id="houseToDishwasherPath" d="M 446 260 A 110 110 0 0 1 550 354" stroke="blue" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="blue">\
    <animateMotion id="houseToDishwasher" dur="3s" repeatCount="indefinite">\
      <mpath href="#houseToDishwasherPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Solar zu Netz (Orange) -->\
  <path id="solarToGridPath" d="M 240 145 A 110 100 0 0 1 146 240" stroke="orange" stroke-width="2" fill="transparent"/>\
  <circle r="5" fill="orange">\
    <animateMotion id="solarToGrid" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#solarToGridPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Netz zu Batterie (Turkis) -->\
  <path id="gridToBatteryPath" d="M 146 260 A 110 100 0 0 1 240 354" stroke="turquoise" stroke-width="2" fill="transparent"/>\
  <circle id="gridToBatteryStatic" r="5" fill="turquoise" style="display:none;;" />\
  <circle id="gridToBatteryForward" r="5" fill="turquoise" style="display:none;;">\
    <animateMotion id="gridToBatteryForwardAnim" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#gridToBatteryPath"/>\
    </animateMotion>\
  </circle>\
\
  <!-- Verbindungslinie von Batterie zu Netz (Turkis) -->\
  <path id="batteryToGridPath" d="M 240 354 A 110 100 0 0 0 146 260" stroke="turquoise" stroke-width="2" fill="transparent"/>\
  <circle id="batteryToGridForward" r="5" fill="turquoise" style="display:none;;">\
    <animateMotion id="batteryToGridForwardAnim" dur="3s" repeatCount="indefinite" keyPoints="0;;1" keyTimes="0;;1">\
      <mpath href="#batteryToGridPath"/>\
    </animateMotion>\
  </circle>\
\
</svg>\
</div>\
</body>\
</html>
setstate powerGrid 2024-11-09 19:27:38 airdryer_v 0
setstate powerGrid 2024-11-09 19:28:25 batteryState_v stop
setstate powerGrid 2024-11-01 12:43:15 battery_p 100
setstate powerGrid 2024-11-01 12:43:35 battery_v 0
setstate powerGrid 2024-11-09 19:28:38 dishwasher_v 0
setstate powerGrid 2024-11-09 19:29:17 dryer_v 0
setstate powerGrid 2024-11-09 19:28:12 fridge_v 0
setstate powerGrid 2024-11-09 19:29:14 grid_in_v 485.170
setstate powerGrid 2024-11-09 19:29:14 grid_out_v 81.575
setstate powerGrid 2024-11-09 19:29:14 grid_v 364
setstate powerGrid 2024-11-09 19:29:14 house_v 364
setstate powerGrid 2024-11-03 17:52:47 lowcarbon_v 0
setstate powerGrid 2024-11-09 19:29:15 solar_v 0
setstate powerGrid 2024-11-09 19:29:16 washer_v 0



2. Mein DOIF

Code Auswählen
defmod Powergrid_DOIF DOIF ## Grid + House\
([MQTT2_Smartmeter_2E1F50:"APOX_Power"])\
        ( set powerGrid grid_v {(ReadingsNum("MQTT2_Smartmeter_2E1F50","APOX_Power",0))} )\
        ( set powerGrid grid_in_v {(ReadingsNum("MQTT2_Smartmeter_2E1F50","APOX_E_in",0))} )\
        ( set powerGrid grid_out_v {(ReadingsNum("MQTT2_Smartmeter_2E1F50","APOX_E_out",0))} )\
        ( set powerGrid house_v {(ReadingsVal("MQTT2_Smartmeter_2E1F50","APOX_Power",0) + ReadingsVal("MQTT2_OpenDTU_585584","power",0))} ) \
\
## Airdryer\
DOELSEIF  ([Luftentfeuchter:"ENERGY_Power"])\
        ( set powerGrid airdryer_v {(ReadingsNum("Luftentfeuchter","ENERGY_Power",0))} )\
\
## Dishwasher\
DOELSEIF  ([MQTT2_zigbee_Geschirrspueler:"power"])\
        ( set powerGrid dishwasher_v {(ReadingsNum("MQTT2_zigbee_Geschirrspueler","power",0))} )\
\
## Dryer\
DOELSEIF  ([MQTT2_zigbee_Trockner:"power"])\
        ( set powerGrid dryer_v {(ReadingsNum("MQTT2_zigbee_Trockner","power",0))} )\
\
## Fridge\
DOELSEIF  ([MQTT2_zigbee_Kuehlschrank:"^power:.*$"])\
        ( set powerGrid fridge_v {(ReadingsNum("MQTT2_zigbee_Kuehlschrank","power",0))} )\
\
## Solar\
DOELSEIF   ([MQTT2_OpenDTU_585584:"power"] )\
        ( set powerGrid solar_v {(ReadingsNum("MQTT2_OpenDTU_585584","power",0))} )\
\
## Washer\
DOELSEIF  ([MQTT2_zigbee_Waschmaschine:"power"])\
        ( set powerGrid washer_v {(ReadingsNum("MQTT2_zigbee_Waschmaschine","power",0))} )\


setstate Powergrid_DOIF cmd_6
setstate Powergrid_DOIF 2024-11-08 20:35:49 Device MQTT2_OpenDTU_585584
setstate Powergrid_DOIF 2024-11-08 20:35:49 cmd 6
setstate Powergrid_DOIF 2024-11-08 20:35:49 cmd_event MQTT2_OpenDTU_585584
setstate Powergrid_DOIF 2024-11-08 20:35:49 cmd_nr 6
setstate Powergrid_DOIF 2024-11-08 20:32:40 e_Luftentfeuchter_events ENERGY_Period: 0,ENERGY_Today: 0.447,ENERGY_TotalStartTime: 2024-08-17T10:11:53,ENERGY_ApparentPower: 0,ENERGY_Yesterday: 0.516,ENERGY_Current: 0.000,ENERGY_Factor: 0.00,Time: 2024-11-08T21:32:40,ENERGY_ReactivePower: 0,ENERGY_Power: 0,ENERGY_Total: 82.747,ENERGY_Voltage: 0
setstate Powergrid_DOIF 2024-11-08 20:35:49 e_MQTT2_OpenDTU_585584_events is_valid: 1,ForecastToday: 864 Wh,ForecastTomorrow: 8497 Wh
setstate Powergrid_DOIF 2024-11-08 20:35:39 e_MQTT2_Smartmeter_2E1F50_events StatusSNS_APOX_Power: 264,StatusSNS_APOX_E_in: 475.202,StatusSNS_Time: 2024-11-08T20:35:39
setstate Powergrid_DOIF 2024-11-08 20:35:47 e_MQTT2_zigbee_Geschirrspueler_events on,last_seen: 2024-11-08T20:35:47+01:00,linkquality: 236,power_outage_memory: restore,energy: 14.1,power: 0,countdown: 0,indicator_mode: off/on,voltage: 226,current: 0,child_lock: UNLOCK
setstate Powergrid_DOIF 2024-11-08 20:33:13 e_MQTT2_zigbee_Kuehlschrank_events energy: 23.54,power: 0,power_outage_memory: restore,linkquality: 188,ON,last_seen: 2024-11-08T20:33:13+01:00,current: 0,child_lock: UNLOCK,voltage: 226,indicator_mode: off/on,countdown: 0
setstate Powergrid_DOIF 2024-11-08 20:35:12 e_MQTT2_zigbee_Trockner_events countdown: 0,child_lock: UNLOCK,voltage: 226,update_state: available,on,energy: 215.15,linkquality: 140,indicator_mode: off/on,current: 0,update_installed_version: 77,last_seen: 2024-11-08T20:35:12+01:00,update_latest_version: 192,power_outage_memory: restore,power: 0
setstate Powergrid_DOIF 2024-11-08 20:35:44 e_MQTT2_zigbee_Waschmaschine_events on,linkquality: 116,energy: 251.09,countdown: 0,voltage: 229,update_state: available,child_lock: UNLOCK,last_seen: 2024-11-08T20:35:44+01:00,update_latest_version: 192,update_installed_version: 77,power_outage_memory: restore,power: 0,indicator_mode: off/on,current: 0
setstate Powergrid_DOIF 2024-11-08 20:12:30 mode enabled
setstate Powergrid_DOIF 2024-11-08 20:35:49 state cmd_6



Gruß schwatter

schwatter

#19
09 November 2024, 17:56:08 Letzte Bearbeitung: 09 November 2024, 18:05:31 von schwatter
Tag,

ich musste das SVG, bzw die Linie von Haus zu Waschmaschine fixen. Ich hatte die Linie damals falschherum gebaut.
Sprich der Startpunkt war an der Waschmaschine und bewegte sich zum Haus. Als Workaround hatte ich keyPoints="1;0" gesetzt.
Jetzt gerade ist mir aufgefallen, alle meine Browser kommen damit klar. Aber Fully auf meinem Tablet nicht...
Daher, Linie drehen und keyPoints="0;1". 

Das Update ist einen Post höher in der Raw von 1.dummyNew.

edit:
Bei gridUnload ist bei Fully der selbe Effekt. Der Startpunkt ist bei Grid. Bei Batterie laden ist die Animation zur Batterie. Bei entladen ins Netzt aber auch zur Batterie...
Am PC mit Chrome ist es ok.

Gruß schwatter

schwatter

#20
09 November 2024, 19:36:29
Und noch ein Update.

Wegen Fully musste ich eine identische Linie von Batterie zu Netz einfügen. Die beiden Linien sind überlagert und haben
unterschiedliche Startpunkte. Einen Fehler im JS, welcher eine Linie nicht abgeschaltet hat, habe ich auch noch entdeckt
und gefixt.

Die Änderungen sind in Post #18 eingeflossen.

Gruß schwatter

schwatter

#21
10 November 2024, 16:08:19
Nabend,

ich habe jetzt Low-Carbon mit eingebunden.

- Im SVG umbenannt in FossilFree
- Ein HTTPMOD zum auslesen erstellt
- Die Linie zu FossilFree musste ich nochmal drehen. Der animierte Punkt wandert nun von FossilFree zu Grid
- Der animierte Punkt wird jetzt nur vom JS angesteuert, wenn Grid > 0 ist oder die Batterie den Status gridLoad hat.

Im Moment nutze ich nur noch den modifizierten Dummy. Deshalb habe ich alles im ersten Post daraufhin überarbeitet.

Gruß schwatter

schwatter

#22
14 November 2024, 18:55:39
Nabend

Update im ersten Post. Geändert dummy + svg_update.js

- Das SVG wieder auf viele Ringe geändert. Außer Grid.
- Neue Farben.
- Verbindungslinie von Netz zu Haus und Solar zu Batterie vermischt. Damit der animierte Punkt von Solar zu Batterie nicht mehr drunter fährt.
- JS angepasst. Jetzt verschwinden die Punkte bei Stop und ruhen nicht mehr.

Gruß schwatter

ch.eick

#23
16 November 2024, 08:58:40
Hallo zusammen,
tolle Arbeit!

Ich verwende seit geraumer Zeit das doif im Perl Modus, da stecken extrem viele Möglichkeiten in Bezug auf GUI drin und andere Devices wie das Dummy  fallen weg.

Als Beispiel von mir schaut euch mal das WR_1_ctl an. Da habe ich
- Diagramme im uiState
- Pulldown Menüs im uiState
- Statistiken im uiTable
drin.

Wenn man da das Flowchart ins stateFormat unter kriegen könnte wäre alles schön zusammen.

Ein Bild kommt gleich...

VG Christian
RPI4; Docker; CUNX; Eltako FSB61NP; SamsungTV H-Serie; Sonos; Vallox; Luxtronik; 3x FB7490; Stromzähler mit DvLIR; wunderground; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP
Contrib: https://svn.fhem.de/trac/browser/trunk/fhem/contrib/ch.eick

schwatter

#24
16 November 2024, 10:29:36
Morgen,

das freut mich. Ich bin auch der Freund von "alles in einem Device". Aber manchmal muss man akzeptieren, das das nicht
immer harmonisch zusammen funktioniert. Deswegen habe ich den dummy im ersten Post modifiziert, damit ein refresh des
STATE unterdrückt wird. Bzw, werden alle Werte im Hintergrund gesetzt, aber die Seitenansicht wird nicht neu geladen.
Ohne das, werden die Animationen unterbrochen und starten abrupt von vorne.

Bei DOIF oder auch dummy ist es bis jetzt nicht möglich, das zu unterbinden. Das SVG ist quasi nur ein stiller Platzhalter, welcher vom JS gefüttert wird.

Falls du es mit deinem DOIF zusammen benutzen willst, würde ich dir attr subType vorschlagen. Nutz du für alle Devices den
selben subType, sieht es so aus, als wenn diese zusammengehören.


Gruß schwatter

ch.eick

#25
16 November 2024, 11:52:36 Letzte Bearbeitung: 16 November 2024, 18:32:50 von ch.eick
Zitat von: schwatter am 16 November 2024, 10:29:36Falls du es mit deinem DOIF zusammen benutzen willst, würde ich dir attr subType vorschlagen. Nutz du für alle Devices den
selben subType, sieht es so aus, als wenn diese zusammengehören.
Das attr subType kenne ich noch nicht, muss ich mich mal einlesen, was das bewirkt.

EDIT: Im DOIF Perl Modus kann ich kein attr subType finden und verstehe auch nicht wofür das sein soll.
RPI4; Docker; CUNX; Eltako FSB61NP; SamsungTV H-Serie; Sonos; Vallox; Luxtronik; 3x FB7490; Stromzähler mit DvLIR; wunderground; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP
Contrib: https://svn.fhem.de/trac/browser/trunk/fhem/contrib/ch.eick

schwatter

#26
17 November 2024, 12:13:43
Mahlzeit,

Update im ersten Post. Geändert dummy + svg_update.js

- Nicht existente Readings werden jetzt abgefangen und mit "n/a" gesetzt. Damit ist es leichter, unerwünschte Ringe im SVG zu löschen.
- Batteriering färbt sich je nach Status ein. Zum Beispiel bei solarLoad in gelb.

Gruß schwatter

Wzut

#27
17 November 2024, 13:06:53 Letzte Bearbeitung: 17 November 2024, 13:08:37 von Wzut
Zitat von: schwatter am 27 Oktober 2024, 12:45:07
Code Auswählen
      readingsSingleUpdate($hash, $v, join(" ",@a), 1);
vs.
      readingsBeginUpdate($hash);
      readingsBulkUpdate($hash, $v, join(" ",@a), 1);
      readingsEndUpdate($hash, 0);  # Verhindert das Aktualisieren des STATE


Dadurch kann ich jetzt das aktualisieren des STATE unterdrücken.
schaut man sich den Quellcode von readingsSingleUpdate und readingsBulkUpdate in fhem.pl an, dann stellt man fest das ein readingsSingleUpdate in Wahrheit auch dort der Dreizeiler aus  readingsBeginUpdate , readingsBulkUpdate und readingsEndUpdate ist. Was du meinst mit "aktualisieren des STATE unterdrücken" ist das verhindern eines Events. Das wird durch den vierten Parameter $dotrigger bei readingsSingleUpdate geregelt.
Der wird eine Zeile später als zweiter Parameter direkt an readingsEndUpdate weitergegeben.
D.h. eigenlich müsste es reichen bei Rudis Original nur $dotrigger (1 -> 0) zu ändern :
Code Auswählen
readingsSingleUpdate($hash, $v, join(" ",@a), 0);
Maintainer der Module: MAX, MPD, UbiquitiMP, UbiquitiOut, SIP, BEOK, readingsWatcher

schwatter

#28
17 November 2024, 14:11:19
Vielen Dank, das funktioniert! Ändere ich.

Gruß schwatter

schwatter

#29
17 November 2024, 14:59:46
@ch.eick

Habe gerade erst gesehen, das du per Edit in deinem Post nochmal geantwortet hast.
subType muss in Global gesetzt werden, danach kann ein eigener subType in Devices gesetzt werden.

Code Auswählen
attr global userattr subType
Vorsicht, falls da schon etwas steht, nur ergänzen.

Gruß schwatter
Drucken
Nach oben Seiten 1 2 Alle
Benutzer-Aktionen