I`m having trouble to center the map with the marker, here is the b*:
<iframe
width="555"
height="450"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=***&q=<? echo urlencode($address); ?>&zoom=14">
</iframe>
The map loads, but with the marker at the left top of the screen, so the user have to use the mouse to really put the desired area on the screen.
Anybody knows how to center the map with the marker position?
Sorry for the repeated question, but the anwsers i saw so far did not worked in my case.
Saddly i wasn`t able to make it work with the iframe, instead i used the JS way...
JS:
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(40.730885,-73.997383);
var mapOptions = {
scrollwheel: true,
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map"), mapOptions );
var address = 'address string';
geocoder.geocode(
{ 'address': address},
function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
marker = new google.maps.Marker({
draggable: true,
map: map,
position: results[0].geometry.location
});
} else {
//alert('Location not found.');
}
}
);
HTMl:
<div id="map-canvas">
<div id="map" style="width:555px;height:450px;"></div>
</div>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true"></script>
wich i was avoiding to use cause lead to another problem with CSS display as null when page loaded... but that was solved to (no reason to explain how cause wasn`t involved in the question ^^").
Anyway, if anyone find i solution for the iframe example, still would be interesting... but that`s all folks o/