Hier sage ich Ihnen nur, wie Sie die Google Maps -API verwenden. Es wird als Weg angesehen, um Aufmerksamkeit zu erregen. Aus einigen Gründen war Google von allen weg.
Die Codekopie lautet wie folgt:
<! DocType html>
<html>
<kopf>
<title> Geolocation </title>
<meta name = "viewport" content = "initial scale = 1.0, user-scalable = no">
<meta charset = "utf-8">
<Styles>
HTML, Körper, #Map-Canvas {
Rand: 0;
Polsterung: 0;
Höhe: 100%;
}
</style>
<script src = "https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"> </script>
<Script>
var map;
var poly;
Funktion initialize () {
var mylatlng = new Google.maps.latlng (31.1937077, 121.4158436);
var positions = [
['Test1, Genauigkeit: 150m', 31.1937077, 121.4158436, 100],
['Test2, Genauigkeit: 150m', 31.2937077, 121.4158436, 100],
['Test3, Genauigkeit: 150m', 31.0937077, 121.2158436, 100],
['Test4, Genauigkeit: 150m', 31.3937077, 120.4158436, 100],
['Test5, Genauigkeit: 150m', 31.1637077, 120.4858436, 100],
['Test6, Genauigkeit: 150m', 31.1037077, 121.5158436, 100]
];
var mapOptions = {
Zoom: 13,
Mitte: Mylatlng,
MAPTYPEID: google.maps.maptypeid.roadmap
};
map = new Google.maps.map (document.getElementById ('map-canvas'),
MapOptionen);
// Zeileneinstellungen
var polyoptions = {
StrokeColor: '#00ff00', // Farbe
Schlaganfall: 1.0, // Transparenz
Strokegewicht: 4 // Breite
}
poly = new Google.maps.polyline (Polyoptionen);
poly.setMap (map); // laden
/* Schleife, um alle Koordinaten zu markieren*/
/*für (var i = 0; i <popals.length; i ++) {
var loc = [];
loc.push (Standorte [i] [1]);
loc.push (Standorte [i] [2]);
var path = poly.getPath (); // Holen Sie sich die Koordinaten der Linie
path.push (neue google.maps.latlng (loc [0], loc [1]); // Markierungskoordinaten zu den Zeilen hinzufügen
// Tagsymbol generieren
marker = new Google.maps.marker ({{
Position: Neue Google.Maps.latlng (loc [0], loc [1]),
Karte: Karte
// Icon: "https://maps.gstatic.com/mapfiles/markers/marker_green.png"
});
}*/
var Marker, ich, Kreis;
var iwarray = [];
var fowindow;
var latlngBounds = new Google.maps.latlngBounds ();
var iconyellow = new Google.maps.markerimage ("http://maps.google.com/mapfiles/ms/icons/yellow-dot.png");
für (i = 0; i <popals.length; i ++) {
var loc = [];
loc.push (Standorte [i] [1]);
loc.push (Standorte [i] [2]);
var path = poly.getPath (); // Holen Sie sich die Koordinaten der Linie
path.push (neue google.maps.latlng (loc [0], loc [1]);
var latlng = new Google.maps.latlng (Standorte [i] [1], Standorte [i] [2]);
latlngBounds.extend (latlng);
if (Positionen [i] [0] .Indexof ("[zwischengespeichert") == 0 || (Positionen [i] [0] .Indexof ("[multiple") == 0 && Standorte [i] [0] .Indexof ("[zwischengespeichert")> = 0) {
marker = new Google.maps.marker ({{
Position: latlng,
Karte: Karte,
Ikone: iConyellow
});
var iw = '<div style = "Schriftgröße: 12px; Word-Wrap: Break-Wort; Wortbrech: break-All;"> <strong> <font color = "#ff0000">' + Orte [i] [0] + '<font> </strong> <div>';
} anders {
marker = new Google.maps.marker ({{
Position: latlng,
Karte: Karte
});
var iw = '<div style = "Schriftgröße: 12px; Word-Wrap: Break-Wort; Wortbrech: Break-All;"> <strong> <font color = "#000000">' + Orte [i] [0] + '<font> </strong> <div>';
}
iwarray [i] = iw;
Google.maps.event.addListener (Marker, 'Mouseover', (Funktion (Marker, i) {
return function () {
infowindow = new Google.maps.infowindow ({{
Inhalt: iwarray [i],
Maxwidth: 200,
PixelOffset: New Google.maps.Size (0, 0)
});
Infowindow.open (Karte, Marker);
}
}) (Marker, i));
google.maps.event.addListener (Marker, 'Mouseout', function () {
infowindow.close ();
});
Circle = new Google.maps.circle ({{
Karte: Karte,
Radius: Standorte [i] [3],
FILLCOLOR: '#0000AA',
Füllstimmung: 0.01,
Strokegewicht: 1,
Strokecolor: '#0000cc',
Schlaganfall: 0,8
});
Circle.bindto ('Center', Marker, 'Position');
}
map.fitBounds (latlngbounds);
var listener = google.maps.event.addListeneronce (Karte, "idle", function ()
{
var zoomlevel = parseInt (map.getZoom ());
if (ZoomLevel> 13)
map.setZoom (13);
});
}
google.maps.event.adddomListener (Fenster, "Laden", initialisieren);
</script>
</head>
<body>
<div id = "map-canvas"> </div>
</body>
</html>