04.12.2018, 18:06
|
Аспирант
|
|
Регистрация: 18.06.2015
Сообщений: 38
|
|
Центрирование карты Yandex API с использованием функции геокодера
Здравствуйте, есть например код для вывода меток на карте по координатам.
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map("map", {
center: [55.76, 37.64],
zoom: 5,
controls: []
}, {
searchControlProvider: 'yandex#search'
});
myMap.controls.add('zoomControl');
myMap.geoObjects
.add(new ymaps.Placemark([55.753215, 37.622504], {
balloonContent: '<strong>Москва</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([59.939095, 30.315868], {
balloonContent: '<strong>Санкт-Петербург</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([54.513845, 36.261215], {
balloonContent: '<strong>Калуга</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([52.970371, 36.063837], {
balloonContent: '<strong>Орёл</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
}
Хотелось бы центрировать карту для местоположения пользовтеля на основе данных геокодера. То есть я например ищу с помощью PHP и GeoIP город посетителя сайта и мне нужно на основе полученного города, например "Omsk" центрировать карту в городе Омск. Я так понял это можно сделать на основе геокодера.
Один только вопрос, куда и главное КАК в моём коде вставить значение переменной coords полученной из результатов выполнения этой функции:
function init() {
var myMap = new ymaps.Map('map', {
center: [55.753994, 37.622093],
zoom: 9
});
// Поиск координат центра Нижнего Новгорода.
ymaps.geocode('omsk', {
/**
* Опции запроса
* @see [url]https://api.yandex.ru/maps/doc/jsapi/2.1/ref/reference/geocode.xml[/url]
*/
// Сортировка результатов от центра окна карты.
// boundedBy: myMap.getBounds(),
// strictBounds: true,
// Вместе с опцией boundedBy будет искать строго внутри области, указанной в boundedBy.
// Если нужен только один результат, экономим трафик пользователей.
results: 1
}).then(function (res) {
// Выбираем первый результат геокодирования.
var firstGeoObject = res.geoObjects.get(0),
// Координаты геообъекта.
coords = firstGeoObject.geometry.getCoordinates(),
// Область видимости геообъекта.
bounds = firstGeoObject.properties.get('boundedBy');
firstGeoObject.options.set('preset', 'islands#darkBlueDotIconWithCaption');
// Получаем строку с адресом и выводим в иконке геообъекта.
firstGeoObject.properties.set('iconCaption', firstGeoObject.getAddressLine());
// Добавляем первый найденный геообъект на карту.
myMap.geoObjects.add(firstGeoObject);
//myMap.setCenter([60.629499,56.800015], 10);
// Масштабируем карту на область видимости геообъекта.
myMap.setBounds(bounds, {
// Проверяем наличие тайлов на данном масштабе.
checkZoomRange: true
});
/**
* Все данные в виде javascript-объекта.
*/
console.log('Все данные геообъекта: ', firstGeoObject.properties.getAll());
/**
* Метаданные запроса и ответа геокодера.
* @see [url]https://api.yandex.ru/maps/doc/geocoder/desc/reference/GeocoderResponseMetaData.xml[/url]
*/
console.log('Метаданные ответа геокодера: ', res.metaData);
/**
* Метаданные геокодера, возвращаемые для найденного объекта.
* @see [url]https://api.yandex.ru/maps/doc/geocoder/desc/reference/GeocoderMetaData.xml[/url]
*/
console.log('Метаданные геокодера: ', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData'));
/**
* Точность ответа (precision) возвращается только для домов.
* @see [url]https://api.yandex.ru/maps/doc/geocoder/desc/reference/precision.xml[/url]
*/
console.log('precision', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData.precision'));
/**
* Тип найденного объекта (kind).
* @see [url]https://api.yandex.ru/maps/doc/geocoder/desc/reference/kind.xml[/url]
*/
console.log('Тип геообъекта: %s', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData.kind'));
console.log('Название объекта: %s', firstGeoObject.properties.get('name'));
console.log('Описание объекта: %s', firstGeoObject.properties.get('description'));
console.log('Полное описание объекта: %s', firstGeoObject.properties.get('text'));
/**
* Прямые методы для работы с результатами геокодирования.
* @see [url]https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/reference/GeocodeResult-docpage/#getAddressLine[/url]
*/
console.log('\nГосударство: %s', firstGeoObject.getCountry());
console.log('Населенный пункт: %s', firstGeoObject.getLocalities().join(', '));
console.log('Адрес объекта: %s', firstGeoObject.getAddressLine());
console.log('Наименование здания: %s', firstGeoObject.getPremise() || '-');
console.log('Номер здания: %s', firstGeoObject.getPremiseNumber() || '-');
/**
* Если нужно добавить по найденным геокодером координатам метку со своими стилями и контентом балуна, создаем новую метку по координатам найденной и добавляем ее на карту вместо найденной.
*/
/**
var myPlacemark = new ymaps.Placemark(coords, {
iconContent: 'моя метка',
balloonContent: 'Содержимое балуна <strong>моей метки</strong>'
}, {
preset: 'islands#violetStretchyIcon'
});
myMap.geoObjects.add(myPlacemark);
*/
});
}
|
|
04.12.2018, 18:16
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,112
|
|
mxup,
строка 33
myMap.setCenter(coords , 10);
|
|
04.12.2018, 18:32
|
Аспирант
|
|
Регистрация: 18.06.2015
Сообщений: 38
|
|
Сообщение от рони
|
mxup,
строка 33
myMap.setCenter(coords , 10);
|
Спасибо ,а как бы объединить эти две функции , а то они обе у меня с названием function init() и пересекаются.
То есть как воткнуть одну в другую?
Ну ещё можно другими словами сказать ,чтобы одним сплошным кодом это всё было)
|
|
04.12.2018, 18:46
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,112
|
|
mxup,
function init() {
var myMap = new ymaps.Map("map", {center:[55.753994, 37.622093], zoom:9});
ymaps.geocode("omsk", {results:1}).then(function(res) {
var firstGeoObject = res.geoObjects.get(0),
coords = firstGeoObject.geometry.getCoordinates(),
bounds = firstGeoObject.properties.get("boundedBy");
firstGeoObject.options.set("preset", "islands#darkBlueDotIconWithCaption");
firstGeoObject.properties.set("iconCaption", firstGeoObject.getAddressLine());
myMap.geoObjects
.add(firstGeoObject)
.add(new ymaps.Placemark([55.753215, 37.622504], {
balloonContent: '<strong>Москва</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([59.939095, 30.315868], {
balloonContent: '<strong>Санкт-Петербург</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([54.513845, 36.261215], {
balloonContent: '<strong>Калуга</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
.add(new ymaps.Placemark([52.970371, 36.063837], {
balloonContent: '<strong>Орёл</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
}))
myMap.setCenter(coords, 10);
myMap.setBounds(bounds, {checkZoomRange:true});
});
};
|
|
04.12.2018, 18:50
|
Профессор
|
|
Регистрация: 04.12.2012
Сообщений: 3,791
|
|
ymaps.ready(function() {
const mapCenter = [55.76, 37.64];
const cities = [{
title: 'Москва',
coordinates: [55.753215, 37.622504]
}, {
title: '59.939095, 30.315868',
coordinates: [55.753215, 37.622504]
}];
const Map = new ymaps.Map("map", {
center: mapCenter,
zoom: 5,
controls: ['zoomControl']
}, {
searchControlProvider: 'yandex#search'
});
cities.forEach(function(city) {
const Marker = new ymaps.Placemark(city.coordinates, {
balloonContent: '<strong>' + city.title + '</strong>'
}, {
preset: 'islands#icon',
iconColor: '#0095b6'
});
Map.geoObjects.add(Marker);
});
ymaps.geocode('omsk', {
results: 1
}).then(function(res) {
Map.setCenter(
res.geoObjects.get(0).geometry.getCoordinates()
);
});
});
|
|
04.12.2018, 19:23
|
|
Профессор
|
|
Регистрация: 25.10.2016
Сообщений: 1,012
|
|
имхо, правильнее бы создать карту после получения результата геокодера, сразу с нормальными координатами. Так мы быстрее приедем куда надо, не засоряя сеть получением тайлов для окрестностей [55.76, 37.64]
|
|
|
|