Вывести метки на карту из БД MySql

Пост в архиве.

dmitrij.roganov

8 мая 2012, 15:42

Добрый день.

Подскажите, как вывести метки на карту из БД.

Вот структура таблицы, в которой хранятся метки

CREATE TABLE IF NOT EXISTS `point`(
                                   `id_point` INT(3) NOT NULL AUTO_INCREMENT,
                                   `name_point` VARCHAR(50),
                                   `description` VARCHAR(150),
                                   `id_city` INT(3) NOT NULL DEFAULT 0,
                                   `id_group` INT(3) NOT NULL DEFAULT 0,
                                   `latitude` VARCHAR(10) DEFAULT NULL,
                                   `longitude` VARCHAR(10) DEFAULT NULL,
                                   PRIMARY KEY(`id_point`),
                                   KEY (`id_group`),
                                   KEY(`id_city`)
                                   )ENGINE=MyISAM DEFAULT CHARSET=utf8;

С самим выводом информации из базы проблем нет, а вот как это всё разместить на карте?

15 комментариев

Авторизуйтесь, чтобы оставить комментарий

dimik

28 января 2016, 04:49

сформировать JSON, и забрать его AJAX-запросом

dmitrij.roganov

28 января 2016, 04:49

как из базы забрать у меня не возникает проблем.

Как на карту потом это нанести? как правильно подставить в js карты?

dimik

28 января 2016, 04:49

Например, с помощью jQuery так

var collection = new ymaps.GeoObjectCollection();$.get('/ajax/points.json', function (data) { for(var i = 0, len = data.length; i < len; i++) { collection.add(new ymaps.Placemark([data[i].lattitude, data[i].longitude], { balloonContent : data[i].description, hintContent : data[i].name })); });});
map.geoObjects.add(collection);

с сервера по адресу /ajax/points.json

должен отдаваться соответствующий JSON

[
{
name : 'точка 1',
description : 'описание точки 1',
lattitude : 55.7,
longitude : 37.5
}
]

dmitrij.roganov

28 января 2016, 04:49

ага, спасибо за примерчик, буду пробовать

dmitrij.roganov

28 января 2016, 04:49

Всё получилось, спасибо за помощь

dmitrij.roganov

28 января 2016, 04:49

Возник следующий вопрос.

Как после того, как будут вывидены все метки, при клике по метке, когда откроется балун запустить пользовательскую функцию?

Пробовал сделать так - ни чего не получилось.

Placemark.balloon.isOpen(selectGroup());
collection.add(Placemark);

dmitrij.roganov

28 января 2016, 04:49

Я так понимаю, что надо "повесить" клик на выбранную метку, подскажите, как правильно это сделать?

dimik

28 января 2016, 04:49

что вы хотите сделать в итоге при клике на метке?

отрыть балун или чтото другое?

dmitrij.roganov

28 января 2016, 04:49

когда загрузятся метки надо добавить возможность, чтобы когда открывался балун, то выполнялась функция, которая отправляла бы запрос на сервер и результат вставляла в список в балуне.

Это у меня работает, но только для отдельных меток, которые устанавливаются при клике по карте

pr-studio.kz

28 января 2016, 04:49

А если допустим несколько точек на карте которые надо выгрузить? если честно у меня не получаеться не срабатывает что то, даже просто выгрузить значения

dimik

28 января 2016, 04:49

вы попробуйте сначала просто отправить - получить данные.

и убедиться что они в нужном формате приходят

без привязки к карте

pr-studio.kz

28 января 2016, 04:49

Спасибо за столь быстрый ответ, дло в том что даже ответ не приходит в нужном мне формате(((

Алексей Павлов

18 декабря 2016, 12:47

dimik,

Привет! ты моя последняя надежда, мучаюсь уже около недели надо очень простым заданием. Куда тебе можно написать?

Божидар А.

15 августа 2018, 12:16

dmitrij.roganov,

А можете скинуть пример реализации?

dmitrij.roganov

19 августа 2018, 16:50

Божидар А.,

это было давно и код не сохранился)))
Но может Вам пригодится этот код.
Выводит на карту метки с заданными координатами. Сами координаты хранятся в базе данных.

ymaps.ready(function(){
var map = new ymaps.Map("map",{
'center': [<?= $lat ?>, <?= $lon ?>],
'zoom': 19,
'type': 'yandex#satellite'
})
var coords = [<?= $coord ?>];
var myCollection = new ymaps.GeoObjectCollection();
for(var i = 0; i < coords.length; i++){
myCollection.add(new ymaps.Placemark(coords[i],{iconContent: (i + 1)},{'preset':'islands#circleIcon'}))
}
map.geoObjects.add(myCollection)
});