gmap v2 -> v3 ( custom marker not showing + how to add the php address )
Here is my v2 code that works ( marker didnt show )
<body onload="load()">
<div id="map_canvas" style="width: 520px; height: 370px"></div>
<script type="text/javascript">
var userLocation = '<?php echo $address; ?>';
if (GBrowserIsCompatible()) { var geocoder = new GClientGeocoder(); geocoder.getLocations(userLocation, function (locations) {
if (locations.Placemark) { var north = locations.Placemark[0].ExtendedData.LatLonBox.north; var south = locations.Placemark[0].ExtendedData.LatLonBox.south; var east = locations.Placemark[0].ExtendedData.LatLonBox.east; var west = locations.Placemark[0].ExtendedData.LatLonBox.west; var bounds = new GLatLngBounds(new GLatLng(south, west),
new GLatLng(north, east));
var map = new GMap2(document.getElementById("map_canvas"));
var Icon = new GIcon();
Icon.image = "images/422marker.png";
Icon.iconSize = new GSize(33, 50);
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
map.addOverlay(new GMarker(bounds.getCenter()), Icon);
}
}); }
Here is my v3 code ( marker does not show and not sure on how to utilise our php userLocation address scripting )
<body onload="load()">
<div id="map_canvas" style="width: 520px; height: 370px"></div>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var userLocation = '5th Avenue, New York';
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': userLocation}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
// Geolocation was sucessfull
// Set Marker Icon
var icon = new google.maps.MarkerImage('images/422marker.png',
new google.maps.Size(33,50),
new google.maps.Point(0,0),
new google.maps.Point(0,32));
// Move map to position and set zoom
map.setCenter(results[0].geometry.location);
map.setZoom(11);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title: userL开发者_运维百科ocation
//icon: icon
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
So the issue I have is as folows:
v2 :
The custom marker didnt show , so updated map to v3
v3 :
The custom marker does not show + not sure how to use our php code to center the map on our coords , fetched from another script ( which worked in v2 )
Any help appreciated.
You just need to pass the url for your custom image to icon key in the Marker initialisation
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title: 'userLocation',
icon: 'images/422marker.png'
});
精彩评论