Выводим содержимое CSV-файла на Яндекс.Карту

Если у Вас есть данные о точках в Excel со значениями координат, удобно было бы вывести их на карту сохранив в текстовом файле с разделителями (CSV).

Кроме этого, Вы легко можете отредактировать содержимое CSV-файла при необходимости в любом текстовом редакторе.

Как осуществить вывод содержимого CSV-файла на Яндекс.Карту, я расскажу в данной заметке.

В самом начале нам необходимо подготовить исходный файл с данными.

Для примера, я буду использовать информацию об автосалонах Нижнего Новгорода.

Вот исходный файл: avto_markers.csv

Посмотрим его структуру.

Он состоит из шести колонок.

В первой хранится порядковый номер записи в таблице.

Во-второй — название автосалона.

В третьей — адрес.

В четвертой номер телефона.

Пятая и шестая служат для хранения значений географических координат.

Каждая колонка отделена друг от друга точкой с запятой.

Мы будем загружать наш файл avto_markers.csv через AJAX, используя возможности встроенной в API Яндекс.Карт javascript-библиотеки Jquery.

Посмотреть пример в действии

Рассмотрим код примера подробно.

В самом начале, мы как обычно подключаем API Яндекс.Карт и определяем нашу карту, задаем ее начальные центр, масштаб, добавляем необходимые элементы управления.

Далее мы загружаем файл с данными о метках.

Разделяем на строки, а строки на столбцы в строчках:

var rows = data.split("n");

var colls=rows[i].split(";");

Затем, создаем метки placemark, задаем стиль отображения значка метки используя стиль из API — default#carIcon.

Задаем содержимое балуна, отображаемое при клике по метке.

placemark.name = ‘<div style="color:#ff0303;font-weight:bold">’+colls[1]+'</div>’;
placemark.description = ‘<strong>Адрес:</strong> ‘+colls[2]+'<br /><strong>Телефон:</strong> ‘+colls[3];

После этого, добавляем метку на карту.

Далее, мы создаем пункт в меню для данной метки.

При нажатии на ссылку в меню, вызывается функция go_point, в которой происходит центрирование карты в точку с координатами метки, а также показывается балун с информацией.

Загрузить архив с файлами примера.