Map Widget reloaded - Neue Version des Map Widgets

Begonnen von eki, 05 Oktober 2018, 16:04:19

Vorheriges Thema - Nächstes Thema

curt

Ich korrigiere:
DIESER Fehler ist ein Zeichen, dass die data-geojson-Angabe falsch gesetzt ist. Das schrieb ich für spätere Leser, die über exakt diesen Fehler stolpern.

Nein, der Fehler kommt nicht mehr, ich habe data-geojson nun korrekt gesetzt.

Aber Hydranten gibt es trotzdem in Weilimdorf leider nicht.
RPI 4 - Jeelink HomeMatic Z-Wave

eki


curt

Wie auch immer dieses abhanden kam - neuer Auszug:


        data-feature_style='{
        "popup_properties_click":"name network operator fire.*",
        "popup_properties_move":"fire.*\\:diameter",
        "display_styles":'{
                "emergency.fire_hydrant":{"label":"fa-fire-extinguisher","strokeColor":"red"},
                "public_transport.station":{"label":"fa-train","strokeColor":"black"}}
        }'


Beeindruckt ihn aber nicht - keine Hydranten in den Kaff zu sehen.
RPI 4 - Jeelink HomeMatic Z-Wave

eki

War auch Quatsch von mir, sorry, war vorher schon richtig ohne '

eki

Ich werd es mal bei mir mit Deiner Config ausprobieren, bin aber jetzt erst mal anderweitig beschäftigt. Rückmeldung dann wahrscheinlich am Montag.

curt

@eki

Meine aktuelle Unterseite (mit dem Häkchen) - falls Du gelegentlich testen magst:


<!-- page4.html -->
<div class="page" id="page4">

        <div class="gridster">

                <ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">1 | 1 x|y</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">1 | 2 x|y</li>

<li data-row="1" data-col="3" data-sizex="3" data-sizey="1" style="color:#999999;font-size:32px">
                <div data-type="clock" data-format="l"></div>
                <div data-type="clock" data-format="j. F"></div>
            </li>

<li data-row="1" data-col="6" data-sizex="2" data-sizey="1" data-type="clock" data-format="H:i" style="color:#999999;font-size:64px"></li>

<!-- <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">2 | 1 x|y</li> -->
<li data-row="2" data-col="1" data-sizex="6" data-sizey="4">
  <div  style="height: 100%"
                data-type="maps"
        data-map_type="OSM"
        data-language="de"
        data-center="51.642737,12.347260"
        data-zoom="10"
        data-traffic="true"
        data-stroke="#ffffff,7,50,#ffffff,7,50"
        data-geojson="data/firedata.geojson"
        data-feature_style='{
        "popup_properties_click":"name network operator fire.*",
        "popup_properties_move":"fire.*\\:diameter",
        "display_styles":'{
                "emergency.fire_hydrant":{"label":"fa-fire-extinguisher","strokeColor":"red"},
                "public_transport.station":{"label":"fa-train","strokeColor":"black"}}
        }'
        data-showdetails="true">
  </div>
</li>
                </ul>
</div>
</div>


Das die Hydranten nicht angezeigt werden, kann zig andere Gründe haben. Beispielsweise nutzte ich bislang den JSON-Dingens in FHEM nicht, allenfalls unbewusst. Daher kann es sein, dass meiner Installation noch irgend eine Voraussetzung fehlt. Oder Du setzt irgend ein Paket als selbstverständlich voraus - was mir aber fehlt.

Es hat wirklich keine Eile, mach bitte langsam: Wir sind doch nicht auf der Flucht. - Ich möchte das gelegentlich schrittweise zum Laufen bekommen, daher sollten gelegentlich die Hydranten zu sehen sein. Aber das hat wirklich Zeit.

Die Ideen (für die nächsten Schritte) waren: Einbindung "Sehenswürdigkeiten". Schon das ist heikel, da es dafür bei OSM ganz unterschiedliche Tags gibt. Und die Verknüpfung auf Wikipedia-Artikeln (die eine Koordinate haben) wäre durchaus interessant. (Die Android-App "Mobile Gesichte" basiert darauf.)

Spricht etwas dagegen, dass ich einen völlig neuen Entwurf für den Wiki-Artikel "Map Widget" schreibe? Ich würde den bisherigen Artikel nicht anfassen, den neuen Entwurf unter /Diskussion beginnen. Also falls mein Elan dann noch reicht.
RPI 4 - Jeelink HomeMatic Z-Wave

eki

ZitatSpricht etwas dagegen, dass ich einen völlig neuen Entwurf für den Wiki-Artikel "Map Widget" schreibe? Ich würde den bisherigen Artikel nicht anfassen, den neuen Entwurf unter /Diskussion beginnen. Also falls mein Elan dann noch reicht.

Natürlich nicht, hau rein.

eki

Ich habe mir jetzt mal die Definition mit dem GEOJSON angeschaut. Es gibt verschiedene Gründe, warum das nicht klappt.

zum Einen war noch ein ' falsch. Solche Sachen sieht man immer ganz gut, wenn man einen Editor verwendet, der Syntax Highlighting kann (z.B. Notepad++). Hier die Korrigierte Version. Dort habe ich auch noch die Fontgröße für die Hydranten erhöht, sonst sind sie kaum zu sehen.

  <div  style="height: 100%"
        data-type="maps"
        data-map_type="OSM"
        data-language="de"
        data-center="51.642737,12.347260"
        data-zoom="10"
        data-traffic="true"
        data-stroke="#ffffff,7,50,#ffffff,7,50"
        data-geojson="data/firedata.geojson"
        data-feature_style='{
        "popup_properties_click":"name network operator fire.*",
        "popup_properties_move":"fire.*\\:diameter",
        "display_styles":{
                "emergency.fire_hydrant":{"fontSize":"20px","label":"fa-fire-extinguisher","strokeColor":"red"},
                "public_transport.station":{"label":"fa-train","strokeColor":"black"}}
        }'
        data-showdetails="true">
  </div>



Andererseits gab es im widget noch einen Fehler, der zuschlägt, wenn kein data-label definiert ist. Ich habe eine neue Version mit entsprechenden Anpassungen am Anfang des Threads angehängt (mit "Edit:" im Text um die Leute darauf hinzuweisen).

Mit diesen beiden Korrekturen sollte es klappen.

curt

@eki
Danke, nun funktioniert es ein wenig mehr: Mir werden rote leere Vierecke angezeigt.

Das Symbol fa-fire-extinguisher existiert bei mir. Wenn ich https://mein-fhem-server:8083/fhem/ftui/icons_table.html aufrufe, wird es nebst vielen anderen Symbolen angezeigt.

Leider aber nicht auf der Karte, da sind nur rote Kästchen.
RPI 4 - Jeelink HomeMatic Z-Wave

eki

Benutzt Du FTUI Version 2.7.2? Falls ja, habe ich einen Verdacht.

curt

RPI 4 - Jeelink HomeMatic Z-Wave

eki

Im ersten Beitrag oben ist jetzt noch mal eine Korrektur um auch mit FTUI Versionen >= 2.7.2 zurecht zu kommen.

curt

#27
Danke @eki

Mit Version 2.7.4 sehe ich nun wunderschöne feuerrote Feuerlöscher. -

Kann es übrigens sein, dass Deine Umstellungen weitere ggf. gar nicht geplante positive Seiteneffekte hat? Mir fällt auf, dass bei dem Verkehrsoverlay die Generalisierung (also wie viele Straßen in Abhängigkeit des handischen Zooms dargestellt werden) wohltuend besser ist.

Die Breite der Straßentypen sowie die Wahl der Farben für den Verkehrsfluss scheint noch nicht optimal - aber lassen wir mal die Kirche im Dorf: Wie das jetzt ist, ist es schon sehr schön.

Ich mache jetzt erstmal eine Pause.
Danach nehme ich mir den Schritt mit der Erstellung der eigenen Layouts vor (falls ich Hilfe brauche, melde ich mich), wenn die Kraft dann noch reicht, mache ich einen *Entwurf* die eine neue/anders aufgebaute Wiki-Seite für das Modul.
RPI 4 - Jeelink HomeMatic Z-Wave

curt

Schrittchen für Schrittchen - ich erzähle vor mich hin (vielleicht interessiert es auch andere):

Vermittels http://overpass-turbo.eu kann ich nun eigene geojson-Overlays bauen sowie einbinden. Ich lernte, dass

* Das Overlay ist eine statische Momentaufnahme - das ist NICHT dynamisch, keine dynamische Fortführung. Also es gibt später keine neu gebauten Hydranten!

* Das Vorgehen ist hakelig bis kritisch - die OSM-Kategorien sind nicht zwingend stringent. Darüber hinaus wird es schnell komplex.

* Man kann/muss das Zielgebiet definieren. Zum Beispiel "Berlin". Vermutlich kann man auch Rechtecke definieren - nicht getestet.

Real habe ich testweise zwei alternative Ebenen erzeugt: history (geschichtlich bedeutende Orte) sowie "wikipedia" (Orte, für die es einen Wikipedia-Artikel gibt.

Meine Übung (Schrittchen für Schrittchen) ist für sich genommen sinnfrei. Das Ganze bekommt erst Sinn, wenn man so einen Punkt anklicken kann und es poppt ein popup mit Inhalt auf. Das kann ich derzeit natürlich nicht.

Alle (ja, alle Sprachen! Ich kann die Sprachselektion noch nicht) Wikipedia-Artikel mit Ortsbezug Berlin auf OSM-Karte anzeigen geht so (der Codeschnipsel muss in das linke Fenster von http://overpass-turbo.eu - dann "Run" drücken / lokal abspeichern / in das MAP-Widget wie oben erklärt einbinden):

[out:json][timeout:900];
// fetch area "London" to search in
{{geocodeArea:Berlin}}->.searchArea;
// gather results
(
  // query part for: "wikipedia=*"
  node["wikipedia"](area.searchArea);
);
// print results
out body;
>;
out skel qt;


@eki
Ich habe noch nicht vergessen, dass ich einen Neuentwurf des Wiki-Artikels schreiben will.
RPI 4 - Jeelink HomeMatic Z-Wave

eki

ZitatMeine Übung (Schrittchen für Schrittchen) ist für sich genommen sinnfrei. Das Ganze bekommt erst Sinn, wenn man so einen Punkt anklicken kann und es poppt ein popup mit Inhalt auf. Das kann ich derzeit natürlich nicht.

Du kannst für jedes features (also für jedes Objekt im GEOJSON) definieren, ob und was per Popup dargestellt werden soll. Was fehlt Dir da noch?

Vielleicht noch mal zum eigentlichen Grund aus meiner Sicht zur Erstellung des Widgets: Ich wollte hauptsächlich FHEM Daten auf der Karte darstellen. Die sind natürlich hoch dynamisch (z.B. Anwesenheitsstatus der Mitbewohner, Verkerhssituation auf dem Arbeitsweg, ...). Das mit dem GEOJSON war nur ein Zusatz, aber auch da könnte man natürlich dynamisch Files aus FHEM generieren und dann anzeigen.