Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Steffe.S.]

@SKB

ich habe diesen String als Datenpunkt , der sich Werteanhängig ändert:

<svg viewBox="0 0 100 100" xmlns="www.w3.org" width="100%" height="100%">
        <g transform="rotate(-90 50 50)">
            <!-- Segment 1 (Blau) -->
            <circle cx="50" cy="50" r="40" fill="transparent" 
                stroke="rgb(0,181,221)" stroke-width="5" 
                stroke-dasharray="167.5516081914556 83.77580409572784" 
                stroke-dashoffset="0" stroke-linecap="butt" />
            <!-- Segment 2 (Grün) -->
            <circle cx="50" cy="50" r="40" fill="transparent" 
                stroke="rgb(87,221,46)" stroke-width="5" 
                stroke-dasharray="83.7758040957278 167.55160819145564" 
                stroke-dashoffset="-167.5516081914556" stroke-linecap="butt" />
            <!-- Segment 3 (Grau) -->
            <circle cx="50" cy="50" r="40" fill="transparent" 
                stroke="rgb(115,119,128)" stroke-width="5" 
                stroke-dasharray="0 251.32741228718345" 
                stroke-dashoffset="-251.32741228718342" stroke-linecap="butt" />
        </g>
    </svg>

Mein Frage bezieht sich auf die Darstellung des Strings im Adapter. Da sich der String immer mal wieder ändert, wollte ich wissen, ob ich diesen String auch direkt im Adapter darstellen kann.

Gruss S.

[SKB]

@Steffe.S. Statisch ja - dynamisch nein.

[Steffe.S.]

@SKB sagte in Test Adapter Energiefluss-erweitert v0.8.x GitHub/Latest:

@Steffe.S. Statisch ja - dynamisch nein.

Danke

[wendy2702]

Hallo zusammen,

ich habe zwei Probleme mit dem Adapter die ich aktuell nicht gelöst/erklärt bekomme.

1. Einfache Konfiguration bei einem Freund:

Die Linie zwischen Produktion war gestern animiert, heute plötzlich nicht mehr. Nach einmaligem anklicken der Konfig und erneutem Speichern ist die plötzlich wieder animiert. Gleiches gilt für die Linie zwischen Netz und Verbrauch, gestern animiert, heute kann ich machen was ich will bekomme dort keine Animation mehr hin. Wahrscheinlich sehe ich mittlerweile den Wald vor lauter Bäumen nicht mehr.

Hier das Konfig File.

Spoiler

{
   "basic": {
       "enable_grid": true,
       "enable_animation": false,
       "enable_area_catch": true,
       "enable_config_icon": false,
       "enable_last_id": false,
       "enable_icon_proxy": false,
       "enable_low_performance": false,
       "enable_ds_autocomplete": false,
       "enable_show_coordinates": true,
       "height": 540,
       "width": 530,
       "animation_timer": 1000,
       "background_color": "#424242FF",
       "styles": "",
       "font": {
           "family": "\"Arial\", sans-serif",
           "size": 20,
           "align": "middle"
       },
       "rect": {
           "height": 100,
           "width": 100,
           "corners": 10
       },
       "circle": {
           "radius": 50
       },
       "elm": {
           "stroke_width": 5,
           "pos_x": 50,
           "pos_y": 50
       },
       "icon": {
           "width": 24,
           "height": 24
       },
       "tourVisited": true,
       "enable_line_animation": false
   },
   "calculation": {
       "battery": {
           "dod": 6,
           "capacity": 5,
           "percent": 1,
           "charge": 2,
           "charge_prop": false,
           "discharge": 2,
           "discharge_prop": true
       },
       "consumption": {
           "production": [
               0
           ],
           "gridFeed": 3,
           "gridFeed_prop": true,
           "gridConsume": 3,
           "gridConsume_prop": false,
           "batteryCharge": 2,
           "batteryCharge_prop": false,
           "batteryDischarge": 2,
           "batteryDischarge_prop": true
       }
   },
   "animation": {
       "stroke_dasharray": "10 17 10 17 10  72",
       "stroke_width": 6,
       "animation_duration": 2000,
       "stroke_linecap": "round",
       "animation_timing_function": "linear"
   },
   "animation_configuration": {
       "dots": 3,
       "distance": 17,
       "length": 10
   },
   "line": {
       "stroke_width": 8,
       "stroke": "#000000"
   },
   "elements": {
       "2": {
           "type": "text",
           "align": "middle",
           "subType": "datasource",
           "id": 2,
           "pos_x": 217,
           "pos_y": 42,
           "color": "none",
           "fill": "rgb(255, 206, 74)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 18,
           "degree": 0,
           "text": "ID 2",
           "unit": "W",
           "source": 0,
           "shadow": "",
           "threshold": 0,
           "convert": false,
           "decimal_places": 0,
           "source_option": -1,
           "source_display": "value",
           "action": "none",
           "calculate_kw": "none",
           "frame": "_overlay",
           "source_action": 0
       },
       "5": {
           "type": "rect",
           "id": 5,
           "rx": 10,
           "height": 100,
           "width": 100,
           "pos_x": 167,
           "pos_y": 2,
           "fill": "none",
           "color": "rgb(255, 206, 74)",
           "stroke": 2,
           "shadow": "rgba(0,0,0,0.7)",
           "frame": "_overlay",
           "url": "",
           "fill_value": null,
           "fill_type": "percent",
           "fill_max": null,
           "source": -1
       },
       "6": {
           "type": "icon",
           "id": 6,
           "icon": "mdi:solar-panel",
           "width": 24,
           "height": 24,
           "color": "rgba(0, 0, 0, 0.7)",
           "pos_x": 205,
           "pos_y": 6,
           "shadow": ""
       },
       "7": {
           "type": "rect",
           "id": 7,
           "rx": 10,
           "height": 100,
           "width": 100,
           "pos_x": 407,
           "pos_y": 212,
           "fill": "none",
           "color": "rgb(0, 181, 221)",
           "stroke": 2,
           "shadow": "rgba(0,0,0,0.7)",
           "frame": "_overlay",
           "url": "",
           "fill_value": null,
           "fill_type": "percent",
           "fill_max": null,
           "source": -1,
           "position": 2
       },
       "8": {
           "type": "icon",
           "id": 8,
           "icon": "mdi:battery-high",
           "width": 24,
           "height": 24,
           "color": "rgba(0, 0, 0, 0.7)",
           "pos_x": 84,
           "pos_y": 218,
           "shadow": "",
           "source": 2
       },
       "9": {
           "type": "text",
           "align": "middle",
           "subType": "datasource",
           "id": 9,
           "pos_x": 457,
           "pos_y": 254,
           "color": "none",
           "fill": "rgb(0, 181, 221)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 18,
           "degree": 0,
           "text": "ID 9",
           "unit": "W",
           "source": 4,
           "shadow": "",
           "threshold": 0,
           "convert": false,
           "decimal_places": "0",
           "source_option": -1,
           "source_display": "value",
           "action": "none",
           "calculate_kw": "none",
           "frame": "_overlay",
           "source_action": 4,
           "position": 7
       },
       "10": {
           "type": "text",
           "align": "middle",
           "id": 10,
           "pos_x": 217,
           "pos_y": 75,
           "color": "none",
           "fill": "rgba(0, 0, 0, 0.7)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 14,
           "degree": 0,
           "text": "Produktion",
           "shadow": ""
       },
       "11": {
           "type": "text",
           "align": "middle",
           "id": 11,
           "pos_x": 457,
           "pos_y": 288,
           "color": "none",
           "fill": "rgba(0, 0, 0, 0.7)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 14,
           "degree": 0,
           "text": "Verbrauch",
           "shadow": ""
       },
       "12": {
           "type": "icon",
           "id": 12,
           "icon": "mdi:house-city",
           "width": 24,
           "height": 24,
           "color": "rgba(0, 0, 0, 0.7)",
           "pos_x": 445,
           "pos_y": 218,
           "shadow": ""
       },
       "13": {
           "type": "rect",
           "id": 13,
           "rx": 10,
           "height": 100,
           "width": 100,
           "pos_x": 46,
           "pos_y": 212,
           "fill": "none",
           "color": "rgb(161, 211, 67)",
           "stroke": 2,
           "shadow": "rgba(0,0,0,0.7)",
           "frame": "_overlay",
           "url": "",
           "fill_value": null,
           "fill_type": "percent",
           "fill_max": null,
           "source": 1
       },
       "14": {
           "type": "rect",
           "id": 14,
           "rx": 10,
           "height": 100,
           "width": 100,
           "pos_x": 167,
           "pos_y": 422,
           "fill": "none",
           "color": "rgb(218, 34, 73)",
           "stroke": 2,
           "shadow": "rgba(0,0,0,0.7)",
           "frame": "_overlay",
           "url": "",
           "fill_value": null,
           "fill_type": "percent",
           "fill_max": null,
           "source": -1
       },
       "15": {
           "type": "text",
           "align": "middle",
           "id": 15,
           "pos_x": 96,
           "pos_y": 288,
           "color": "none",
           "fill": "rgba(0, 0, 0, 0.7)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 15,
           "degree": 0,
           "text": "Batterie",
           "shadow": ""
       },
       "16": {
           "type": "text",
           "align": "middle",
           "subType": "datasource",
           "id": 16,
           "pos_x": 96,
           "pos_y": 254,
           "color": "none",
           "fill": "rgb(161, 211, 67)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 20,
           "degree": 0,
           "text": "ID 16",
           "unit": "W",
           "source": 2,
           "shadow": "",
           "threshold": 0,
           "convert": true,
           "decimal_places": "0",
           "source_option": -1,
           "source_display": "value",
           "action": "none",
           "calculate_kw": "none",
           "frame": "_overlay",
           "source_action": 2,
           "position": 3
       },
       "18": {
           "type": "text",
           "align": "middle",
           "subType": "datasource",
           "id": 18,
           "pos_x": 96,
           "pos_y": 272,
           "color": "none",
           "fill": "rgb(161, 211, 67)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 18,
           "degree": 0,
           "text": "ID 18",
           "unit": "%",
           "source": 1,
           "shadow": "",
           "threshold": 0,
           "convert": false,
           "decimal_places": 0,
           "source_option": -1,
           "source_display": "value",
           "action": "none",
           "calculate_kw": "none",
           "frame": "_overlay",
           "source_action": 1
       },
       "19": {
           "type": "text",
           "align": "middle",
           "subType": "datasource",
           "id": 19,
           "pos_x": 217,
           "pos_y": 464,
           "color": "none",
           "fill": "rgb(255, 15, 67)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 18,
           "degree": 0,
           "text": "ID 19",
           "unit": "W",
           "source": 3,
           "shadow": "",
           "threshold": 0,
           "convert": true,
           "decimal_places": "0",
           "source_option": -1,
           "source_display": "value",
           "action": "none",
           "calculate_kw": "none",
           "frame": "_overlay",
           "source_action": 3,
           "position": 1
       },
       "20": {
           "type": "icon",
           "id": 20,
           "icon": "mdi:electricity-from-grid",
           "width": 24,
           "height": 24,
           "color": "rgba(0, 0, 0, 0.7)",
           "pos_x": 205,
           "pos_y": 428,
           "shadow": ""
       },
       "21": {
           "type": "text",
           "align": "middle",
           "id": 21,
           "pos_x": 217,
           "pos_y": 498,
           "color": "none",
           "fill": "rgba(254, 15, 67, 0.98)",
           "font_family": "\"Arial\", sans-serif",
           "font_size": 14,
           "degree": 0,
           "text": "Netz",
           "shadow": ""
       }
   },
   "defs": {
       "path_5_7": {
           "type": "def",
           "id": "path_5_7",
           "d": "M237 103  V 124.6 A 15 15 0 0 0 252 139.6  H 422 A 15 15 0 0 1 437 154.6  V 211",
           "startSlot": "bottom_right",
           "endSlot": "top_left"
       },
       "path_5_13": {
           "type": "def",
           "id": "path_5_13",
           "d": "M197 103  V 124.6 A 15 15 0 0 1 182 139.6  H 111 A 15 15 0 0 0 96 154.6  V 211",
           "startSlot": "bottom_left",
           "endSlot": "top"
       },
       "path_14_7": {
           "type": "def",
           "id": "path_14_7",
           "d": "M237 421  V 399.4 A 15 15 0 0 1 252 384.4  H 422 A 15 15 0 0 0 437 369.4  V 313",
           "startSlot": "top_right",
           "endSlot": "bottom_left"
       },
       "path_5_14": {
           "type": "def",
           "id": "path_5_14",
           "d": "M217 103  V 421",
           "startSlot": "bottom",
           "endSlot": "top"
       },
       "path_13_7": {
           "type": "def",
           "id": "path_13_7",
           "startSlot": "right",
           "endSlot": "left",
           "d": "M147 262 H 406"
       }
   },
   "lines": {
       "line_path_5_7": {
           "type": "line",
           "id": "line_path_5_7",
           "href": "#path_5_7",
           "color": "rgb(0, 0, 0)",
           "position": 4
       },
       "line_path_5_13": {
           "type": "line",
           "id": "line_path_5_13",
           "href": "#path_5_13",
           "color": "rgb(0, 0, 0)",
           "position": 2
       },
       "line_path_14_7": {
           "type": "line",
           "id": "line_path_14_7",
           "href": "#path_14_7",
           "color": "rgb(0, 0, 0)",
           "position": 3
       },
       "line_path_5_14": {
           "type": "line",
           "id": "line_path_5_14",
           "href": "#path_5_14",
           "color": "rgb(0, 0, 0)",
           "position": 1
       },
       "line_path_13_7": {
           "type": "line",
           "id": "line_path_13_7",
           "color": "#000000",
           "href": "#path_13_7"
       }
   },
   "animations": {
       "anim_path_5_7": {
           "type": "animation",
           "id": "anim_path_5_7",
           "href": "#path_5_7",
           "color": "rgb(255, 206, 74)",
           "threshold": 0,
           "source": 0,
           "animation_properties": "positive",
           "animation_type": "dots",
           "dots": 6,
           "power": 7400
       },
       "anim_path_5_13": {
           "type": "animation",
           "id": "anim_path_5_13",
           "href": "#path_5_13",
           "color": "rgb(255, 206, 74)",
           "threshold": 0,
           "source": 7,
           "animation_properties": "positive",
           "animation_type": "dots",
           "dots": 6,
           "power": 7400
       },
       "anim_path_14_7": {
           "type": "animation",
           "id": "anim_path_14_7",
           "href": "#path_14_7",
           "color": "rgb(255, 206, 74)",
           "threshold": 1,
           "source": 3,
           "animation_properties": "positive",
           "animation_type": "dots",
           "dots": 6,
           "power": 20000,
           "animation_option": false
       },
       "anim_path_5_14": {
           "type": "animation",
           "id": "anim_path_5_14",
           "href": "#path_5_14",
           "color": "rgb(255, 206, 74)",
           "threshold": 0,
           "source": 3,
           "animation_properties": "negative",
           "animation_type": "dots",
           "dots": 6,
           "power": 6000
       },
       "anim_path_13_7": {
           "type": "animation",
           "id": "anim_path_13_7",
           "color": "#ffce4a",
           "href": "#path_13_7",
           "source": 2,
           "animation_properties": "negative",
           "animation_option": false,
           "threshold": null,
           "dots": 6,
           "duration": null,
           "power": 10000,
           "animation_type": "dots",
           "css_general": "",
           "css_active_positive": "",
           "css_inactive_positive": "",
           "css_active_negative": "",
           "css_inactive_negative": ""
       }
   },
   "icons": {},
   "datasources": {
       "0": {
           "source": "sun2000.0.inverter.0.string.PV1Power",
           "alias": "Solarerzeugung",
           "factor": 1
       },
       "1": {
           "source": "sun2000.0.inverter.0.battery.unit.1.batterySOC",
           "alias": "Batterie SOC %",
           "factor": 1
       },
       "2": {
           "source": "sun2000.0.inverter.0.battery.chargeDischargePower",
           "alias": "Batterie Lade_Entlade-Leistung",
           "factor": 1000
       },
       "3": {
           "source": "sun2000.0.sdongle.gridPower",
           "alias": "Einspeisung_Bezug",
           "factor": 1000
       },
       "4": {
           "source": "sun2000.0.sdongle.loadPower",
           "alias": "Hausverbrauch",
           "factor": 1000
       },
       "5": {
           "source": "sun2000.0.collected.ratedCapacity",
           "alias": "Rated of battery capacity",
           "factor": 1
       },
       "6": {
           "source": "sun2000.0.inverter.0.battery.dischargeCutoffCapacity",
           "alias": "Discharge cutoff capacity",
           "factor": 1
       },
       "7": {
           "source": "sun2000.0.inverter.0.battery.busCurrent",
           "alias": "Batterie Strom Laden",
           "factor": 1
       }
   }
}

2. Mein System, Instanz und Runtime läuft Problemlos, im Konfigurator sieht es so aus bei Chrome, FF, Edge:

Jemand dazu eine Idee?

Danke und Gruß

[skvarel]

@skb, vielen Dank für den Adapter !!!

Ich habe einen Wunsch und dazu auch ein Issue erstellt.

Ist es möglich zu den Kreisen und Quadraten auch eine Raute zu bekommen? Ein Quadrat, das auf einer Ecke steht.

Ich habe es jetzt mit sehr vielen Quadraten gelöst, das macht die Wartung aber extrem aufwendig.

Gruß, Sven.

[skvarel]

Noch ein paar Feinjustierungen aber es wird langsam was!

Ich lasse das jetzt mal ein paar Tage auf mich wirken.

Ich habe jetzt einen dezenten Balken für den Akkustand und ein paar Schalter per Icon eingebaut.

[lesiflo]

@skvarel: Woher hast du die Icon's? Sehen echt cool aus.

[mickemup]

@skvarel Sieht chic aus.
Wo hast du den überhaupt Rauten im Einsatz?

[skvarel]

@lesiflo sagte in Test Adapter Energiefluss-erweitert v0.8.x GitHub/Latest:

@skvarel: Woher hast du die Icon's? Sehen echt cool aus.

Vier davon sind von der origanlen Fox ESS Cloud, den Rest habe ich selsbt erstellt. Die vier Originalen tausche ich ich morgen noch aus. Ich muss auch noch weitere Geräte für mich erstellen.

[skvarel]

@mickemup sagte in Test Adapter Energiefluss-erweitert v0.8.x GitHub/Latest:

@skvarel Sieht chic aus.
Wo hast du den überhaupt Rauten im Einsatz?

Ich möchte die Rauten (Quadrate auf einer Ecke stehend) unter die Icons setzen. Ich hätte gern die Knotenpunkte in der Form meiner weißen Plattformen, damit ich den Fluss sauber andocken kann. Im ersten Beispiel habe ich unter jedem Icon mindestens zwei/drei Quadrate liegen um die Linien zu positionieren.

Um das zu umgehen, habe ich zweiten Bild den Fluss auf die Spitzen gesetzt.

Ersteres gefällt mir aber besser.

So hätte ich halt gern die Andockung der Linien. Das geht mit den jetzigen Elementen nicht.

[mickemup]

@skvarel
Bin gerade nicht am Rechner, aber besteht eventuell die Möglichkeit die Objekte (z.B via CSS zu drehen/modifizieren) ?

[skvarel]

@mickemup sagte in Test Adapter Energiefluss-erweitert v0.8.x GitHub/Latest:

@skvarel
Bin gerade nicht am Rechner, aber besteht eventuell die Möglichkeit die Objekte (z.B via CSS zu drehen/modifizieren) ?

Das habe ich natürlich als erstes ausprobiert. Leider ist der Drehpunkt nicht mittig und die Andockstellen drehen sich nicht mit. Das sind alles SVG Pfade.