Мапа квалитета ваздуха у реалном времену пројекта Светски индекс квалитета ваздуха може се уградити на било коју веб страницу помоћу једне ознаке скрипте. Мапа приказује индекс квалитета ваздуха уживо свих станица за праћење око изабране локације и аутоматски се ажурира.

Копирајте код испод где би требало да се појави мапа на вашој страници:

<script src="https://aqicn.org/maplet/embed.v1.js"
        data-city="london"
        data-lat="51.5074" data-lng="-0.1278" data-zoom="11"
        data-lang="sr"
        data-height="450"></script>

Резултат (померите или зумирајте мапу да бисте ажурирали горњи код):

Да бисте избегли кашњење у приказивању странице, скрипта се може учитати асинхроно, помоћу атрибута async или defer . Пошто се скрипта тада не покреће на својој позицији на страници, атрибут data-dom-target је потребан да би се одредио елемент у који се убацује мапа. Елемент се може поставити било где на страници, пре или после ознаке script.

<div id="aqi-map"></div>

<script async src="https://aqicn.org/maplet/embed.v1.js"
        data-city="paris"
        data-lang="sr"
        data-dom-target="aqi-map"
        data-height="450"></script>

Резултат:

Учитавање скрипте из ЈаваСкрипта

Скрипта се такође може динамички уметнути, на пример из менаџера ознака или апликације са једном страницом. Примењује се исто правило data-dom-target :

<div id="aqi-map"></div>

<script>
  var s = document.createElement("script");
  s.src = "https://aqicn.org/maplet/embed.v1.js";
  s.setAttribute("data-city", "london");
  s.setAttribute("data-dom-target", "aqi-map");
  s.setAttribute("data-lang", "sr");
  document.head.appendChild(s);
</script>

Мапа је конфигурисана са следећим атрибутима ознаке скрипте. Сви су опциони, осим data-dom-target за асинхроно учитавање.

Неколико мапа може бити уграђено на исту страницу: користите једну ознаку скрипте по мапи.

Попуните доленаведене опције да бисте добили код за вашу мапу и прегледали је.

• Линкови на мапи (нпр. детаљи станице) се отварају у новој картици, тако да посетиоци не напуштају вашу страницу.
• Мапа се може уградити на било коју веб страницу која се приказује преко http или https протокола. Не може се приказати са странице отворене као локална датотека ( file:// ).
• Ако је мапа смештена у заштићеном iframe-у, заштићено окружење мора бар да дозволи allow-scripts allow-same-origin allow-popups .
• Молимо вас да не уклањате или скривате приписивање пројекту Светског индекса квалитета ваздуха и изворима података.

Директно коришћење iframe-а

Ако не можете да додате скрипте на своју страницу, мапа се може уградити и помоћу обичног iframe-а. Локација је део URL-а, а приказ се подешава параметрима lat , lng и zoom :

<iframe src="https://aqicn.org/maplet/london/sr/?lat=51.5074&lng=-0.1278&zoom=11"
        width="100%" height="450" style="border:0" loading="lazy"
        title="Real-time air quality map"></iframe>