"Christmas - the time to fix the computers of your loved ones" « Lord Wyrm

Wie integriert man ein Widget in eine HTML Seite?

noir 15.08.2020 - 14:42 4100 7
Posts

noir

Overclocking Team Member
Avatar
Registered: Dec 2007
Location: Salzburg/OÖ
Posts: 2301
Hallo,

Ich hab von Web Entwicklung nicht wirklich Ahnung aber sollte es nicht einfach möglich sein
ein .html File zu erstellen, seinen "Code" rein packen und es via Browser auf zu machen
und dann sollte z.b. ein Javascript auch laufen

genauer gesagt geht es mir hier jetzt um ein Open Weather Map Widget das ich gerne in meine Visualisierung einbinden möchte
den Code für das Widget bekommt man direkt von der Seite https://openweathermap.org
man muss dort dann nur einen Kostenlosen Account erstellen damit man eine ID / Key für die API bekommt

Ich hätte es jetzt mal mit einem .html File versucht das so aussieht
Leider tut sich hier garnichts und ich kann es mir nicht wirklich erklären wieso

Code:
<!DOCTYPE html>
<html>
<body>

<h1>Open Weather Map Widget Test</h1>

<div id="openweathermap-widget-15"></div>

<script>window.myWidgetParam ? window.myWidgetParam : window.myWidgetParam = [];  
window.myWidgetParam.push({
		id: 15,
		cityid: '7871965',
		appid: 'xxxxxxxx',
		units: 'metric',
		containerid: 'openweathermap-widget-15',  
		});  
(function() {
	var script = document.createElement('script');
	script.async = true;
	script.charset = "utf-8";
	script.src = "https://openweathermap.org/themes/openweathermap/assets/vendor/owm/js/weather-widget-generator.js";
	var s = document.getElementsByTagName('script')[0];
	s.parentNode.insertBefore(script, s);  
	})();
</script>

</body>
</html>

Neo1010

.
Registered: May 2003
Location: -
Posts: 1209
du darfst nicht einfach das .html öffnen mit dem Browser sondern müsstest es mit einem Webserver laufen lassen:

Ohne Webserver, findet er die Files nicht bzw. sucht falsch:

click to enlarge


Mit Webserver passt der Pfad:
click to enlarge

noir

Overclocking Team Member
Avatar
Registered: Dec 2007
Location: Salzburg/OÖ
Posts: 2301
Ah ok Danke

Irgendwelche Möglichkeiten so etwas Lokal zu testen gibt es nicht oder?
Bearbeitet von noir am 15.08.2020, 16:07

Viper780

Er ist tot, Jim!
Avatar
Registered: Mar 2001
Location: Wien
Posts: 48756
Lokal einen Webserver starten und auf localhost aufrufen

Gegi

Here to stay
Registered: Jan 2001
Location: Wien
Posts: 773
Zitat aus einem Post von noir
Ah ok Danke

Irgendwelche Möglichkeiten so etwas Lokal zu testen gibt es nicht oder?

Du brauchst eben einen lokalen webserver auf deiner maschine. Da gibt's ca. eine Million Optionen... Welches OS hast du?

Barokai

Big d00d
Avatar
Registered: Sep 2012
Location: Mühl4tel - PE
Posts: 291
VS code als editor mit live server extension wär eine möglichkeit, sollte auch halbwegs platformunabhängig sein https://marketplace.visualstudio.co...kdey.LiveServer

noir

Overclocking Team Member
Avatar
Registered: Dec 2007
Location: Salzburg/OÖ
Posts: 2301
Ich probier das mit Visual Studio mal
zur Not setze ich mir einen Raspberry Webserver auf

Danke

Vinci

hatin' on summer
Registered: Jan 2003
Location: Wien
Posts: 5773
Code: PY
python -m http.server

Im selben Ordner ausführen, simpler wirds nicht mehr. :)

https://docs.python.org/3/library/http.server.html
Kontakt | Unser Forum | Über overclockers.at | Impressum | Datenschutz