Wetterdaten mittels NodeRed darstellen. Icons werden nicht dargestellt

[Lars (Gast)]

guten morgen,

mittels node red möchte ich mir gerne die Wetterdaten mit icons anzeigen 
lassen.

Doch leider werde mir nicht alle icons angezeigt.
Ich hole mir die Wetterdaten über openWeatherMap und extrahiere dann in 
einem function-node die einzelnen Daten.

Dahinter habe ich jeweils template nodes, welche mir die Icons anzegien 
lassen sollen.

<link rel="stylesheet" h_ref="/weather-icons/mycss/weather-icons-wind.css">
<div style="display: flex;height: 100%;justify-content: left;align-items: center;">
<i class="fa-2x wi {{msg.payload}}"></i>
</div>

(h_ref) im node ohne den Unterstrich

Diese Funktion habe ich in jedem node drinn, welches mir ein Icon 
anzeigen lassen soll.

Aus dem Funktionsblock kommt für das WindSpeedIcon:

{"topic":"WindSpeedIcon","payload":"wi-wind-beaufort-2","_msgid":"8413ae8e3382cdcb"}

und für die WindDirectionIcon

{"topic":"WindDirectionIcon","payload":"wi-from-s","_msgid":"e7630b765da23b51"}

https://erikflowers.github.io/weather-icons/
hier kann ich das Icon wi-from-s finden. auf der Gui seite von NodeRed 
wird mir dieses aber nicht angezeigt (das WindSpeedIcon aber schon)

[Spezi94 (Gast)]

Guten Morgen,

Hast du schon mal einen anderen Ort ausprobiert? Da hatte ein anderer 
User auch mal ein Problem mit dem Node-RED Dashboard und Weather Icons.
https://discourse.nodered.org/t/weather-icons-please-help-why-some-arent-loaded/48562

Hier wäre auch ein Link für eine Anleitung wie man ein Dashboard mit der 
OpenWeatherMap macht:
https://flows.nodered.org/flow/d7af9f5d6f6923324466c58ea4f0655f

[Johannes (Gast)]

Du musst dir auch die Info durchlesen.

To make a wind icon appear, you need to add 3 classes, the base icon class, the wind icon class, and then the direction you want it to face: class="wi wi-wind wi-from-e"

versuche mal für das WindDirectionIcon

<link rel="stylesheet" h_ref="/weather-icons/mycss/weather-icons-wind.css">
<div style="display: flex;height: 100%;justify-content: left;align-items: center;">
<i class="fa-2x wi wi-wind {{msg.payload}}"></i>
</div>