google maps: automatically open the streetview of a map
see: http://stackoverflow.com/questions/14290794/google-map-street-view-with-postcode/14294322#14294322
by SaulBurgos
HTML
<script src="http://maps.googleapis.com/maps/api/js?sensor=false&.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="map_canvas" style="height:300px">map</div>
<button id="getImage">get image</button>
<img id="finalImage" src="" alt="">
JavaScript
google.maps.event.addDomListener(window, 'load', function() {
var map;
var geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(1.280095,103.850949);
var mapOptions = {
center: latlng,
zoom:5,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);
console.log(map.streetView)
var locations = ['189969'];
function codeAddress(locations) {
for (i = 0; i < locations.length; i++) {
geocoder.geocode( { 'address': locations[i]}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
// map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
map.streetView.setPosition(results[0].geometry.location);
map.streetView.setVisible(true);
map.streetView.addListener('pov_changed', function() {
console.log(map.streetView.getPov());
});
$('#getImage').on('click',function(){
$('#finalImage').attr('src','https://maps.googleapis.com/maps/api/streetview?size=600x300&location=' +
map.streetView.getPosition().toUrlValue() + '&heading=' + map.streetView.getPov().heading + '&pitch=' + map.streetView.getPov().pitch );
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
codeAddress(locations);
});