Клуб API Карт

Как показать панораму определенного адреса

webpostnikof
26 июля 2016, 20:30

Всем привет. Подскажите пожалуйста возможно ли показать панораму соответствующую определенному адресу, например в <input> вводим адрес "москва тургенева 12" и получаем панораму этого адреса. Видимо копать нужно в сторону геокодера, с него получать координаты и подставлять их в панораму. Но как это реализовать не совсем представляю. Заранее спасибо

15 комментариев
Подписаться на комментарии к посту
Добрый день. А в чем именно проблема? Вы совершенно верно описали последовательность действий.
Сейчас я использую геокодер для отрисовки карты с адресом так:
ymaps.geocode('<?php echo (get_post_meta($post->ID, 'adress', true)); ?>', {
results: 1 
}).then(function (res) {
var firstGeoObject = res.geoObjects.get(0),
coords = firstGeoObject.geometry.getCoordinates(),
bounds = firstGeoObject.properties.get('boundedBy');
myMap.geoObjects.add(firstGeoObject);
myMap.setBounds(bounds, {
checkZoomRange: true
});
console.log('Метаданные геокодера: ', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData'));
console.log('precision', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData.precision'));
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'));
});


А как вытащить координаты в панораму не совсем понимаю
webpostnikof,
Они у вас уже вытащены
...
coords = firstGeoObject.geometry.getCoordinates(),
...




ymaps.panorama.locate(coords).done(...)
dimik,

Извиняюсь за задержку с ответами.
Т.е. нужна такая конструкция(мне нужна и карта и панорама рядом) :
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map('map', {
center: [55.753994, 37.622093],
zoom: 9
});
ymaps.geocode('ТУТ АДРЕС', {
results: 1
}).then(function (res) {
var firstGeoObject = res.geoObjects.get(0),
coords = firstGeoObject.geometry.getCoordinates(),
bounds = firstGeoObject.properties.get('boundedBy');
myMap.geoObjects.add(firstGeoObject);
myMap.setBounds(bounds, {
checkZoomRange: true
});
console.log('Все данные геообъекта: ', firstGeoObject.properties.getAll());
console.log('Метаданные ответа геокодера: ', res.metaData);
console.log('Метаданные геокодера: ', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData'));
console.log('precision', firstGeoObject.properties.get('metaDataProperty.GeocoderMetaData.precision'));
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'));
});
if (!ymaps.panorama.isSupported()) {
return;
}
ymaps.panorama.locate(coords).done(
function (panoramas) {
if (panoramas.length > 0) {
var player = new ymaps.panorama.Player(
'player1',
panoramas[0],
{ direction: [256, 16] }
);
}
},
function (error) {
alert(error.message);
}
);
}


в консоли тогда ошибка что функция isSupported неизвестна, получается стандартное подключение API через <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"> грузит не все компоненты (хотя в документации написано что по умолчанию все)? как подключить функции панорамы?
пробовал добавить модуль панорамы через ymaps.modules.require, та же ошибка
webpostnikof,
Там надо прописать модули панорамы в параметре load урла подключения АПИ.
См. пример в песочнице (вкладка html)
https://tech.yandex.ru/maps/jsbox/2.1/panorama_basics
dimik,
если прописывать модули при загрузке API как в примере <script src="//api-maps.yandex.ru/2.1/?lang=ru_RU&load=panorama.isSupported,panorama.locate,panorama.createPlayer,panorama.Player" type="text/javascript"></script>, то консоль ругается Uncaught TypeError: ymaps.Map is not a constructor  и не работает ни карта ни панорама
webpostnikof,
Мда, попробуйте прописать дополнительно package.full


&load=package.full,panorama.isSupported,...
dimik,
спасибо за подсказку,модули панорамы грузятся, только координаты из геокодера не берет Uncaught ReferenceError: coords is not defined 
в этой строке ymaps.panorama.locate(coords).done(
webpostnikof,
 Используйте возможности интерфейса Promise A+ при работе с асинхронными вызовами

ymaps.geocode('ТУТ АДРЕС', {results: 1})
.then(function (res) {
  return res.geoObjects.get(0).geometry.getCoordinates();
})
.then(function (coords) {
  return ymaps.panorama.locate(coords)
})
.then(function (panoramas) {
  if (panoramas.length > 0) {
    var player = new ymaps.panorama.Player('player1', panoramas[0], {direction: [256, 16]});
  }
})
.catch(function (error) {
  alert(error.message);
});

dimik,
а подскажите пожалуйста как в этом случае поставить метку на карте?так не работает
myMap.geoObjects.add(res.geoObjects.get(0));
myMap.setBounds(bounds, {
checkZoomRange: true
});

webpostnikof,
Добавлять на карту можно только в том обработчике then где есть
res.geoObjects.get(0) 


А вы карту создали? переменная myMap есть?
Создайте пример на jsfiddle.net, по коду в теле поста помочь чем либо очень трудно
dimik,
https://jsfiddle.net/tvh03e0q/

webpostnikof,
Ох, ну вы же вставили этот код после "return" в функцию.
Конечно он не работает.
поправил
dimik,
огромное спасибо Вам за помощь, все получилось