Как найти пользовательские накладки внутри уличного обзора?

Question

Привет, я искал все веб-страницы и stackoverflow.

Кто-нибудь знает, как найти пользовательский оверлей в определенной позиции внутри улиц?

Вот пример:

Night Walk

В этом туре вы можете видеть, что есть некоторые иконки и элементы, расположенные в определенных местах.

Кто-нибудь знает, как это сделать? Это потрясающе, и я хочу знать, как это сделать.

У меня есть опыт работы с API-интерфейсами Google maps javascript, но я не могу этого сделать.

---

Я решил эту проблему с этой библиотекой https://github.com/marmat/google-maps-api-addons

Это результат: http://www.paneek.net/#/home

Answer 1

Я думаю, что это может иметь отношение: https://developers.google.com/maps/documentation/javascript/examples/streetview-overlays

Это пример размещения маркеры местоположения на карта улиц. Сначала определяет местоположение места, затем определяет маркер, придавая ему свойства, такие как значок и имя.

var map; 
var panorama; 
var astorPlace = new google.maps.LatLng(40.729884, -73.990988); 
var busStop = new google.maps.LatLng(40.729559678851025, -73.99074196815491); 
var cafe = new google.maps.LatLng(40.730031233910694, -73.99142861366272); 
var bank = new google.maps.LatLng(40.72968163306612, -73.9911389350891); 

function initialize() { 

    // Set up the map 
    var mapOptions = { 
    center: astorPlace, 
    zoom: 18, 
    streetViewControl: false 
    }; 
    map = new google.maps.Map(document.getElementById('map-canvas'), 
     mapOptions); 

    // Setup the markers on the map 
    var cafeMarker = new google.maps.Marker({ 
     position: cafe, 
     map: map, 
     icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00', 
     title: 'Cafe' 
    }); 

    var bankMarker = new google.maps.Marker({ 
     position: bank, 
     map: map, 
     icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=dollar|FFFF00', 
     title: 'Bank' 
    }); 

    var busMarker = new google.maps.Marker({ 
     position: busStop, 
     map: map, 
     icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=bus|FFFF00', 
     title: 'Bus Stop' 
    }); 

    // We get the map's default panorama and set up some defaults. 
    // Note that we don't yet set it visible. 
    panorama = map.getStreetView(); 
    panorama.setPosition(astorPlace); 
    panorama.setPov(/** @type {google.maps.StreetViewPov} */({ 
    heading: 265, 
    pitch: 0 
    })); 
} 

function toggleStreetView() { 
    var toggle = panorama.getVisible(); 
    if (toggle == false) { 
    panorama.setVisible(true); 
    } else { 
    panorama.setVisible(false); 
    } 
} 

google.maps.event.addDomListener(window, 'load', initialize); 

Answer 2

Я нашел это, глядя, как достичь такой же вещь:

• http://projects.teammaps.com/projects/streetviewoverlay/streetviewoverlay.htm
• http://projects.teammaps.com/projects/streetviewtour/tour.htm

Я до сих пор ищет решение, и я нашел некоторые хорошие библиотеки, внешние для служб google:

• http://leandigo.github.io/leanorama/ довольно хорошо, но выглядит как поддержка оленья кожа светлячок
• http://photo-sphere-viewer.js.org/markers.html - лучший вариант имхо

Действительно, используя решение вне API Google имеет за и против - но это evalutation до вас.