Добавить в корзинуПозвонить
Найти в Дзене
Amateur Radio Workshop | QSY.BY

QTH ЛОКАТОР НА БАЗЕ Yandex Map API JS

Ссылка на наш QTH- локатор для самых не терпеливых. QTH LOCATOR | AMATEUR RADIO WORKSHOP | QSY.BY Ну а для тех кто все-таки решил почитать дальше. Ребятушки всем привет. На многих радиолюбительских сайтах, да и не только процветает банальное воровство контента и интеллектуальной собственности. Как это касается картографических сервисов, да напрямую. Просто тупо вставляют чужую страницу к себе на сайт при помощи того же ifframe. И вроде бы ничего страшного. Но тут появляется очень много подводных камней. И один из них это лимиты к доступу по API к тому же Google Maps. И если бы сервис использовался на одном сайте, вероятнее тех же 1000 запросов в день хватило с лихвой. Но т.к. страница может быть встроена еще на пару десятков других сайтов и посещаемость их может быть как выше так и ниже. В итоге нарушаются требования бесплатного использования API. А это уже совсем другая история. Как минимум блокировка API ключа, а то и на денюжку можно попасть. К чему это предисловие. А вот к чему.
Оглавление

Ссылка на наш QTH- локатор для самых не терпеливых.

QTH LOCATOR | AMATEUR RADIO WORKSHOP | QSY.BY

Ну а для тех кто все-таки решил почитать дальше. Ребятушки всем привет. На многих радиолюбительских сайтах, да и не только процветает банальное воровство контента и интеллектуальной собственности. Как это касается картографических сервисов, да напрямую. Просто тупо вставляют чужую страницу к себе на сайт при помощи того же ifframe. И вроде бы ничего страшного.

Но тут появляется очень много подводных камней. И один из них это лимиты к доступу по API к тому же Google Maps. И если бы сервис использовался на одном сайте, вероятнее тех же 1000 запросов в день хватило с лихвой. Но т.к. страница может быть встроена еще на пару десятков других сайтов и посещаемость их может быть как выше так и ниже. В итоге нарушаются требования бесплатного использования API. А это уже совсем другая история. Как минимум блокировка API ключа, а то и на денюжку можно попасть.

К чему это предисловие. А вот к чему. Написал давече небольшой сервис на базе Yandex Map, чтобы как говориться каждый мог абсолютно бесплатно добавить к себе на сайт QTH локатор и не воровать контент.

Для начала разберемся с Yandex Map API, что это за зверь и с чем его едят. Для начала немного теории.

Что такое QTH-локатор

QTH-локатор — система приближенного указания местоположения объекта на поверхности земли, принятая в любительской радиосвязи. предназначена для определения расстояния между корреспондентами. известна также под названиями англ. grid square locator и англ. maidenhead locator system. название происходит от кодового выражения qth, которое означает «я нахожусь в …».
понятие qth – локатора как правило хорошо известно всем кто когда-либо работал на укв. с применением хорошей радиопередающей аппаратуры и увеличением перекрываемых расстояний на укв с 1 января 1985 года введена новая система qth-локатора.

Весь земной шар разбит на 324 сектора которые обозначаются двумя БОЛЬШИМИ буквами латинского алфавита и имеют следующие размеры:
– по широте – 10 градусов (1114,28 км);
– по долготе – 20 градусов (1560 км).

В свою очередь каждый такой сектор разбит еще на 100 больших квадратов которые обозначаются двумя ЦИФРАМИ и имеют следующие размерами:
– по широте – 1 градус (78 км);
– по долготе – 2 градуса (111,42 км).

Далее каждый такой большой квадрат разделен на 576 малых квадрата, эти малые квадраты обозначаются двумя МАЛЕНЬКИМИ буквами латинского алфавита и имеют следующие размерами:
– по широте – 2,5 минуты (4,64 км);
– по долготе – 5 минут (6,5 км).

Yandex Map API

Быстрый старт

Ниже приведены инструкции, как показать на странице простую карту.

  • Получите API-ключ
  • Подключите API
  • Создайте контейнер для карты
  • Создайте карту

Шаг 1. Получите API-ключ

Зайдите на страницу Кабинета Разработчика и нажмите кнопку Получить ключ. Во всплывающем окне выберите сервис «JavaScript API и HTTP Геокодер».

После заполнения формы появится надпись «Сервис успешно подключен». Созданный ключ будет доступен в разделе «Ключи». Его необходимо использовать в дальнейшем при подключении API.

Шаг 2. Подключите API

Добавьте в заголовок head HTML-страницы строку следующего вида:

  • <head>
  • <script src="//api-maps.yandex.ru/2.1/?apikey=ваш API-ключ&lang=ru_RU" type="text/javascript">
  • </script>
  • </head>

Шаг 3. Создайте контейнер для карты

Создайте видимый контейнер ненулевого размера, в котором будет размещена карта. В качестве контейнера может использоваться любой HTML-элемент блочного типа (например, элемент div). Карта заполнит этот элемент полностью.

  • <body>
  • <div id="map" style="width: 600px; height: 400px"></div>
  • </body>

Уникальный идентификатор контейнера (в примере это id=”map”) будет использоваться в следующем шаге для получения указателя на контейнер карты.

Шаг 4. Создайте карту

В JavaScript-коде создайте экземпляр карты. Конструктору нужно передать:
идентификатор HTML-контейнера;
центр карты;
коэффициент масштабирования.
Пример:

  • <script type="text/javascript">
  • // Функция ymaps.ready() будет вызвана, когда
  • // загрузятся все компоненты API, а также когда будет готово DOM-дерево.
  • ymaps.ready(init);
  • function init(){
  • // Создание карты.
  • var myMap = new ymaps.Map("map", {
  • // Координаты центра карты.
  • // Порядок по умолчанию: «широта, долгота».
  • // Чтобы не определять координаты центра карты вручную,
  • // воспользуйтесь инструментом Определение координат.
  • center: [55.76, 37.64],
  • // Уровень масштабирования. Допустимые значения:
  • // от 0 (весь мир) до 19.
  • zoom: 7
  • });
  • }
  • </script>

Поверяем работоспособность.

Клонируем репозиторий на GITHUB и в файле index.html вставляем свой ключь API полученный у Yandex.

  • <script src="//api-maps.yandex.ru/2.1/?apikey=ваш API-ключ8&lang=ru_RU" type="text/javascript">

Вот и все. Вставляем к себе на сайт удобным способом. Файлы проекта можно редактировать и допиливать и делать что душе угодно. Единственная просьба, это ссылка на проект и автора.

#qth #qth locator #радиолюбители #радиолюбитель #yandex map api js