Hi,
I wondered if anyone could help me?
I started this project a while ago and have just started further work
on it.
I have a map of my local town with tourist attractions mapped out, and
links to the markers appearing in a box below the map.
I would like to set up a series of different markers, one for hotels
another for restaurants each with a different marker symbol. For
example the following groups of markers could be:
attractions red markers
hotels blue markers
restaurants green markers
I am currently using the following script which is representing my
attractions the way i want them to appear but need to further it so
that it can display multiple marker groups as demonstrated above.
I would appreciate any help/direction.
<script type="text/javascript">
//<![CDATA[
var side_bar_html = "";
var gmarkers = [];
var i = 0;
function myclick(i) {
GEvent.trigger(gmarkers[i], "click");
}
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(52.202920, -1.718220), 13);
var mapTypeControl = new GMapTypeControl();
var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new
GSize(10,10));
var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT,
new GSize(10,10));
map.addControl(mapTypeControl, topRight);
GEvent.addListener(map, "dblclick", function() {
map.removeControl(mapTypeControl);
map.addControl(new GMapTypeControl(), bottomRight);
});
map.addControl(new GSmallMapControl());
}
function createMarker(point,name,html) {
var marker = new GMarker(point);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(html);
});
gmarkers[i] = marker;
side_bar_html += '<p class="map-links"><a class="map-side-links"
href="javascript:myclick(' + i + ')">' + name + '</a></p><br>';
i++;
return marker;
}
var point = new GLatLng(52.19404,-1.708807);
var marker = createMarker(point, "Shakespeares Birthplace",'<div
style="width:204px; margin-left:40px;"><p><a href="attractions/
shakespeares-birthplace.html">Shakespeares Birthplace</a><a
href="attractions/shakespeares-birthplace.html"><img src="images/
attractions/shakespeares-birthplace-thumb.jpg" alt="Shakespeares
Birthplace" border"0" /></a><br /><a href="attractions/shakespeares-
birthplace.html">Find out more</a></p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.188439,-1.709150);
var marker = createMarker(point, "Shakespeares Death",'<div
style="width:240px; margin-left:40px;"><p><a href="attractions/
shakespeares-death.html">Shakespeares Birthplace</a><a
href="attractions/shakespeares-death.html"><img src="images/
attractions/shakespeares-death-thumb.jpg" alt="Shakespeares Death" /></
a><br /><a href="attractions/shakespeares-death.html">Find out more</
a></p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.190575,-1.703870);
var marker = createMarker(point, "Shakespeare Theatres",'<div
style="width:240px; margin-left:40px;"><p><a href="attractions/
shakespeares-theatres.html">Shakespeares Birthplace</a><a
href="attractions/shakespeares-theatres.html"><img src="images/
attractions/shakespeares-theatres-thumb.jpg" alt="Shakespeares
Theatres" /></a><br /><a href="attractions/shakespeares-
theatres.html">Find out more</a></p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.190642,-1.732015);
var marker = createMarker(point,"Anne Hathaways Cottage",'<div
style="width:240px; margin-left:40px;"><p><a href="attractions/anne-
hathaways-cottage.html">Anne Hathaways Cottage</a><a href="attractions/
anne-hathaways-cottage.html"><img src="images/attractions/anne-
hathaways-cottage-thumb.jpg" alt="Anne Hathaways Cottage" /></a><br /
><a href="attractions/anne-hathaways-cottage.html">Find out more</a></
p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.221557,-1.759204);
var marker = createMarker(point,"Mary Ardens House",'<div
style="width:240px; margin-left:40px;"><p><a href="attractions/mary-
ardens-house.html">Mary Ardens House</a><a href="attractions/mary-
ardens-house.html"><img src="images/attractions/mary-ardens-house-
thumb.jpg" alt="Mary Ardens House" /></a><br /><a href="attractions/
mary-ardens-house.html">Find out more</a></p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.191124,-1.707655);
var marker = createMarker(point,"Nashs House and Newplace",'<div
style="width:240px"><p>Nashs House and Newplace.</p></div>')
map.addOverlay(marker);
var point = new GLatLng(52.188439,-1.709150);
var marker = createMarker(point, "Halls Croft",'<div
style="width:240px"><p>Halls Croft.</p></div>')
map.addOverlay(marker);
document.getElementById("side_bar").innerHTML = side_bar_html;
}
//]]>
</script>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Google Maps API" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/Google-Maps-API?hl=en
-~----------~----~----~----~------~----~------~--~---
