Please go to your map and drag and drop your map to the position you wish. You can also zoom in your map a little bit with mouse wheel or zoom cotrols on the bottom right corner of the map. Please remember to save your map after any changes. Hope that helps.
You can add a simple marker to the map at a desired location by instantiating the marker class and specifying the position to be marked using latlng, as shown below.
An immutable class representing a latitude/longitude aligned rectangle.
The API is available for developers that have a free Google Maps API key. Usage of the API is not strictly free, but they do offer $200 of free monthly usage for most users. The pricing scales to fit your particular needs and you are only charged for your API usage.
I've also find this fix that zooms to fit all markers
LatLngList: an array of instances of latLng, for example:
// "map" is an instance of GMap3
var LatLngList = [
new google.maps.LatLng (52.537,-2.061),
new google.maps.LatLng (52.564,-2.017)
],
latlngbounds = new google.maps.LatLngBounds();
LatLngList.forEach(function(latLng){
latlngbounds.extend(latLng);
});
// or with ES6:
// for( var latLng of LatLngList)
// latlngbounds.extend(latLng);
map.setCenter(latlngbounds.getCenter());
map.fitBounds(latlngbounds);
In case you prefer more functional style:
// map - instance of google Map v3
// markers - array of Markers
var bounds = markers.reduce(function(bounds, marker) {
return bounds.extend(marker.getPosition());
}, new google.maps.LatLngBounds());
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
Try this function....it works...
$(function() {
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
var latlng_pos=[];
var j=0;
$(".property_item").each(function(){
latlng_pos[j]=new google.maps.LatLng($(this).find(".latitude").val(),$(this).find(".longitude").val());
j++;
var marker = new google.maps.Marker({
position: new google.maps.LatLng($(this).find(".latitude").val(),$(this).find(".longitude").val()),
// position: new google.maps.LatLng(-35.397, 150.640),
map: map
});
}
);
// map: an instance of google.maps.Map object
// latlng: an array of google.maps.LatLng objects
var latlngbounds = new google.maps.LatLngBounds( );
for ( var i = 0; i < latlng_pos.length; i++ ) {
latlngbounds.extend( latlng_pos[ i ] );
}
map.fitBounds( latlngbounds );
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With