Map Widget reloaded - Neue Version des Map Widgets

[Sailor]

So, ich habe jetzt mal mit Deinen Daten ein bisschen herumgespielt, einige Anpassungen machen müssen und eine neue Version des Widgets hier angehängt (bitte mal damit testen).

Gaaaanz Geile Nummer!
DANKE! 

Das Reload Thema fehlt hier noch.

Pas à pas!

Gruß
    Sailor

[eki]

So, hier wäre jetzt mal eine Version, bei der das Reload auch funktionieren müsste. Wäre für test und Feedback dankbar. Ich habe bei der Gelegenheit auch noch einen Refresh Button auf die Karte gelegt, mit dem man das Neuladen auch manuell triggern kann.

[Sailor]

Hallo eki

So, hier wäre jetzt mal eine Version, bei der das Reload auch funktionieren müsste. Wäre für test und Feedback dankbar. Ich habe bei der Gelegenheit auch noch einen Refresh Button auf die Karte gelegt, mit dem man das Neuladen auch manuell triggern kann.

Die gute Nachricht ist, dass der Reload und das Einlesen des GeoJson - Files funktioniert! 

Die schlechte Nachricht ist, er löscht beim Reload nicht die alte Position, und somit habe ich bei laufender Änderung immer mehr des gleichen Symbols entlang der Bewegungsstrecke.
Diese lassen sich auch nicht mit dem Reload - Button auf der Map löschen. 

Erst beim harten Reload (F5-Taste) verschwinden die überflüssigen Symbole.

Ist da ein vergessener Cache? im im Script?

Gruß
    Sailor

[eki]

Komisch, bei meinen Tests hat er astrein die Symbole gelöscht und hinzugefügt. Cache kann eigentlich nicht sein, weil ich das Laden per POST mache und da sollte eigentlich nichts gecached werden (ist das bei allen Browsern so?).

[Sailor]

Hallo eki

Komisch, bei meinen Tests hat er astrein die Symbole gelöscht und hinzugefügt. Cache kann eigentlich nicht sein, weil ich das Laden per POST mache und da sollte eigentlich nichts gecached werden (ist das bei allen Browsern so?).

Ich habe hier nur Ubuntu mit Firefox am laufen...
Ich werde das mal mit Anderen probieren und berichten...

Gruß
    Sailor

[curt]

OT
@eki

Hier in der Anlage.

[Sailor]

OT
@eki

Hier in der Anlage.

Ist das dein Staubsauger oder dein Mähroboter? 

Aber so sieht es im Endeffekt bei mir auch aus. Statt die letzte Position anzuzeigen werden die Positionen aufaddiert.

Gruß
    Sailor

[curt]

Ist das dein Staubsauger oder dein Mähroboter? 

Staubsauger.

Bei PN kann man keine Dateien versenden, daher auf diesem Weg. Ja, es geht um Live-Visualisierung.

[curt]

@eki
Ein List des Roboters ist in der Anlage.

Es gibt (derzeit, das ist ein aktueller Roboter, die Modulerweiterung ist beta) zwei für die Sache relevante Logfiles, die wie folgt definiert sind:

Code Auswählen Erweitern


define FileLog_Putzi_Koo_2 FileLog ./log/Putzi_Koo_2-%Y.log Putzi_2:(pos_x_y).*
...
define SVG_FileLog_Putzi_Koo_2_1 SVG LOG_PROXY:SVG_FileLog_Putzi_Koo_2_1:CURRENT
attr SVG_FileLog_Putzi_Koo_2_1 plotsize 800,700
attr SVG_FileLog_Putzi_Koo_2_1 room 16 Putzi


Das zweite Log (nur eine Zeile lang, aktualisierend) namens position.log wird über userreadings definiert, siehe list.

Das von mir verwendete gplot-File (wird nicht aktualisiert, händisch reload):

Code Auswählen Erweitern


# cat SVG_FileLog_Putzi_Koo_2_1.gplot
set terminal png transparent size <SIZE> crop
set output '<OUT>.png'
set xdata time
set timefmt "%Y-%m-%d_%H:%M:%S"
set xlabel " "
set title ''
set ytics
set y2tics
set grid
set ylabel ""
set y2label ""
set xrange [-10:10]
set yrange [-10:10]

#LOG_PROXY Func:logProxy_xyFile2Plot("/opt/fhem/log/position.log",2,"position")
#LOG_PROXY Func:logProxy_xyFile2Plot("/opt/fhem/log/Putzi_Koo_2-2021.log",4,"pos_x_y:")
#LOG_PROXY Func:logProxy_xy2Plot([[10,9],[-10,9],[-10,-9],[8,-9],[8,9]])

plot "<IN>" using 1:2 axes x1y2 title 'Putzi' ls l0fill lw 2 with points,\
     "<IN>" using 1:2 axes x1y2 title 'Map' ls l2 lw 1 with lines,\
     "<IN>" using 1:2 axes x1y2 title 'Rahmen' ls l1fill lw 1 with lines



Wie gewünscht der Thread, in dem die Entwicklung zum bisherigen grafischen Stand diskutiert wurde, ab Beitrag #2308 in https://forum.fhem.de/index.php/topic,73052.2295.html .

Die Idee ist wie gesagt, das Ganze (die aktuelle Position des Roboters und auch den zurückgelegten den Weg des Roboters) in einem FHEM-Modul sichtbar machen.

[Sailor]

Hallo Curt

Ein List des Roboters ist in der Anlage.
Die Idee ist wie gesagt, das Ganze (die aktuelle Position des Roboters und auch den zurückgelegten den Weg des Roboters) in einem FHEM-Modul sichtbar machen.

Wenn du aus deinem

Code Auswählen Erweitern


2021-01-22 18:26:40   pos_x           0.78076
2021-01-22 18:26:40   pos_x_y         0.78076,-1.237947
2021-01-22 18:26:40   pos_y           -1.237947


Eine Latitude und Longitude errechnen kannst, hätte ich eine Idee der Realisierung:

Ein etwas abgeändertes Programm wie von mir oben gepostet, allerdings mit aufsummierten Positionsangaben plus aktueller Position welche dies als GEOJSON-Datei abspeichert.
Wobei dies aufgrund des Browser-Bugs? (Root cause noch nicht ermittelt - Problem besteht noch) die Positionsdaten ohnehin aufsummiert werden.

Gruß
    Sailor

[eki]

Ich bin an dem Thema auf Anfrage von curt schon dran, ein bisschen Geduld.

[eki]

Ich habe jetzt mal einen Zwischenstand, den ich her mal vorstellen wollte (war doch einiges und ich habe auch noch ein paar Fehler gefunden  ). Ist wie gesagt, noch nicht ganz fertig (z.B. geht die Heatmap noch nicht für Google sondern nur für OSM), wollte es aber mal zur Diskussion stellen

Mit der angehängten Version gibt es einige Änderungen:

1. Man kann jetzt die maximalen und minialen zoom levels vorgeben (habe ich gebraucht, um für die kleinen Gebiete, die so ein Staubsauger abfährt, sehr tief hinein zoomen zu können). Beispiele wären data-minzoom="1", data-maxzoom="25" (die Defaults gehen bisher von 0 bis 18)

2. Das Thema der Darstellung von Polygonen aus einem Reading wurde korrigiert (dort war es bisher tatsächlich so, dass das nicht aktualisiert wurde (nur mit F5). Jetzt wird das bei jedem Event, der das Polygon verändert in der Karte aktualisiert.

3. Es gibt die Möglichkeit ein Bild auf die Karte zu legen (damit kann man z.B. einen Grundriss in das Kartenfenster bekommen). Dazu muss das Bild von der Drehung her in die Karte passen und es müssen zusätzlich noch die Ecken des Bildes in Geokoordinaten angegeben werden). Das kann z.B. so aussehen:

Code Auswählen Erweitern

data-overlay="../images/fp_Dachgeschoss_turned.png,48.831014929044535, 9.075971602274373,48.83088043906973, 9.076093642600654"
Die 5 Parameter sind zum einen die URL des Bildes und darüber hinaus die Geokoordinaten der oberen linken und der unteren rechten Ecke auf der Karte (jeweils zuerst Latitude und dann Longitude). Es sind noch weitere Parameter wie Opacity und zoomMin und zoomMax vorgesehen, die sind aber bisher noch nicht eingebaut.

4. Es gibt die Möglichkeit eine "Heatmap" auf die Karte zu legen, die sich aus einem Reading speist. Dieses Reading muss aus Punkten bestehen, die jeweils durch Leerzeichen getrennt sind. Jeder Punkt besteht aus 3 Werten, welche durch Komma getrennt sind. Die 3 Werte sind: Position Longitude, Position Latitude, Gewicht. Ein Beispiel von 3 Punkten wäre:

Code Auswählen Erweitern

9.07602996790166,48.8309896464092,1 9.07602253461123,48.8309971928888,4 9.0760255807376,48.831005959051,3. Die Definition des Features muss zumindest den Namen eines Readings enthalten, indem die oben erwähnten Punkte stehen. Ein Beispiel würde folgendermaßen aussehen (auch hier sind noch die Parameter für Opacity und zoomMin/zoomMax vorgesehen aber noch nicht eingebaut):

Code Auswählen Erweitern

data-heatmap="heatmap".
Damit das mit der Heatmap mit OSM funktioniert (bei Google braucht man das nicht), muss man folgendes Pluginscript ins lib Verzeichnis des TabletsUI legen: https://github.com/Leaflet/Leaflet.heat/blob/gh-pages/dist/leaflet-heat.js

Für die Staubsaugerfraktion wäre also folgendes zu tun (ich habe auch mal eine Dummydefinition, die ich zur Simulation benutzt habe mit entsprechenden User Readings unten angehängt):
1. Aus den lokalen Punkten ein Reading mit einem Polygon machen. In dem Dummy ist auch eine einfache Umrechnungsformel enthalten, die halbwegs funktioniert (das Thema Geotransformation ist eine Wissenschaft für sich, mit der Formel geht es aber so einigermaßen). In meinem Beispiel wird das Polygon nicht belibig lang. Man kann die Länge mit dem Attribut max-polylength setzen.
2. Aus den lokalen Punkten eine Reading mit einer sich immer weiter aktualisierenden Heatmap machen. Auch dazu ein Userreading im Beispieldummy. Man kann hier noch eine Gitterweite für die Heatmap angeben, irgendwie muss man ja festlegen wann ein beliebiger neuer Punkt einem gegebenen Heatmap Punkt zugeschlagen wird und damit dessen Gewicht (der 3. Parameter) erhöht.
3. Ein Bild als overlay besorgen, das z.B. den Grundriss des Gebäudes auf die Karte legt (in meine Fall ist der Name ../images/fp_Dachgeschoss_turned.png).
3. Eine widget Map definieren. Auch dazu habe ich ein Beispiel gemacht und unten angehängt.

Die Raw Definition des Dummy mit den Userreadings für das Polygon und die Heatmap (der lokale Punkt des Saugers als Input muss im Reading point stehen und x und y Werte durch Komma getrennt enthalten):

Code Auswählen Erweitern

defmod testVCRobot dummy
attr testVCRobot userattr max-polylength referencepoint gridsize
attr testVCRobot gridsize 1.5
attr testVCRobot max-polylength 10
attr testVCRobot readingList point
attr testVCRobot referencepoint 9.076057,48.830989
attr testVCRobot setList point
attr testVCRobot userReadings polygon:point.* {\
my @points = split(" ",ReadingsVal($NAME,"polygon",""));;\
my ($x,$y) = split(",",ReadingsVal($NAME,"point","0,0"));;\
my ($rlong,$rlat) = split(",",AttrVal($NAME,"referencepoint","0,0"));;\
my $deg2rad = 3.14159265359/180;;\
my $maxlength = AttrVal($NAME,"max-polylength","0");;\
\
my $lat = $rlat + $y/(111132.954 - 559.822 * cos( 2.0 * $rlat * $deg2rad) + 1.175 * cos( 4.0 * $rlat * $deg2rad));;\
my $lng = $rlong + $x/($deg2rad * 6367449 * cos ( $rlat * $deg2rad));;\
splice(@points,0,@points-$maxlength+1) if (@points+1 > $maxlength);;\
push(@points,$lng.",".$lat);;\
\
return join(" ",@points);;\
},\
heatmap:point.* {\
my @hmpoints = split(" ",ReadingsVal($NAME,"heatmap",""));;\
my ($x,$y) = split(",",ReadingsVal($NAME,"point","0,0"));;\
my ($rlong,$rlat) = split(",",AttrVal($NAME,"referencepoint","0,0"));;\
my $gridsize = AttrVal($NAME,"gridsize","0.5");;\
my $deg2rad = 3.14159265359/180;;\
\
my $gsx = $gridsize/($deg2rad * 6367449 * cos ( $rlat * $deg2rad));;\
my $gsy = $gridsize/(111132.954 - 559.822 * cos( 2.0 * $rlat * $deg2rad) + 1.175 * cos( 4.0 * $rlat * $deg2rad));;\
\
my $lat = $rlat + $y/(111132.954 - 559.822 * cos( 2.0 * $rlat * $deg2rad) + 1.175 * cos( 4.0 * $rlat * $deg2rad));;\
my $lng = $rlong + $x/($deg2rad * 6367449 * cos ( $rlat * $deg2rad));;\
\
my $found = 0;;\
my @newpoints;;\
\
foreach (@hmpoints) {\
my ($gpx,$gpy,$weight) = split(",",$_);;\
if ($lat>$gpy-$gsy/2 && $lat<$gpy+$gsy/2 && $lng>$gpx-$gsx/2 && $lng<$gpx+$gsx/2){\
$weight++;;\
$found = 1;;\
}\
push(@newpoints,"$gpx,$gpy,$weight");;\
}\
\
if (!$found) {\
push(@newpoints,"$lng,$lat,1");;\
}\
\
return join(" ",@newpoints);;\
},\
longitude:point.* {\
my ($x,$y) = split(",",ReadingsVal($NAME,"point","0,0"));;\
my ($rlong,$rlat) = split(",",AttrVal($NAME,"referencepoint","0,0"));;\
my $deg2rad = 3.14159265359/180;;\
$rlong + $x/($deg2rad * 6367449 * cos ( $rlat * $deg2rad));;\
},\
latitude:point.* {\
my ($x,$y) = split(",",ReadingsVal($NAME,"point","0,0"));;\
my ($rlong,$rlat) = split(",",AttrVal($NAME,"referencepoint","0,0"));;\
my $deg2rad = 3.14159265359/180;;\
$rlat + $y/(111132.954 - 559.822 * cos( 2.0 * $rlat * $deg2rad) + 1.175 * cos( 4.0 * $rlat * $deg2rad));;\
}

setstate testVCRobot 0,0
setstate testVCRobot 2021-01-29 16:33:04 heatmap 9.07602996790166,48.8309896464092,1 9.07602253461123,48.8309971928888,2 9.0760255807376,48.831005959051,3 9.07602840093143,48.8310154224601,1 9.07604048958478,48.8310196199713,2 9.07605076248894,48.8310255521352,4 9.07605084985054,48.8310345442348,2 9.07605341985163,48.8310433761542,1 9.07605078155696,48.8310120231081,2 9.07606375421187,48.8310274787877,2 9.07607582403415,48.8310232578901,5 9.07608860078535,48.8310264539185,2 9.07608179114462,48.8310379542776,2 9.07609539607405,48.8310370829146,1 9.07606942096281,48.8310153344552,2 9.07607640332257,48.8310076038334,8 9.07606855327439,48.8310002422513,12 9.07605611520421,48.8309967413622,8 9.07607453828661,48.8309919335792,9 9.07606812625243,48.8309839920138,6 9.07609756203781,48.831001897342,1 9.07609194314684,48.8310100947802,3 9.07609296850183,48.830995051708,1 9.07608067909368,48.8309989888582,1 9.07610576039538,48.8310164930254,1 9.07611826551113,48.831020124358,1 9.07612574643612,48.8310125982764,1 9.0761378019375,48.8310083597041,1 9.07615011211047,48.8310122686802,1 9.07614979359703,48.8310032788385,2 9.07614557701812,48.8309946275672,3 9.07613682709852,48.8309877189966,10 9.07615045964701,48.8309870604243,9 9.07614481636039,48.8309788702416,7 9.07612297400939,48.8309727667389,3 9.07613198705599,48.8309796533374,3 9.07610773605686,48.8309687095462,1 9.07609880967322,48.830961899373,1 9.07609162786933,48.830969550515,1 9.07609635649852,48.830977987612,1 9.07608316525678,48.8309803448473,4 9.07607204041929,48.8309725604963,3 9.07605886077678,48.830970175348,1
setstate testVCRobot 2021-01-29 16:33:04 latitude 48.8309865856738
setstate testVCRobot 2021-01-29 16:33:04 longitude 9.07608678417558
setstate testVCRobot 2021-01-29 16:33:04 point 2.17891695503789, -0.26848867022813
setstate testVCRobot 2021-01-29 16:33:04 polygon 9.07609635649852,48.830977987612 9.07608316525678,48.8309803448473 9.07606973033641,48.8309786869288 9.07608330857479,48.8309776509444 9.07607204041929,48.8309725604963 9.07605886077678,48.830970175348 9.07607252654647,48.8309703784538 9.07607571486407,48.8309791227069 9.07607327809235,48.8309879709539 9.07608678417558,48.8309865856738
setstate testVCRobot 2021-01-29 07:28:28 state 0,0

Die Map Definition (besteht aus 2 Teilen, der erste malt das Polygon und die Heatmap, der zweite ein Auto das am Beginn des Polygons durch die Gegend fährt):

Code Auswählen Erweitern

<div class="cell">
<div id="Test1"
style="height: calc(100% - 1.6em); width:100%"
data-type="maps"
data-map_type="OSM"
data-showdetails="false"
data-device="testVCRobot"
data-traffic="true"
data-mapgroup="2"
data-overlay="../images/fp_Dachgeschoss_turned.png,48.831014929044535, 9.075971602274373,48.83088043906973, 9.076093642600654"
data-heatmap="heatmap,0.5"
data-center="48.830989, 9.076057"
data-scrollgroup="2"
data-maxzoom="25"
data-zoom="20"
data-icon="no-icon"
data-label=" "
data-stroke="#33ddff,5,60">
</div>
<div id="Test2"
style="height: calc(100% - 1.6em); width:100%"
data-type="maps"
data-map_type="OSM"
data-polygon="none"
data-showdetails="false"
data-get="longitude"
data-device="testVCRobot"
data-mapgroup="2"
data-center="48.830989, 9.076057"
data-scrollgroup="2"
data-maxzoom="25"
data-zoom="20"
data-icon="no-icon"
data-label="fa-car"
data-stroke="#3300ff,20,60">
</div>
</div>


Zu guter Letzt habe ich noch ein Bild anghängt, wie das mit meinem simulierten Device auf der Karte aussieht.

[Stelaku]

Hallo eki

Vielen dank für Deine Arbeit. Ich gehöre ja mit zu der Staubsauger fraktion und habe mich gestern gleich dran gemacht um es bei mir zu testen. Leider ohne Erfolg.

Als erstes habe ich mir Deine neue Version ins Verzeichnis

Code Auswählen Erweitern

/opt/fhem/www/tablet/js
kopiert.
Danach habe ich mir einen API key bei tomtom besorgt und diesen in Deinem Beispiel quelltext mit eingtragen.

Code Auswählen Erweitern

<!DOCTYPE html>
<html>
<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.2.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2016 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * !!!! Evaluation version - run only in a staging enviroment !!!!
     *
     * - create a new folder named 'tablet_eval' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet_eval
     * - add 'define TABLETUIEVAL HTTPSRV ftui_eval ./www/tablet_eval Tablet-EVAL' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet_eval/
     *
     * Create a Demo Device in FHEM
     * define ftuitest dummy
     */
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="TomTomApiKey" content="< mein key >">
    <meta name="widget_base_width" content="74">
    <meta name="widget_base_height" content="71">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="gridster_disable" content="1">
    <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
    <meta name="debug" content="2"> <!-- verbose level 1-6 = output to console;0 = not output -->
    <meta http-equiv="Cache-Control" content="no-store" />
   

    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>Martha´s Karte</title>
</head>
<body>
<div class="gridster">
<ul>
  <div class="cell">
  <div id="Test1"
  style="height: calc(100% - 1.6em); width:100%"
  data-type="maps"
  data-map_type="OSM"
  data-showdetails="false"
  data-device="testVCRobot"
  data-traffic="true"
  data-mapgroup="2"
  data-overlay="../images/fp_Grundriss.png,48.831014929044535, 9.075971602274373,48.83088043906973, 9.076093642600654"
  data-heatmap="heatmap,0.5"
  data-center="48.830989, 9.076057"
  data-scrollgroup="2"
  data-maxzoom="25"
  data-zoom="20"
  data-icon="no-icon"
  data-label=" "
  data-stroke="#33ddff,5,60">
  </div>
  <div id="Test2"
  style="height: calc(100% - 1.6em); width:100%"
  data-type="maps"
  data-map_type="OSM"
  data-polygon="none"
  data-showdetails="false"
  data-get="longitude"
  data-device="testVCRobot"
  data-mapgroup="2"
  data-center="48.830989, 9.076057"
  data-scrollgroup="2"
  data-maxzoom="25"
  data-zoom="20"
  data-icon="no-icon"
  data-label="fa-car"
  data-stroke="#3300ff,20,60">
  </div>
  </div>

</ul>
</div>
</body>
</html>


jetzt noch das plug in in das neu erstellte Verzeichnis kopiert

Code Auswählen Erweitern


/opt/fhem/www/tablet/lib/tomtom

das list sieht dann so in der terminla AUsgabe aus

Stephan@Labor:/opt/fhem/www/tablet/lib/tomtom $ ls -al
insgesamt 4872
drwxr-xr-x 7 Stephan Stephan    4096 Jan 30 11:01 .
drwxr-xr-x 4 Stephan dialout    4096 Jan 30 10:56 ..
drwxr-xr-x 6 Stephan Stephan    4096 Jan 30 09:49 glyphs
drwxr-xr-x 2 Stephan Stephan   20480 Jan 30 09:49 images
-rw-r--r-- 1 Stephan Stephan   31894 Jan 30 09:49 LICENSE.txt
drwxr-xr-x 2 Stephan Stephan    4096 Jan 30 09:49 mapbox-gl-js
-rw-r--r-- 1 Stephan Stephan  362038 Jan 30 09:49 map.css
-rw-r--r-- 1 Stephan Stephan    2193 Jan 30 09:49 README.md
drwxr-xr-x 2 Stephan Stephan    4096 Jan 30 09:49 sprites
drwxr-xr-x 2 Stephan Stephan    4096 Jan 30 09:49 styles
-rw-r--r-- 1 Stephan Stephan  733912 Jan 30 09:49 tomtom.min.js
-rw-r--r-- 1 Stephan Stephan 3804414 Jan 30 09:49 tomtom.min.js.map


und zu guter letzt

Damit das mit der Heatmap mit OSM funktioniert (bei Google braucht man das nicht), muss man folgendes Pluginscript ins lib Verzeichnis des TabletsUI legen: https://github.com/Leaflet/Leaflet.heat/blob/gh-pages/dist/leaflet-heat.js

die datei habe ich mit wget in das lib Verzeichnis kopiert

Code Auswählen Erweitern


Stephan@Labor:/opt/fhem/www/tablet/lib $ wget https://github.com/Leaflet/Leaflet.heat/blob/gh-pages/dist/leaflet-heat.js
--2021-01-30 11:17:15--  https://github.com/Leaflet/Leaflet.heat/blob/gh-pages/dist/leaflet-heat.js
Auflösen des Hostnamens github.com (github.com)... 140.82.121.4
Verbindungsaufbau zu github.com (github.com)|140.82.121.4|:443 ... verbunden.
HTTP-Anforderung gesendet, auf Antwort wird gewartet ... 200 OK
Länge: nicht spezifiziert [text/html]
Wird in »leaflet-heat.js« gespeichert.

leaflet-heat.js                                                 [ <=>                                                                                                                                     ] 182,33K  --.-KB/s    in 0,06s

2021-01-30 11:17:16 (2,83 MB/s) - »leaflet-heat.js« gespeichert [186704]


Deinen Dummy habe kpl. so wie er ist in meinem fhem mit übernommen.
Nur leider bekomme ich beim Aufruf der Seite eine Fehlermeldung und sie bleibt dunkel.
Fehlermeldung siehe Anhang.

leider hat es auch nicht funktioniert wenn ich mit wget https://raw.githubusercontent.com/Leaflet/Leaflet.heat/gh-pages/dist/leaflet-heat.js mir die Datei ins Verzeichnis kopiere
Auch ein stumpfes reinkopieren über copy paste der raw mit Atom und filezilla war erfolglos.
Ich mache bestimmt was falsch beim import der leaflet-heat.js... .


Ich würde mich sehr freuen wenn Du mir sagen könntest was ich falsch mache.

Vielen dank.

Gruß

Stephan

[SirMarco]

Das Script muss doch noch in den Header der Index eingebunden werden, oder?

[eki]

Das Script muss nicht in den Header, das macht das Widget selbst. Er hat ja irgendwie auch das heatmap Script geladen, sonst wäre die Meldung ja anders. Ich schau es mir mal an.

Noch ne Frage, hast Du denn bei dem Dummy das Reading heatmap schon mit Werten besetzt (passiert, wenn Du z. B. mit set point x, y entsprechend etwas setzt.