JavaScript API 1.0

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

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

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

Прежде чем использовать функции API, необходимо вставить JavaScript-файл.
Для этого добавьте в тело body HTML-страницы строку следующего вида: 

<body>
    ...
    <script src="http://gisfile.com/api/1.0/?lat=50.450&lon=30.524&z=11&width=100%&height=300" type="text/javascript" charset="utf-8"></script>
    ...
</body>

По адресу http://gisfile.com/api/1.0/ находится JavaScript загрузчик, который при обращении к нему подключает нужные JavaScript API компоненты.

Шаг 2. Заполните параметры отображения карты

В строке src для загрузки JavaScript, заполните параметры отображения карты: lat=50.450 - широта, lon=30.524 - долгота, z=11 - масштаб, width=100% - ширина контейнера карты, height=300 - высота контейнера.


Совет. Уникальный идентификатор (id) контейнера также можно использовать, только в этом случае необходимо JavaScript-файл с параметром id вставить в блок head, а в теле body вставить контейнер. 
<head>
    ...
    <script src="http://gisfile.com/api/1.0/?icon=gisfile&name=Киев&note=Столица Украины&lat=50.450&lon=30.524&z=16&id=map" type="text/javascript" charset="utf-8"></script>
    ...
</head>
<body>
    ...
    <div id="map" style="width: 100%; height: 300px"></div>
    ...
</body>
Шаг 3. Добавьте метку на карту

Отобразить метку, можно с помощью параметра icon. Значение icon=gisfile-blue позволяет указать наименование иконки для метки. Чтобы при нажатии кнопкой мыши на метке, отображалась дополнительная информация можно заполнить параметры name и/или note. Для отображения слоя используйте параметр layer=наименование слоя, для отображения карты map=наименование карты.


Совет. Если Вы используете кириллический текст в параметрах name или note, для корректного отображения, кодировка Веб-страницы должна быть UTF-8. При другой кодировке текста или текста с элементами Html используйте параметры xname или xnote в Hex формате.

Результат

Полный текст примера: 

<html>
<head>
    <title>Быстрый старт. Размещение интерактивной карты на странице</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <script src="http://gisfile.com/api/1.0/?icon=gisfile&name=Киев&note=Столица Украины&lat=50.450&lon=30.524&z=16&width=100%&height=300" type="text/javascript" charset="utf-8"></script>
</body>
</html>
Не получилось?

Если при работе с JavaScript API у Вас возникли дополнительные вопросы, посмотрите по ссылкам дополнительную информацию или отправьте нам Ваш вопрос с помощью формы обратной связи.