Mapka powered by Google

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
czajna
Posty: 4
Rejestracja: czw sty 11, 2007 3:22 pm
Lokalizacja: Kluczbork/Wrocław
Kontakt:

Mapka powered by Google

Post autor: czajna »

Witam
Jestem w trakcie tworzenia Rowerowej Mapy Polski. Chciałbym to wykonać z pomocą mapy Googla.

Skrypt moj narazie wyglada tak:



<script type="text/javascript">
//<![CDATA[

function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(51.919438,19.145136), 6);


// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var baseIcon = new GIcon();
baseIcon.iconSize = new GSize(12, 20);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);

var infoTabs = [
new GInfoWindowTab("Tab #1", "This is tab #1 content"),
new GInfoWindowTab("Tab #2", "This is tab #2 content")
];


// Creates a marker whose info window displays the letter corresponding
// to the given index.
function createMarker(point, icon) {
// Create a lettered icon for this point using our icon class
var icon = new GIcon(baseIcon);
icon.image = "http://www.narowerze.info/race.jpg" ;
var marker = new GMarker(point, icon);

GEvent.addListener(marker, "click", function() {
marker.openInfoWindowTabsHtml(infoTabs);
});
return marker;
}



var icon = new GIcon();
icon.image = "http://www.narowerze.info/race.jpg";
icon.iconSize = new GSize(12, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);

var point = new GLatLng(52.919438,20.145136);
map.addOverlay(createMarker(point, icon));

var point = new GLatLng(50.919438,20.145136);
map.addOverlay(createMarker(point, icon));



}
}





//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 800px; height: 550px"></div>
</body>
</html>


Mam dwa zasadnicze problemy:
1. W jaki sposób dodać do mapy drugą (np. tą http://www.narowerze.info/fr.jpg) i kolejne ikonki?
2. Jak do ikonki dodawać dymki z różną zawartością (fomat dymków taki jak teraz jest).

Mapka wygląda narazie tak: http://www.narowerze.info/mapa_google.htm

Za pomoc z gory wielkie dzieki

Tomek
ODPOWIEDZ