Vereinfachte All-in-One-Skripte
Verwendung eines einzelnen Skripts:
Oder mit einem Iframe:
Sie können bei Verwendung des Skripts auch eine Container-ID („div“-ID) angeben:
<div id='widget1' style='text-align: center'></div>
Zu guter Letzt können Sie auch den Anzeigestil ändern, indem Sie den
size
auf einen der folgenden ändern: xxl
, xlarge
, large
, medium
, small
, xsmall
. (Das visuelle Ergebnis finden Sie unten) Erweiterte Skripteinrichtung
Die grundlegende Integration ist einfach und unkompliziert. Sie müssen zunächst den folgenden Code hinzufügen:
<script src='https://aqicn.org/widgets/js/waqi-feed.v1.js'></script>
Fügen Sie dann einfach diesen anderen Code hinzu, um das Widget einzubinden:
Die Funktion „_waqiFeed“ übernimmt als Argument die Konfiguration für das Widget. Sie müssen lediglich die Station und den Anzeigestil ( size
) des Widgets definieren. Dies ist, was produziert wird:
Sie können auch die Container-ID („div“-ID) angeben, in der das Widget angezeigt werden soll:
<div id='widget2' style='text-align: center;border: 1px dashed #ccc;'></div>
Angabe des Anzeigeformats
Das Anzeigeformat kann geändert werden, indem der size
auf einen der folgenden geändert wird:
_waqiFeed({ _waqiFeed({ _waqiFeed({ _waqiFeed({ _waqiFeed({ |
Erweiterte Vorlagen-Engine
Durch Angabe der display
ist es möglich, den im Widget anzuzeigenden Text anzupassen. Um beispielsweise sowohl den Textnamen „AQI“ als auch die Aktualisierungszeit anzuzeigen (wie im Widget links gezeigt), können Sie den folgenden Code verwenden:
_waqiFeed({ display:"%cityname AQI is <span style='%style'>%impact (%aqiv)</span> <small>on %date</small>", station:"A373120" });
Die display
ist eine HTML-basierte Zeichenfolge und kann eines der folgenden Schlüsselwörter enthalten:
- „%cityname“ für den Namen der Stadt (z. B.
Beijing
), - „%aqi“ für den dekorierten AQI-Wert (z. B.
58
), - „%aqiv“ für den nicht dekorierten (Rohtext) AQI-Wert (z. B.
58
), - „%style“ für die CSS-Deklaration der dekorierten AQI-Details (z. B.
background-color: #ffde33;color:#000000;
), - „%Datum“ für den Zeitpunkt, zu dem der AQI aktualisiert wurde (z. B.
Wed 20:00
), - „%impact“ für die damit verbundene gesundheitliche Auswirkung (z. B.
Good
,Moderate
...) - „%attribution“ für die AQI-Datenzuordnung (z. B.
Beijing Environmental Protection Monitoring Center
) - „%details“ für die vollständigen AQI-Details (der Inhalt des Popups, das angezeigt wird, wenn die Maus über den AQI-Wert bewegt wird).
Hier ein paar Beispiele:
Angabe der Sprache
Sie können auch die zu verwendende Sprache angeben, indem Sie die Option lang
festlegen. Um beispielsweise das Widget auf Chinesisch einzubinden (wie rechts gezeigt), verwenden Sie den folgenden Code:
Die derzeit unterstützten Sprachen sind:
"en"
: English"cn"
: Chinese"jp"
: Japanese"es"
: Spanish"kr"
: Korean"ru"
: Russian"hk"
: Traditional Chinese"fr"
: French"pl"
: Polish"de"
: German"pt"
: Portuguese"vn"
: Vietnamese"it"
: Italian"id"
: Indonesian"nl"
: Dutch"fa"
: Persian"th"
: Thai"hu"
: Hungarian"el"
: Greek"ro"
: Romanian"bg"
: Bulgarian"ur"
: Urdu"hi"
: Hindi"ar"
: Arabic"sr"
: Serbian"bn"
: Bangla"hu"
: Hungarian"bs"
: Bosnian"hr"
: Croatian"tr"
: Turkish"uk"
: Ukrainian"cs"
: Czech"be"
: Belarusian"km"
: Khmer"lo"
: Lao Wenn nicht angegeben oder auf null
gesetzt, wird Englisch verwendet.
Weitere Fragen
Wenn Sie Fragen oder Anmerkungen haben, senden Sie uns eine Nachricht über das folgende Formular:
Beispiele
Klicken Sie auf eines der Widgets unten, um den zugehörigen Code anzuzeigen: