Z1 Mapy <script src="http

Transkrypt

Z1 Mapy <script src="http
8d5b
Z1
<html>
<head>
<title>Mapy</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body onload="mapaStart()">
<script type="text/javascript">
var mapa;
function dodajMarker(opcjeMarkera) //3 koscioly, swoj dom, drogowa
{
opcjeMarkera.map = mapa;
var marker = new google.maps.Marker(opcjeMarkera);
}
function mapaStart()
{
var wspolrzedne = new google.maps.LatLng(54.38580831502159,19.828637349243195); //współrzędne mapy
var opcjeMapy = {
center: wspolrzedne,
zoom: 13, //uwaga na tego zooma
mapTypeId: google.maps.MapTypeId.ROADMAP //można też tutaj wstawić HYBRID,SATELLITE,TERRAIN
};
mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
var rozmiar = new google.maps.Size(21,31);
var punkt_startowy = new google.maps.Point(0,0);
var punkt_zaczepienia = new google.maps.Point(16,16);
var ikona1 = new google.maps.MarkerImage("icons/home.png",rozmiar, punkt_startowy, punkt_zaczepienia);
var ikona2 = new google.maps.MarkerImage("icons/kosciol.png",rozmiar, punkt_startowy, punkt_zaczepienia);
var ikona3 = new google.maps.MarkerImage("icons/kosciol.png",rozmiar, punkt_startowy, punkt_zaczepienia);
var ikona4 = new google.maps.MarkerImage("icons/kosciol.png",rozmiar, punkt_startowy, punkt_zaczepienia);
dodajMarker({position: new google.maps.LatLng(54.383228, 19.829097), title: 'Domek', icon:ikona1});
dodajMarker({position: new google.maps.LatLng(54.381030, 19.824671), title: 'Katedra', icon:ikona2});
dodajMarker({position: new google.maps.LatLng(54.385160, 19.828254), title: 'Kosciol sw. Antoniego', icon:ikona3});
dodajMarker({position: new google.maps.LatLng(54.391042, 19.808223), title: 'Kosciol p.w. św. Krzyża', icon:ikona4});
}
</script>
<div id="mapka" style="width: 1000px; height:800px; background: transparent;">Mapa</div>
</body>
</html>
==================================================================================================================
===================
z2
<html>
<head>
<title>Mapy</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body onload="mapaStart()">
<script type="text/javascript">
var mapa;
var dymek = new google.maps.InfoWindow();
//SOPOT ARENA, MARKER Z INFORMACJA
function dodajMarker(lat,lng,txt)
{
var opcjeMarkera =
{
position: new google.maps.LatLng(lat,lng),
map: mapa
}
var marker = new google.maps.Marker(opcjeMarkera);
marker.txt=txt;
google.maps.event.addListener(marker,'click',function()
{
dymek.setContent(marker.txt);
dymek.open(mapa,marker);
});
return marker;
}
function mapaStart()
{
var wspolrzedne = new google.maps.LatLng(54.4265777,18.579771); //współrzędne mapy
var opcjeMapy = {
zoom: 15,
center: wspolrzedne,
mapTypeId: google.maps.MapTypeId.HYBRID //HYBRID
};
mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
var marker1 = dodajMarker(54.4265777,18.579771,'Tu odbędzie się mecz Polska-Brazylia'); //współrzędne markera,opis markera
google.maps.event.trigger(marker1,'click');
}
</script>
<div id="mapka" style="width: 1000px; height:800px; background: transparent;">mapa</div>
</body>
</html>
==================================================================================================================
===================
z3
<html>
<head>
<title>Mapy</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body onload="mapaStart()">
<script type="text/javascript">
var mapa;
function dodajMarker(lat,lng)
//N20s 40' 40.4",E40s 30' 30.3", powiekszenie 13, wylaczone kontrolki, ze skala
{
var opcjeMarkera =
{
position: new google.maps.LatLng(lat,lng),
map: mapa,
}
var marker = new google.maps.Marker(opcjeMarkera);
};
function mapaStart()
{
var wspolrzedne = new google.maps.LatLng(20.67788889,40.50841667); //wspolrzedne mapy
var opcjeMapy = {
zoom: 13, //zoom
center: wspolrzedne,
mapTypeId: google.maps.MapTypeId.SATELLITE,
disableDefaultUI: true, //wylaczone UI
navigationControl: false, //kontrolki <<navigationControl
mapTypeControl: true, // typ mapy coś tam
scaleControl: true, //skala
};
mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
var marker1 = dodajMarker(20.67788889,40.50841667); //wspolrzedne markera
}
</script>
<div id="mapka" style="width: 900px; height:700px;">mapa</div>
</body>
</html>
==================================================================================================================
===================
z4
<html>
<head>
<title>Mapy</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body onload="mapaStart()">
<script type="text/javascript">
var mapa;
function mapaStart()
//narysuj trase od domu do jakiegos punktu (4 punkty) , mapa drogowa, 1000x800
{
var wspolrzedne = new google.maps.LatLng(52.36,18.77); //wspolrzedne mapy
var opcjeMapy = {
zoom: 7,
center: wspolrzedne,
mapTypeId: google.maps.MapTypeId.ROADMAP, //typ mapy
disableDefaultUI: true //wylaczenie UI
};
mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
var DOM = new google.maps.LatLng(54.383693, 19.838232); //wspolrzedne trasy
var P1 = new google.maps.LatLng(54.156013, 19.404428);
var P2 = new google.maps.LatLng(52.229721, 21.011751);
var P3 = new google.maps.LatLng(51.757295, 19.452880);
var P4 = new google.maps.LatLng(50.811836, 19.119699);
var KRAKOW = new google.maps.LatLng(50.064972, 19.944536);
var punkty = [DOM,P1,P2,P3,P4,KRAKOW]; //wypisanie wszystkich punktow trasy
var polilinia = new google.maps.Polyline({
map:
mapa,
path:
punkty,
strokeColor:
strokeWeight:
'#ff0000',
3
});
}
</script>
<div id="mapka" style="width: 1000px; height:800px; background: gray;">mapa</div>
</body>
</html>
Zrodlo: http://wklej.se/8d5b