Карта распространения короновируса у себя на сайте

В интернете появилось много подобных сайтов, а так же стало популярно размещать у себя на сайте подобные карты с распространением короновируса. На самом деле такой подход можно использовать ко многим вещам, а не только болезням. Так как в графическом виде информация для большинства людей выглядит более наглядно и понятно.
Тут я не буду останавливаться на политических и моральных аспектах подобной информации на своём сайте. Меня интересует более технический подход, как всё это делается и от куда берется подобная информация.

Как разместить карту у себя на сайте

Можно конечно сделать всё с нуля, но в большинстве случаев изобретать новый велосипед просто не имеет смысла. Существует довольно много различных платформ для работы с картографической информацией. Самые популярные у нас это Google Maps и Yandex Maps. Кроме этих популярных платформ есть несколько более свободных аналогов с более простой лицензией, например OpenStreetMap. С помощью этих платформ можно создать свою карту с любой информацией, в том числе и по распространению короновируса ( COVID-19 ).

Конечно заполнить всё это информацией и поддерживать в актуальном состоянии это очень сложно и затрудненно. Поэтому проще взять и использовать уже готовую карту которой занимаются профессионалы. Актуальность и вся правдивость такой информации ложится уже на плечи её создателей.

Собственно мы подошли к вопросу о том как всё это делается. И мне видится два пути:

  1. Создать свою карту на основе готового движка и заниматься её поддержкой и актуальностью
  2. Взять уже готовую карту и разместить у себя её код.

В случае второго пути всё очень просто и остаётся только использовать готовый код у себя на сайте. Именно такой подход я покажу прям сейчас как можно реальзивать у себя на сайте.

Размещаем карту covid19 у себя на сайте

В свободном доступе я нашёл карту от Яндекса, которую легко можно скопировать и разместить у себя на сайте. Вот её код:

<div style="position:relative;overflow:hidden;"><a href="https://yandex.ru/maps?utm_medium=mapframe&utm_source=maps" style="color:#eee;font-size:12px;position:absolute;top:0px;">Яндекс.Карты</a><a href="https://yandex.ru/maps/covid19?ll=41.775580%2C54.894027&utm_medium=mapframe&utm_source=maps&z=3" style="color:#eee;font-size:12px;position:absolute;top:14px;">Яндекс.Карты</a><iframe src="https://yandex.ru/maps/covid19?embed=covid-map" width="560" height="400" frameborder="1" allowfullscreen="true" style="position:relative;"></iframe></div>

Вам остаётся только скопировать этот код к себе на сайт и в итоге вы получите что-то подобное что видите ниже:

 

Яндекс.КартыЯндекс.Карты
Если не нравится конкретно эта карта, можете попробовать поискать другие, я думаю их много в сети.
Например есть ещё вот такая:


Растянуть, поменять дизайн или изменить какую-то информацию возможно прям на лету используя JavaScript и тут хватит навыков самого начинающего программиста. Если возникают с этим трудности всегда можно обратиться на биржу фриланса и там найдется куча народу которые за минимальные деньги помогут с этим вопросом. В самом сложном случае можете написать мне.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *