maps mit Streckendarstellung

bahnuhr

Ja, schade dass wir dies nicht hinbekommen.
Aber vielleicht liest ja noch irgendeiner mit der sich damit auskennt.

OliverIO

der csp fehler dürfte nicht das skript oder die map betreffen

der 403 fehler bedeutet, das der server die datei nicht ausliefern will
https://de.wikipedia.org/wiki/HTTP_403
den sentry-fehler kannst du meines erachtens ignorieren.

ein tile ist ein teil deiner map, der je nach zoomstufe dann geladen wird.
die null werte irritieren mich, ein link zu einem tile sieht eher wie folgt aus

https://tile.openstreetmap.org/15/16369/10895.png
die 15 steht für die zoom stufe, die beiden anderen werte sind berechnet anhand der gps lokation, die das tile in der zoomstufe repräsentiert

die bereitstellung der html seite über einen webserver ist wahrscheinlich die einfachere aufgabe.
nginx ist auch nicht schwer zu konfigurieren und verbraucht wenig ressourcen
https://wiki.ubuntuusers.de/nginx/

liv-in-sky

@oliverio sagte in maps mit Streckendarstellung:

die bereitstellung der html seite über einen webserver

hatte ich ja oben beschrieben - eine html datei machen mit deinem beispiel und über ein script in den iob-vis.0 ordner speichern - dann kannst du die seite aufrufen - da braucht es kein nginx - hat bei mir funktioniert

bahnuhr

@liv-in-sky sagte in maps mit Streckendarstellung:

dann kannst du die seite aufrufen

wie rufst du die dann in vis auf ?

liv-in-sky

@bahnuhr

wenn die datei im iob über den dateimanager oder ein script gelegt wurde, kannst du es so machen:

z.b. datei im ordner: /opt/iobroker/iobroker-data/files/vis.0

http://192.168.178.xx:8082/vis.0/testing-route.html

ip adresse des iob mit port vom webserver (port ist der selbe, wie die vis-runtime nutzt) und dann den rest vis.0/[name des files]

Image 001.png

bahnuhr

@liv-in-sky
ja, das klappt.

Wenn ich eingebe:
http://192.168.243.15:8082/vis.0/test.html
kommt das Bild.

Aber wie nun in VIS ?
als image ?
oder welches widget ?

liv-in-sky

@bahnuhr

teste mal iframe widget

bahnuhr

@liv-in-sky sagte in maps mit Streckendarstellung:

@bahnuhr

teste mal iframe widget

Na klar, das funktioniert einwandfrei.

Super.

liv-in-sky

@bahnuhr

ich nehme an, du machst ein script, welches dir das html file erzeugt (abhängig von den lat und long) und dieses dann als datei speichert

hätte interesse daran - vielleicht magst du es dann posten

bahnuhr

@liv-in-sky sagte in maps mit Streckendarstellung:

@bahnuhr

ich nehme an, du machst ein script, welches dir das html file erzeugt (abhängig von den lat und long) und dieses dann als datei speichert

hätte interesse daran - vielleicht magst du es dann posten

Na klar, für dich mach ich das natürlich !

bahnuhr

@liv-in-sky
anbei erster Entwurf.
Damit kannst du bestimmt schon etwas anfangen.


// Script um aus den DP vom Adapter "bosch-ebike" eine MAP zu erstellen und den Weg zu zeichnen
// bahnuhr, 03_2024


// Variablen
    var poly ="";       // hier werden die GPS gespeichert
    var trip = "03";    // DP bei den Objekten der eingelesen werden soll: bosch-ebike.0.trips.xx.details
    var logging = true;
    var center_gps = "53.465, 11.71";    // Mittelpunkt der Karte
    var zoom = 17                       // Zoom der Karte
    var pfad = "route.html"             // Dateiname - wird in vis.0 gespeichert

// GPS einlesen und der Variablen poly zuweisen
    var obj = JSON.parse(getState("bosch-ebike.0.trips." + trip + ".details").val); 
    var end = obj.activityData.length - 1;
    for (var x=0; x<=end; x++) {
        poly = poly + "["+obj.activityData[x].lat+", "+obj.activityData[x].lon+"]"
        if (x < end) poly = poly + ","
    }
    if (logging) log (poly);

// html erzeugen und speichern in /vis.0/xxx.html
    var string = '<!DOCTYPE html>\n<html>\n<head>\n<title>Simple Leaflet Map</title>\n<meta charset="utf-8" />\n'
    string = string + '<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="crossorigin=""/></head>\n'
    string = string + '<body>\n<div id="map" style="width: 1200px; height: 800px"></div>\n<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="crossorigin=""></script>\n<script>\n'
    string = string + "var map = L.map('map').setView([" + center_gps + "], " + zoom + ");\n"
    string = string + "mapLink = '<a href=" + '"http://openstreetmap.org"' + ">OpenStreetMap</a>';\n"
    string = string + "L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; ' + mapLink + ' Contributors', maxZoom: 18,}).addTo(map);\n"
    string = string + 'var polyline = L.polyline([ \n' + poly + '\n], { color: "blue", weight: 3, opacity: .7, lineJoin: "round" } ).addTo(map);\n'
    string = string + '</script>\n</body>\n</html>'
    writeFile("vis.0", "/" + pfad, string, (error) => {
        if (logging) log('Datei "route.html" gespeichert!');
    });

bahnuhr

@liv-in-sky
@OliverIO
oder andere

Gibt es einen JS Befehl mit dem man ein widget (o.g. iframe) neu laden kann ?

Ja, man könnte die view wechseln und dann wieder zurück oder beim widget update eingeben (dann flackert das iframe aber).

bahnuhr

@OliverIO
Du hattest mir mal einen Code für ein rssfeed template2 zur Verfügung gestellt.

Sa so aus:

<% 
    var selectid="mydropdown"; 
    var dp_write = "javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt";
%>
<script>
debugger;
    var selectid="<%- selectid %>";
    var dp_write="<%- dp_write %>";
    
    function writeDP(el) {
        if (el.selectedOptions[0].text) vis.setValue(dp_write,el.selectedOptions[0].text);
    }

</script>
<style>
#mydropdown {
    color:rgb(255,255,255);
    background:black;
    font-size:24px;
}
</style>
</style><select id="<%- selectid %>" name="<%- selectid %>" size="1" onchange="javascript:writeDP(this)" >
<% debugger; %>
<% for (var i = 0; i<data.length;i++) { %>
  <option <%- ((dp[dp_write]==data[i]) ? "selected":"") %>><%- data[i] %></option>
<% } %>
</select>

Könnte man hier, wenn der DP geschrieben wird einen Befehl eingeben, dass ein widget nach 1000ms neu geladen wird ?

bahnuhr

Hallo,
hat sich erledigt, habe es mit verschiedene Dateinamen gelöst.

liv-in-sky

@bahnuhr
sorry - bin zeitlich nicht mehr so flexibel

ich versuche immer noch, das ganze direkt einzubinden - ich kann die externen scripte und css einbinden und diese sind auch als source in den entwicklertools zu sehen - aber leider kommt immer wieder https://forum.iobroker.net/post/1142475 der fehler, dass er beim kartenersstellen null null oder undefined undefined schreibt - dein polygon wird jedoch der karte hinzugefügt

@oliverio sagte in maps mit Streckendarstellung:

der 403 fehler bedeutet, das der server die datei nicht ausliefern will
https://de.wikipedia.org/wiki/HTTP_403

den fehler verstehe ich nicht - wenn das html als file da ist, wird auch keine authentifizierung verlangt - ist es in einem html widget in der vis schon - da stimmt was anderes nicht

geändert habe ich das ganze so:

ich verlege diesen teil:

 $('head').append(` <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
          integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
          crossorigin=""/>` );

        
 $('body').append(`    
    <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
            integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
            crossorigin=""></script>
   
       `);

unter scripte in der vis und belasse den nächsten teil in dem html widget - braucht halt eine zeitverzögerung


  
 <div id="mapid" style="width: 1200px; height: 800px"></div>

 <script>
 



 let timeout111 = 3500; //Zeit erhöhen wenn der Klick nicht angenommen wird
 let timeout112 = 2000; //Zeit erhöhen wenn der Klick nicht angenommen wird
 
  
  setTimeout( () => {
     // }, timeout111);  
   // setTimeout( () => {
     
      var mymap = L.map('mapid').setView([52.465, 9.71], 17);
        mapLink = 
            '<a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>';
 
      /*  L.tileLayer(
            'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '&copy; ' + mapLink,
            maxZoom: 18,
            }).addTo(mymap);*/
      L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'}).addTo(mymap);      
    /*  L.tileLayer('https://tile.opentopomap.org/{z}/{x}/{y}.png', {
    maxZoom: 19,
    attribution: 'Map data: © OpenStreetMap contributors, SRTM | Map style: © OpenTopoMap (CC-BY-SA)'
}).addTo(mymap); */ 
            
            
 // }, timeout111);
 
    setTimeout( () => {
         var polyline = L.polyline([
            [52.46566, 9.71085],[52.4657, 9.71095],[52.46573, 9.71129],[52.46604, 9.71132],[52.46648, 9.71126],[52.46674, 9.71094],[52.46705, 9.71029],[52.46733, 9.70977],[52.46757, 9.70929],[52.46786, 9.70872],[52.46811, 9.7082],[52.46842, 9.70772],[52.46861, 9.70714],[52.46877, 9.70649],[52.4689, 9.70585],[52.46902, 9.7052],[52.46914, 9.70461],[52.4693, 9.70401],[52.46948, 9.70335],[52.46963, 9.70277],[52.46982, 9.70216],[52.47012, 9.70178],[52.47044, 9.70136],[52.47078, 9.70097],[52.47111, 9.70061],[52.47144, 9.70023],[52.47178, 9.69983],[52.47212, 9.69945],[52.47247, 9.69905],[52.47282, 9.69866],[52.47315, 9.69832],[52.4735, 9.69795],[52.47384, 9.69755],[52.47418, 9.69715],[52.47454, 9.69678],[52.47492, 9.69638],[52.47526, 9.69601],[52.47561, 9.69566],[52.47602, 9.69539],[52.4764, 9.69527],[52.47676, 9.69472],[52.47708, 9.69439],[52.47739, 9.69393],[52.47775, 9.69359],[52.47812, 9.69329],[52.4785, 9.69301],[52.47892, 9.69283],[52.47932, 9.69267],[52.47966, 9.69245],[52.48005, 9.6921],[52.4804, 9.69191],[52.48087, 9.69169],[52.4812, 9.69157],[52.48154, 9.69153],[52.48203, 9.69148]
	    ],
            {
                color: 'blue',
                weight: 3,
                opacity: .7,
                //dashArray: '20,15',
                lineJoin: 'round'
            }
            ).addTo(mymap);     
         //  mymap.remove(); 
         
    }, timeout111);       
            
  }, timeout112);
  </script>

in chrome sieht man die source:

Image 076.png

habe auch mal das getestet https://docs.maptiler.com/leaflet/examples/npm-get-started/ - aber leider kommt dann

Image 075.png
obwohl ich einen key generiert habe

@bahnuhr - danke für das script - werde ich mir später ansehen

bahnuhr

@liv-in-sky
Bei mir läuft es einwandfrei.
Stelle heute abend (wenn es klappt) alles mal ein.

liv-in-sky

@bahnuhr ja, das ist schon mal gut so (du arbeitest mit dem html-file und iframe)- ich wolte aber mal (just for fun) ein externes script in die vis einbinden (über ein html-widget) und herausfinden, wo da probleme entstehen - zumindest das erstellen von problemen ist mir gelungen

bahnuhr

@liv-in-sky sagte in maps mit Streckendarstellung:

externes script in die vis einbinden (über ein html-widget)

hab ich nicht hinbekommen

bahnuhr

@liv-in-sky

anbei Script und View.
Kannst bestimmt damit was anfangen.
Funktioniert einwandfrei.



// Script um aus den DP vom Adapter "bosch-ebike" eine MAP zu erstellen und den Weg zu zeichnen
// bahnuhr, 03_2024

// ###############################################################################################################
// DP "javascript.0.Geräte.Fahrrad.Touren" ändert sich
    on({id: "javascript.0.Geräte.Fahrrad.Touren"}, function() {  
        var body = getState("javascript.0.Geräte.Fahrrad.Touren").val;
        var arrTouren = []; 
        var obj = JSON.parse(body); 
        for (var x=0; x<= obj.length-1; x++) {
            var titel = obj[x].Titel; var datum = obj[x].Datum; var start = obj[x].Start; var end = obj[x].Ende; var strecke = obj[x].Strecke; 
            var fahrzeit = obj[x].Fahrzeit; var o_trittfrequenz = obj[x].o_Trittfrequenz; var max_trittfrequenz = obj[x].max_Trittfrequenz;
            var o_leistung = obj[x].o_Leistung; var max_leistung = obj[x].max_Leistung; var o_speed = obj[x].o_Speed; var max_speed = obj[x].max_Speed;
            var bergauf = obj[x].Bergauf; var bergab = obj[x].Bergab;
            arrTouren.push(datum + " _ " + strecke + " km _ " + titel); 
        }
        setState("javascript.0.Geräte.Fahrrad.Routen.Auswahl", JSON.stringify(arrTouren));
        log (arrTouren);     
    });


// ###############################################################################################################
// DP "javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt" ändert sich
    on({id: "javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt"}, function(obj) {  
        var arr = obj.state.val.split(" _ "); log (arr[0]); var Auswahl_Datum = arr[0];
        var body = JSON.parse(getState("javascript.0.Geräte.Fahrrad.Touren").val);
        for (var x=0; x<20; x++) {
            var datum = body[x].Datum; 
            if (datum == Auswahl_Datum) {
                Datei_schreiben(x+1);
            }
        }
    });



// ###############################################################################################################
// GPS lesen und Datei html schreiben
    function Datei_schreiben(trip) {
        // Variablen
            var poly ="";       // hier werden die GPS gespeichert
            var center_gps = "50.465, 9.71";    // Mittelpunkt der Karte
            var zoom = 13                       // Zoom der Karte
            var pfad = "route"             // Dateiname - wird in vis.0 gespeichert
            var logging = true;
        // Werte der Tour einlesen
            var arrTour = [];
            var obj2 = JSON.parse(getState("javascript.0.Geräte.Fahrrad.Touren").val); 
            var titel = obj2[trip-1].Titel; var datum = obj2[trip-1].Datum; var start = obj2[trip-1].Start; var end = obj2[trip-1].Ende; var strecke = obj2[trip-1].Strecke; 
            var fahrzeit = obj2[trip-1].Fahrzeit; var o_trittfrequenz = obj2[trip-1].o_Trittfrequenz; var max_trittfrequenz = obj2[trip-1].max_Trittfrequenz;
            var o_leistung = obj2[trip-1].o_Leistung; var max_leistung = obj2[trip-1].max_Leistung; var o_speed = obj2[trip-1].o_Speed; var max_speed = obj2[trip-1].max_Speed;
            var bergauf = obj2[trip-1].Bergauf; var bergab = obj2[trip-1].Bergab;
            arrTour.push({Titel: titel, Datum: datum, Start: start, Ende: end, Strecke: strecke, Fahrzeit: fahrzeit, o_Trittfrequenz: o_trittfrequenz, max_Trittfrequenz: max_trittfrequenz, o_Leistung: o_leistung, max_Leistung: max_leistung, o_Speed: o_speed, max_Speed: max_speed, Bergauf: bergauf, Bergab: bergab}); 
            setState("javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt_alles", JSON.stringify(arrTour));
        // GPS einlesen und der Variablen poly zuweisen
            if (trip < 10) trip = "0" + trip;       // DP bei den Objekten der eingelesen werden soll: bosch-ebike.0.trips.xx.details
            var obj = JSON.parse(getState("bosch-ebike.0.trips." + trip + ".details").val); 
            var end = obj.activityData.length - 1;
            for (var x=0; x<=end; x++) {
                if (obj.activityData[x].lat > 1 && obj.activityData[x].lon > 1) {
                    poly = poly + "["+obj.activityData[x].lat+", "+obj.activityData[x].lon+"]"
                    if (x < end) poly = poly + ","
                }
            }
            if (logging) log (poly);
        // html erzeugen und speichern in /vis.0/xxx.html
            var string = '<!DOCTYPE html>\n<html>\n<head>\n<title>Simple Leaflet Map</title>\n<meta charset="utf-8" />\n'
            string = string + '<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="crossorigin=""/></head>\n'
            string = string + '<body>\n<div id="map" style="width: 980px; height: 530px"></div>\n<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="crossorigin=""></script>\n<script>\n'
            string = string + "var map = L.map('map').setView([" + center_gps + "], " + zoom + ");\n"
            string = string + "mapLink = '<a href=" + '"http://openstreetmap.org"' + ">OpenStreetMap</a>';\n"
            string = string + "L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; ' + mapLink + ' Contributors', maxZoom: 18,}).addTo(map);\n"
            string = string + 'var polyline = L.polyline([ \n' + poly + '\n], { color: "blue", weight: 3, opacity: .7, lineJoin: "round" } ).addTo(map);\n'
            string = string + '</script>\n</body>\n</html>'
            writeFile("vis.0", "/Routen/" + pfad + trip +".html", string, (error) => {
                if (logging) log('Datei "route.html" gespeichert!');
            });
            setState("javascript.0.Geräte.Fahrrad.Routen.Datei","/vis.0/Routen/" + pfad + trip + ".html");
    }

View:

{
   "settings": {
       "style": {
           "background_class": "",
           "background-color": "black"
       },
       "theme": "dark-hive",
       "sizex": "1270",
       "sizey": "790",
       "gridSize": "",
       "useAsDefault": false,
       "snapType": null,
       "useBackground": false
   },
   "widgets": {
       "e00001": {
           "tpl": "tplBarNavigator",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "bPosition": "floatVertical",
               "bWidth": 187,
               "bHeight": 34,
               "bValue": "",
               "bStyleNormalHover": null,
               "bStyleActiveHover": null,
               "bCount": "10",
               "buttonsText1": "Übersicht",
               "buttonsImage1": "/vis.0/main/img/faviconEdit.png",
               "buttonsOption1": "Titel",
               "buttonsText2": "Etagen",
               "buttonsImage2": "/vis.0/main/img/mfd/control_building_s_eg.png",
               "buttonsOption2": "Erdgeschoss",
               "buttonsText3": "Außenbereich",
               "buttonsImage3": "/vis.0/main/img/mfd/weather_wind.png",
               "buttonsOption3": "Aussenbereich",
               "buttonsText4": "Maps",
               "buttonsImage4": "/vis.0/main/img/boincmanager.png",
               "buttonsOption4": "Maps_Dieter",
               "buttonsText5": "Multimedia",
               "buttonsImage5": "/vis.0/main/img/yamaha.jpg",
               "buttonsOption5": "Yamaha",
               "buttonsText6": "Video / Webcam",
               "buttonsImage6": "/vis.0/main/img/camera.png",
               "buttonsOption6": "Video",
               "buttonsText7": "Geräte / Energie",
               "buttonsImage7": "/vis.0/main/img/disconnect.png",
               "buttonsOption7": "Geraete",
               "buttonsText8": "Jalousie / Licht",
               "buttonsImage8": "/vis.0/main/img/devices/50/61_hm-lc-bl1-pb-fm_thumb.png",
               "buttonsOption8": "Schalter",
               "buttonsText9": "Heizung",
               "buttonsImage9": "/vis.0/main/img/devices/50/61_hm-lc-bl1-pb-fm_thumb.png",
               "buttonsOption9": "Schalter2",
               "buttonsText10": "System",
               "buttonsImage10": "/vis.0/main/img/mfd/measure_power_meter.png",
               "buttonsOption10": "System",
               "buttonsText11": "",
               "buttonsImage11": "",
               "buttonsOption11": "Schalter2",
               "buttonsText12": "",
               "buttonsImage12": "",
               "buttonsOption12": "System",
               "buttonsText13": "",
               "buttonsImage13": "",
               "buttonsOption13": "Schalter2",
               "bOnlyOneSelected": false,
               "bTheme": "",
               "alwaysOpened": false,
               "g_css_background": false,
               "g_gestures": false,
               "g_signals": false,
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "g_effects": false,
               "g_css_shadow_padding": true,
               "g_css_border": false,
               "g_css_font_text": true,
               "bShowEffect": "show",
               "bShowEffectMs": "100",
               "bHideEffect": "show",
               "bHideEffectMs": "100",
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Google",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Pool",
                   "Pool_Chemie",
                   "Schalter",
                   "Schalter2",
                   "System",
                   "System2",
                   "Tanks",
                   "Tankstelle2",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Wetter",
                   "Wohnzimmer",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "g_style": false,
               "g_button_options": true,
               "bSpace": "11",
               "bRadius": "8",
               "bOffset": "0",
               "bTextAlign": "center",
               "bImageAlign": "left",
               "bLayout": "auto",
               "imagePaddingLeft": "17",
               "imagePaddingTop": "10",
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0,
               "buttonsImage14": "/vis.0/main/img/devices/50/61_hm-lc-bl1-pb-fm_thumb.png",
               "buttonsText14": "Heizung",
               "buttonsOption14": "Schalter2",
               "g_visibility": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide"
           },
           "style": {
               "left": "20px",
               "top": "270px",
               "height": "505px",
               "width": "190px",
               "z-index": "2",
               "position": "",
               "opacity": "",
               "font-family": "Alegreya-Italic",
               "font-size": "12px",
               "line-height": "6px",
               "color": "",
               "text-align": "",
               "font-style": "normal"
           },
           "widgetSet": "bars"
       },
       "e00002": {
           "tpl": "tplTwSimpleDate",
           "data": {
               "g_fixed": true,
               "g_visibility": false,
               "g_css_font_text": true,
               "g_css_background": false,
               "g_css_shadow_padding": false,
               "g_css_border": false,
               "g_gestures": false,
               "g_signals": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "prependZero": "true",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "showWeekDay": true,
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Energie",
                   "Erdgeschoss",
                   "Garage",
                   "Geraete",
                   "Geraete2",
                   "Google",
                   "Haustuer",
                   "Heizungsanlage",
                   "Kellergeschoss",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Obergeschoss",
                   "Schalter",
                   "Schalter2",
                   "Strom",
                   "System2",
                   "Tanks",
                   "Tankstelle",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Video",
                   "Wasser",
                   "Webcam",
                   "Wetter",
                   "Wohnzimmer",
                   "Wohnzimmer2",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "20px",
               "top": "17px",
               "width": "200px",
               "height": "35px",
               "z-index": "1",
               "color": "rgb(255, 255, 255)",
               "font-size": "16px",
               "letter-spacing": "0px",
               "line-height": "",
               "font-family": "sans-serif"
           },
           "widgetSet": "timeandweather"
       },
       "e00003": {
           "tpl": "tplTwSimpleClock",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "hideSeconds": true,
               "blink": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Energie",
                   "Erdgeschoss",
                   "Garage",
                   "Geraete",
                   "Geraete2",
                   "Google",
                   "Haustuer",
                   "Heizungsanlage",
                   "Kellergeschoss",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Obergeschoss",
                   "Schalter",
                   "Schalter2",
                   "Strom",
                   "System2",
                   "Tanks",
                   "Tankstelle",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Video",
                   "Wasser",
                   "Webcam",
                   "Wetter",
                   "Wohnzimmer",
                   "Wohnzimmer2",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "20px",
               "top": "47px",
               "color": "rgb(255, 255, 255)",
               "font-size": "40px",
               "z-index": "1",
               "height": "42px",
               "line-height": "normal",
               "font-family": "sans-serif",
               "letter-spacing": "2px",
               "width": "130px"
           },
           "widgetSet": "timeandweather"
       },
       "e00004": {
           "tpl": "tplImage",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "src": "/vis.0/main/img/IMG_3343 - Kopie.jpg",
               "refreshOnWakeUp": false,
               "refreshOnViewChange": false,
               "refreshInterval": "0",
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Energie",
                   "Erdgeschoss",
                   "Garage",
                   "Geraete",
                   "Geraete2",
                   "Google",
                   "Haustuer",
                   "Heizungsanlage",
                   "Kellergeschoss",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Obergeschoss",
                   "Schalter",
                   "Schalter2",
                   "Strom",
                   "System2",
                   "Tanks",
                   "Tankstelle",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Video",
                   "Wasser",
                   "Webcam",
                   "Wetter",
                   "Wohnzimmer",
                   "Wohnzimmer2",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "20px",
               "top": "110px",
               "width": "189px",
               "height": "132px",
               "z-index": "2"
           },
           "widgetSet": "basic"
       },
       "e00005": {
           "tpl": "tplHtml",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Energie",
                   "Erdgeschoss",
                   "Garage",
                   "Geraete",
                   "Geraete2",
                   "Google",
                   "Haustuer",
                   "Heizungsanlage",
                   "Kellergeschoss",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Obergeschoss",
                   "Schalter",
                   "Schalter2",
                   "Strom",
                   "System2",
                   "Tanks",
                   "Tankstelle",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Video",
                   "Wasser",
                   "Webcam",
                   "Wetter",
                   "Wohnzimmer",
                   "Wohnzimmer2",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "refreshInterval": "0",
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "10px",
               "top": "10px",
               "border-radius": "6px",
               "padding": "3px",
               "color": "rgb(255, 255, 255)",
               "background": "rgba(0, 0, 0, 0) none repeat scroll 0% 0%",
               "border": "1px solid rgb(170, 170, 170)",
               "font": "normal normal 20px/normal Arial",
               "width": "200px",
               "height": "230px",
               "border-color": "rgb(170, 170, 170)",
               "border-style": "solid",
               "border-width": "2px",
               "z-index": "0"
           },
           "widgetSet": "basic"
       },
       "e00006": {
           "tpl": "tplHtml",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "refreshInterval": "0",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "views": [
                   "Aussenbereich",
                   "Code",
                   "Corona",
                   "DWD",
                   "DWD2",
                   "DWD3",
                   "Energie",
                   "Erdgeschoss",
                   "Garage",
                   "Geraete",
                   "Geraete2",
                   "Google",
                   "Haustuer",
                   "Heizungsanlage",
                   "Kellergeschoss",
                   "Krippe",
                   "Maps_Bettina",
                   "Maps_Dieter",
                   "Maps_Philipp",
                   "Nachrichten",
                   "Obergeschoss",
                   "Schalter",
                   "Schalter2",
                   "Strom",
                   "System2",
                   "Tanks",
                   "Tankstelle",
                   "Telefon",
                   "Telefon2",
                   "Titel",
                   "Uhr",
                   "Video",
                   "Wasser",
                   "Webcam",
                   "Wetter",
                   "Wohnzimmer",
                   "Wohnzimmer2",
                   "Yamaha",
                   "Yamaha2",
                   "Yamaha3"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "10px",
               "top": "260px",
               "border-radius": "6px",
               "padding": "3px",
               "color": "rgb(255, 255, 255)",
               "background": "rgba(0, 0, 0, 0) none repeat scroll 0% 0%",
               "border": "1px solid rgb(170, 170, 170)",
               "font": "normal normal 20px/normal Arial",
               "width": "200px",
               "height": "520px",
               "border-color": "rgb(170, 170, 170)",
               "border-style": "solid",
               "border-width": "2px",
               "z-index": "0"
           },
           "widgetSet": "basic"
       },
       "e00007": {
           "tpl": "tplHtml",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "refreshInterval": "0",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "230px",
               "top": "10px",
               "border-radius": "6px",
               "padding": "3px",
               "color": "rgb(255, 255, 255)",
               "background": "rgba(0, 0, 0, 0) none repeat scroll 0% 0%",
               "border": "1px solid rgb(170, 170, 170)",
               "font": "normal normal 20px/normal Arial",
               "width": "1030px",
               "height": "770px",
               "border-color": "rgb(170, 170, 170)",
               "border-style": "solid",
               "border-width": "2px",
               "z-index": "0"
           },
           "widgetSet": "basic"
       },
       "e00008": {
           "tpl": "tplHtml",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "html": "E-Bike - Tour:",
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "refreshInterval": "0",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "views": [
                   "DWD2",
                   "DWD3"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0
           },
           "style": {
               "left": "402px",
               "top": "26px",
               "width": "220px",
               "height": "42px",
               "color": "rgb(255, 255, 255)",
               "z-index": "2",
               "font-size": "40px",
               "font-family": "Alegreya-Italic",
               "line-height": "32px"
           },
           "widgetSet": "basic"
       },
       "e00009": {
           "tpl": "tplBarNavigator",
           "data": {
               "hm_id": 65535,
               "digits": "",
               "factor": 1,
               "min": 0,
               "max": 1,
               "step": 0.01,
               "bPosition": "floatHorizontal",
               "bWidth": 80,
               "bHeight": 46,
               "bSpace": 5,
               "bRadius": 5,
               "bOffset": 0,
               "bTextAlign": "center",
               "bImageAlign": "right",
               "bValue": "",
               "bShowEffect": "show",
               "bHideEffect": "show",
               "bShowEffectMs": 100,
               "bHideEffectMs": 100,
               "bStyleNormal": "bar-button-base-on",
               "bStyleNormalHover": null,
               "bStyleActive": "bar-button-nice-blue",
               "bStyleActiveHover": null,
               "bCount": "1",
               "buttonsText1": "Fahrrad",
               "buttonsImage1": "",
               "buttonsOption1": "Fahrrad",
               "buttonsText2": "Bettina",
               "buttonsImage2": "",
               "buttonsOption2": "Maps_Bettina",
               "bOnlyOneSelected": false,
               "bTheme": "",
               "bLayout": "fixed",
               "imagePaddingLeft": "10",
               "imagePaddingTop": "2",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "buttonsText3": "Philipp",
               "buttonsOption3": "Maps_Philipp",
               "views": [
                   "Maps_Bettina",
                   "Maps_Philipp"
               ],
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0,
               "g_visibility": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "buttonsText4": "BMW",
               "buttonsOption4": "BMW",
               "buttonsText5": "Fahrrad",
               "buttonsOption5": "Fahrrad"
           },
           "style": {
               "left": "260px",
               "top": "25px",
               "font-size": "16px",
               "border-width": "0px",
               "border-style": "solid",
               "border-color": "rgb(170, 170, 170)",
               "height": "25px",
               "width": "100px",
               "z-index": "6",
               "letter-spacing": "0px",
               "color": "black"
           },
           "widgetSet": "bars"
       },
       "e00010": {
           "tpl": "tplJSONTemplate2",
           "data": {
               "g_fixed": false,
               "g_visibility": false,
               "g_css_font_text": true,
               "g_css_background": false,
               "g_css_shadow_padding": false,
               "g_css_border": false,
               "g_gestures": false,
               "g_signals": false,
               "g_last_change": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "rss_dpCount": "1",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0,
               "json_oid": "javascript.0.Geräte.Fahrrad.Routen.Auswahl",
               "json_template": "<% \n    var selectid=\"mydropdown\"; \n    var dp_write = \"javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt\";\n%>\n<script>\ndebugger;\n    var selectid=\"<%- selectid %>\";\n    var dp_write=\"<%- dp_write %>\";\n    \n    function writeDP(el) {\n        if (el.selectedOptions[0].text) vis.setValue(dp_write,el.selectedOptions[0].text);\n    }\n\n</script>\n<style>\n#mydropdown {\n    color:rgb(255,255,255);\n    background:black;\n    font-size:24px;\n}\n</style>\n</style><select id=\"<%- selectid %>\" name=\"<%- selectid %>\" size=\"1\" onchange=\"javascript:writeDP(this)\" >\n<% debugger; %>\n<% for (var i = 0; i<data.length;i++) { %>\n  <option <%- ((dp[dp_write]==data[i]) ? \"selected\":\"\") %>><%- data[i] %></option>\n<% } %>\n</select>",
               "rss_dp1": "javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt"
           },
           "style": {
               "left": "656px",
               "top": "30px",
               "width": "600px",
               "height": "35px",
               "font-size": "",
               "z-index": "1"
           },
           "widgetSet": "rssfeed"
       },
       "e00011": {
           "tpl": "tplIFrame",
           "data": {
               "g_fixed": false,
               "g_visibility": false,
               "g_css_font_text": false,
               "g_css_background": false,
               "g_css_shadow_padding": false,
               "g_css_border": false,
               "g_gestures": false,
               "g_signals": false,
               "g_last_change": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "refreshInterval": "0",
               "seamless": false,
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0,
               "src": "{javascript.0.Geräte.Fahrrad.Routen.Datei}",
               "scrollY": false,
               "scrollX": false,
               "noSandbox": false,
               "refreshOnWakeUp": true,
               "refreshOnViewChange": true
           },
           "style": {
               "left": "257px",
               "top": "222px",
               "width": "1000px",
               "height": "555px",
               "z-index": "5",
               "overflow-x": "hidden",
               "overflow-y": "hidden"
           },
           "widgetSet": "basic"
       },
       "e00012": {
           "tpl": "i-vis-jsontable",
           "data": {
               "g_fixed": false,
               "g_visibility": false,
               "g_css_font_text": true,
               "g_css_background": false,
               "g_css_shadow_padding": false,
               "g_css_border": false,
               "g_gestures": false,
               "g_signals": false,
               "g_last_change": false,
               "visibility-cond": "==",
               "visibility-val": 1,
               "visibility-groups-action": "hide",
               "iTblRowLimit": "1",
               "iTableRefreshRate": "0",
               "iColCount": "14",
               "iColShow1": "true",
               "iTblTextAlign1": "left",
               "iTblCellFormat1": "normal",
               "iTblCellImageSize1": "200",
               "iTblCellBooleanCheckbox1": "false",
               "iTblCellBooleanColorFalse1": "#ff0000",
               "iTblCellBooleanColorTrue1": "#00ff00",
               "iTblCellNumberDecimals1": "2",
               "iTblCellNumberDecimalSeperator1": ".",
               "iTblCellNumberThousandSeperator1": ",",
               "iTblCellThresholdsDp1": "",
               "iTblCellThresholdsText1": "",
               "iOpacityAll": "1",
               "iTblRowEvenColor": "#f2eeee",
               "iTblRowUnevenColor": "#d2cbcb",
               "iTblHeaderColor": "#908484",
               "iRowSpacing": "7",
               "iTblRowEvenTextColor": "#2c42e8",
               "iTblRowUnevenTextColor": "#2c42e8",
               "iTblHeaderTextColor": "#FFFFFF",
               "iBorderSize": "1",
               "iBorderStyleLeft": "groove",
               "iBorderStyleRight": "groove",
               "iBorderStyleUp": "groove",
               "iBorderStyleDown": "groove",
               "iBorderColor": "#ffffff",
               "signals-cond-0": "==",
               "signals-val-0": true,
               "signals-icon-0": "/vis/signals/lowbattery.png",
               "signals-icon-size-0": 0,
               "signals-blink-0": false,
               "signals-horz-0": 0,
               "signals-vert-0": 0,
               "signals-hide-edit-0": false,
               "signals-cond-1": "==",
               "signals-val-1": true,
               "signals-icon-1": "/vis/signals/lowbattery.png",
               "signals-icon-size-1": 0,
               "signals-blink-1": false,
               "signals-horz-1": 0,
               "signals-vert-1": 0,
               "signals-hide-edit-1": false,
               "signals-cond-2": "==",
               "signals-val-2": true,
               "signals-icon-2": "/vis/signals/lowbattery.png",
               "signals-icon-size-2": 0,
               "signals-blink-2": false,
               "signals-horz-2": 0,
               "signals-vert-2": 0,
               "signals-hide-edit-2": false,
               "lc-type": "last-change",
               "lc-is-interval": true,
               "lc-is-moment": false,
               "lc-format": "",
               "lc-position-vert": "top",
               "lc-position-horz": "right",
               "lc-offset-vert": 0,
               "lc-offset-horz": 0,
               "lc-font-size": "12px",
               "lc-font-family": "",
               "lc-font-style": "",
               "lc-bkg-color": "",
               "lc-color": "",
               "lc-border-width": "0",
               "lc-border-style": "",
               "lc-border-color": "",
               "lc-border-radius": 10,
               "lc-zindex": 0,
               "iColShow2": true,
               "iTblTextAlign2": "center",
               "iTblCellFormat2": "normal",
               "iTblCellImageSize2": "200",
               "iTblCellBooleanCheckbox2": "false",
               "iTblCellBooleanColorFalse2": "#ff0000",
               "iTblCellBooleanColorTrue2": "#00ff00",
               "iTblCellNumberDecimals2": "2",
               "iTblCellNumberDecimalSeperator2": ".",
               "iTblCellNumberThousandSeperator2": ",",
               "iTblCellThresholdsDp2": "",
               "iTblCellThresholdsText2": "",
               "iColShow3": "true",
               "iTblTextAlign3": "center",
               "iTblCellFormat3": "normal",
               "iTblCellImageSize3": "200",
               "iTblCellBooleanCheckbox3": "false",
               "iTblCellBooleanColorFalse3": "#ff0000",
               "iTblCellBooleanColorTrue3": "#00ff00",
               "iTblCellNumberDecimals3": "2",
               "iTblCellNumberDecimalSeperator3": ".",
               "iTblCellNumberThousandSeperator3": ",",
               "iTblCellThresholdsDp3": "",
               "iTblCellThresholdsText3": "",
               "iColShow4": true,
               "iTblTextAlign4": "center",
               "iTblCellFormat4": "normal",
               "iTblCellImageSize4": "200",
               "iTblCellBooleanCheckbox4": "false",
               "iTblCellBooleanColorFalse4": "#ff0000",
               "iTblCellBooleanColorTrue4": "#00ff00",
               "iTblCellNumberDecimals4": "2",
               "iTblCellNumberDecimalSeperator4": ".",
               "iTblCellNumberThousandSeperator4": ",",
               "iTblCellThresholdsDp4": "",
               "iTblCellThresholdsText4": "",
               "oid": "javascript.0.Geräte.Fahrrad.Routen.ausgewaehlt_alles",
               "iTblShowHead": true,
               "iTblFixedHead": true,
               "iColName1": "<p style=\"line-height:18px; text-align:left; font-size:16px;font-weight:normal\">Titel",
               "iColWidth1": "",
               "iColPreText1": "",
               "iColAttr1": "",
               "iBorderRemoveDouble": true,
               "iColName2": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Datum",
               "iColName3": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Start",
               "iColName4": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Ende",
               "iTblSortOrder": "asc",
               "iTblHeadTextAlign1": "left",
               "iTblHeadTextAlign2": "center",
               "iTblHeadTextAlign3": "center",
               "iTblHeadTextAlign4": "center",
               "iColShow5": "true",
               "iTblHeadTextAlign5": "center",
               "iTblTextAlign5": "center",
               "iTblCellFormat5": "normal",
               "iTblCellImageSize5": "200",
               "iTblCellBooleanCheckbox5": "false",
               "iTblCellBooleanColorFalse5": "#ff0000",
               "iTblCellBooleanColorTrue5": "#00ff00",
               "iTblCellNumberDecimals5": "2",
               "iTblCellNumberDecimalSeperator5": ".",
               "iTblCellNumberThousandSeperator5": ",",
               "iTblCellThresholdsDp5": "",
               "iTblCellThresholdsText5": "",
               "iColName5": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Strecke<br/>(in km)",
               "iColShow6": true,
               "iTblHeadTextAlign6": "center",
               "iTblTextAlign6": "center",
               "iTblCellFormat6": "normal",
               "iTblCellImageSize6": "200",
               "iTblCellBooleanCheckbox6": "false",
               "iTblCellBooleanColorFalse6": "#ff0000",
               "iTblCellBooleanColorTrue6": "#00ff00",
               "iTblCellNumberDecimals6": "2",
               "iTblCellNumberDecimalSeperator6": ".",
               "iTblCellNumberThousandSeperator6": ",",
               "iTblCellThresholdsDp6": "",
               "iTblCellThresholdsText6": "",
               "iColShow8": false,
               "iTblHeadTextAlign8": "center",
               "iTblTextAlign8": "center",
               "iTblCellFormat8": "normal",
               "iTblCellImageSize8": "200",
               "iTblCellBooleanCheckbox8": "false",
               "iTblCellBooleanColorFalse8": "#ff0000",
               "iTblCellBooleanColorTrue8": "#00ff00",
               "iTblCellNumberDecimals8": "2",
               "iTblCellNumberDecimalSeperator8": ".",
               "iTblCellNumberThousandSeperator8": ",",
               "iTblCellThresholdsDp8": "",
               "iTblCellThresholdsText8": "",
               "iColShow9": true,
               "iTblHeadTextAlign9": "center",
               "iTblTextAlign9": "center",
               "iTblCellFormat9": "normal",
               "iTblCellImageSize9": "200",
               "iTblCellBooleanCheckbox9": "false",
               "iTblCellBooleanColorFalse9": "#ff0000",
               "iTblCellBooleanColorTrue9": "#00ff00",
               "iTblCellNumberDecimals9": "2",
               "iTblCellNumberDecimalSeperator9": ".",
               "iTblCellNumberThousandSeperator9": ",",
               "iTblCellThresholdsDp9": "",
               "iTblCellThresholdsText9": "",
               "iColShow10": false,
               "iTblHeadTextAlign10": "center",
               "iTblTextAlign10": "center",
               "iTblCellFormat10": "normal",
               "iTblCellImageSize10": "200",
               "iTblCellBooleanCheckbox10": "false",
               "iTblCellBooleanColorFalse10": "#ff0000",
               "iTblCellBooleanColorTrue10": "#00ff00",
               "iTblCellNumberDecimals10": "2",
               "iTblCellNumberDecimalSeperator10": ".",
               "iTblCellNumberThousandSeperator10": ",",
               "iTblCellThresholdsDp10": "",
               "iTblCellThresholdsText10": "",
               "iColShow11": true,
               "iTblHeadTextAlign11": "center",
               "iTblTextAlign11": "center",
               "iTblCellFormat11": "normal",
               "iTblCellImageSize11": "200",
               "iTblCellBooleanCheckbox11": "false",
               "iTblCellBooleanColorFalse11": "#ff0000",
               "iTblCellBooleanColorTrue11": "#00ff00",
               "iTblCellNumberDecimals11": "2",
               "iTblCellNumberDecimalSeperator11": ".",
               "iTblCellNumberThousandSeperator11": ",",
               "iTblCellThresholdsDp11": "",
               "iTblCellThresholdsText11": "",
               "iColShow12": true,
               "iTblHeadTextAlign12": "center",
               "iTblTextAlign12": "center",
               "iTblCellFormat12": "normal",
               "iTblCellImageSize12": "200",
               "iTblCellBooleanCheckbox12": "false",
               "iTblCellBooleanColorFalse12": "#ff0000",
               "iTblCellBooleanColorTrue12": "#00ff00",
               "iTblCellNumberDecimals12": "2",
               "iTblCellNumberDecimalSeperator12": ".",
               "iTblCellNumberThousandSeperator12": ",",
               "iTblCellThresholdsDp12": "",
               "iTblCellThresholdsText12": "",
               "iColShow13": "true",
               "iTblHeadTextAlign13": "center",
               "iTblTextAlign13": "center",
               "iTblCellFormat13": "normal",
               "iTblCellImageSize13": "200",
               "iTblCellBooleanCheckbox13": "false",
               "iTblCellBooleanColorFalse13": "#ff0000",
               "iTblCellBooleanColorTrue13": "#00ff00",
               "iTblCellNumberDecimals13": "2",
               "iTblCellNumberDecimalSeperator13": ".",
               "iTblCellNumberThousandSeperator13": ",",
               "iTblCellThresholdsDp13": "",
               "iTblCellThresholdsText13": "",
               "iColShow14": "true",
               "iTblHeadTextAlign14": "center",
               "iTblTextAlign14": "center",
               "iTblCellFormat14": "normal",
               "iTblCellImageSize14": "200",
               "iTblCellBooleanCheckbox14": "false",
               "iTblCellBooleanColorFalse14": "#ff0000",
               "iTblCellBooleanColorTrue14": "#00ff00",
               "iTblCellNumberDecimals14": "2",
               "iTblCellNumberDecimalSeperator14": ".",
               "iTblCellNumberThousandSeperator14": ",",
               "iTblCellThresholdsDp14": "",
               "iTblCellThresholdsText14": "",
               "iColWidth6": "",
               "iColPreText6": "",
               "iColName6": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Fahrzeit",
               "iColAttr6": "",
               "iTblCellPlaceholder6": "",
               "iColWidth3": "10",
               "g_iTableCol_§6": true,
               "iColShow7": true,
               "iTblHeadTextAlign7": "center",
               "iTblTextAlign7": "center",
               "iTblCellFormat7": "normal",
               "iTblCellImageSize7": "200",
               "iTblCellBooleanCheckbox7": "false",
               "iTblCellBooleanColorFalse7": "#ff0000",
               "iTblCellBooleanColorTrue7": "#00ff00",
               "iTblCellNumberDecimals7": "2",
               "iTblCellNumberDecimalSeperator7": ".",
               "iTblCellNumberThousandSeperator7": ",",
               "iTblCellThresholdsDp7": "",
               "iTblCellThresholdsText7": "",
               "iColName7": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">\nØ-Tritt-<br>frequenz<br>(U/min.)",
               "iColName8": "",
               "iColName9": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Ø-Leistung<br>(in W)",
               "iColName10": "",
               "iColName11": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Ø-Speed<br>(in km/h)",
               "iColName12": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">max-Speed<br>(in km/h)",
               "iColName13": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Bergauf<br>(in m)",
               "iColShow15": "true",
               "iTblHeadTextAlign15": "center",
               "iTblTextAlign15": "left",
               "iTblCellFormat15": "normal",
               "iTblCellImageSize15": "200",
               "iTblCellBooleanCheckbox15": "false",
               "iTblCellBooleanColorFalse15": "#ff0000",
               "iTblCellBooleanColorTrue15": "#00ff00",
               "iTblCellNumberDecimals15": "2",
               "iTblCellNumberDecimalSeperator15": ".",
               "iTblCellNumberThousandSeperator15": ",",
               "iTblCellThresholdsDp15": "",
               "iTblCellThresholdsText15": "",
               "iColShow16": "true",
               "iTblHeadTextAlign16": "center",
               "iTblTextAlign16": "left",
               "iTblCellFormat16": "normal",
               "iTblCellImageSize16": "200",
               "iTblCellBooleanCheckbox16": "false",
               "iTblCellBooleanColorFalse16": "#ff0000",
               "iTblCellBooleanColorTrue16": "#00ff00",
               "iTblCellNumberDecimals16": "2",
               "iTblCellNumberDecimalSeperator16": ".",
               "iTblCellNumberThousandSeperator16": ",",
               "iTblCellThresholdsDp16": "",
               "iTblCellThresholdsText16": "",
               "iColName14": "<p style=\"line-height:18px; font-size:16px;font-weight:normal\">Bergab<br>(in m)",
               "iColAttr4": "",
               "iVertScroll": false,
               "iTblDummyRow": ""
           },
           "style": {
               "left": "258px",
               "top": "77px",
               "z-index": "6",
               "width": "995px",
               "height": "130px",
               "font-size": "14px",
               "line-height": "12px",
               "font-weight": "bold"
           },
           "widgetSet": "vis-inventwo"
       }
   },
   "name": "Fahrrad_Route",
   "rerender": false,
   "filterList": []
}

bahnuhr

@liv-in-sky

tausche diesen Scriptteil aus:

            var string = '<!DOCTYPE html>\n<html>\n<head>\n<title>Simple Leaflet Map</title>\n<meta charset="utf-8" />\n'
            string = string + '<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="crossorigin=""/></head>\n'
            string = string + '<body>\n<div id="map" style="width: 980px; height: 530px"></div>\n<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="crossorigin=""></script>\n<script>\n'
            string = string + "var map = L.map('map').setView([" + center_gps + "], " + zoom + ");\n"
            string = string + "mapLink = '<a href=" + '"http://openstreetmap.org"' + ">OpenStreetMap</a>';\n"
            string = string + "L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; ' + mapLink + ' Contributors', maxZoom: 18,}).addTo(map);\n"
            string = string + "var latlngs = [" + poly + "];\nvar polyline = L.polyline(latlngs, {color: 'blue', weight: 3, opacity: .7, lineJoin: 'round'}).addTo(map);\n"
            string = string + "map.fitBounds(polyline.getBounds());\n"
            string = string + '</script>\n</body>\n</html>'

Dann wird durch
fitbounds
die Karte automatisch gezoomt. Die Strecke ist dann komplett im Bildschirm.

mfg
Dieter

NEWS

maps mit Streckendarstellung

Support us

728

32.4k

81.4k

1.3m