Hi Frendz,
I have placed my custom marker on google map in my application. But it displays default marker. Whats going wrong with this code?
var icon = new GIcon();
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);
icon.image = 'images/car_blue.png';
var marker = new GMarker(point, icon);
map.addOverlay(marker);Jump to PostCan you replace your code with this.
Also make sure image exists in given path.var new_icon = new GIcon(); new_icon.image = "images/car_blue.png" ; new_icon.size = new GSize(16,16) ; new_icon.iconAnchor = new GPoint(6, 20); new_icon.infoWindowAnchor = new GPoint(5,1) ; var marker = new GMarker(point, new_icon); map.addOverlay(marker);
Jump to PostTry this demo code.
See attached output image.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="
Can you replace your code with this.
Also make sure image exists in given path.
var new_icon = new GIcon();
new_icon.image = "images/car_blue.png" ;
new_icon.size = new GSize(16,16) ;
new_icon.iconAnchor = new GPoint(6, 20);
new_icon.infoWindowAnchor = new GPoint(5,1) ;
var marker = new GMarker(point, new_icon);
map.addOverlay(marker);Can you replace your code with this.
Also make sure image exists in given path.var new_icon = new GIcon(); new_icon.image = "images/car_blue.png" ; new_icon.size = new GSize(16,16) ; new_icon.iconAnchor = new GPoint(6, 20); new_icon.infoWindowAnchor = new GPoint(5,1) ; var marker = new GMarker(point, new_icon); map.addOverlay(marker);
Yes vibhadevit,
I have changed my code to yours. The image is also available in the given path. But default marker only displayed. There is no error in 'Error Console' too.
Can you give live link if possible?
Can you give live link if possible?
Its in my localhost
Try this demo code.
See attached output image.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAwoZubRYDwEsxPfeOl798iRS9zaDN-rzK-R-PNcf5yAaJ9r7Z4BTy9LU9DUBfJ7r-F6C7tX-2AidMHQ&sensor=true"
type="text/javascript"></script>
<script type="text/javascript">
function initialize()
{
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(23.005, 72.5959), 15);
map.setUIToDefault(); // will add top menu,left menu etc
var new_icon = new GIcon();
new_icon.image = "images/car_blue.png" ;
new_icon.size = new GSize(16,16) ;
new_icon.iconAnchor = new GPoint(6, 20);
new_icon.infoWindowAnchor = new GPoint(5,1) ;
var marker = new GMarker(new GLatLng(23.005, 72.5959), new_icon);
map.addOverlay(marker);
}
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 700px; height: 500px"></div>
</body>
</html>
Sorry last attachment was incorrect.
Ok.. Thanks yaar.. the problem is now solved.
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.
