0
вот какой-то код для простой карты, которая получает данные из переменной geoJson. Моя проблема в том, что инфо-окна, связанные с маркерами, не будут отображаться. Странно, что если я удалю скрипт API Key, все, кажется, работает правильно.Google Maps JS API/GeoJSON import - infowindows не отображается, когда вставлен ключ API
<!DOCTYPE html>
<html>
<head>
<title>Google Maps geoJson infowindow test</title>
<style type="text/css">
html, body, #map-canvas {
width: 100%;
height: 500px;
margin: 0px;
padding: 0px
}
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false&libraries=drawing"></script>
<script type="text/javascript">
var map;
var marker;
var geocoder = new google.maps.Geocoder();
var infowindow = new google.maps.InfoWindow();
function initialize() {
// Create a simple map.
map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 14,
center: new google.maps.LatLng(-27.779627,153.236112)
});
google.maps.event.addListener(map, 'click', function() {
infowindow.close();
});
// Load the associated GeoJSON
\t var data = {
\t \t \t "type": "FeatureCollection",
\t \t \t "features": [
\t \t \t \t {
\t \t \t \t \t "type": "Feature",
\t \t \t \t \t "geometry": {
\t \t \t \t \t \t "type": "Point",
\t \t \t \t \t \t "coordinates": [153.236112, -27.779627]
\t \t \t \t \t },
\t \t \t \t \t "properties": {
\t \t \t \t \t \t "name": "[153.236112, -27.779627]",
\t \t \t \t \t \t "description": "Timestamp: 16:37:16.293"
\t \t \t \t \t }
\t \t \t \t },
\t \t \t \t {
\t \t \t \t \t "type": "Feature",
\t \t \t \t \t "geometry": {
\t \t \t \t \t \t "type": "Point",
\t \t \t \t \t \t "coordinates": [153.230447, -27.777501]
\t \t \t \t \t },
\t \t \t \t \t "properties": {
\t \t \t \t \t \t "name": "[153.230447, -27.777501]",
\t \t \t \t \t \t "description": "Timestamp: 16:37:26.298"
\t \t \t \t \t }
\t \t \t \t }
\t \t \t ]
\t \t }
\t map.data.addGeoJson(data)
// Set mouseover event for each feature.
map.data.addListener('click', function(event) {
infowindow.setContent(event.feature.getProperty('name')+"<br>"+event.feature.getProperty('description'));
infowindow.setPosition(event.latLng);
infowindow.setOptions({pixelOffset: new google.maps.Size(0,-34)});
infowindow.open(map);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="content"></div>
<table border="1">
<tr>
<td>
<div id="map-canvas" style="width:580px;height:620px;"></div>
</td>
<td valign="top" style="width:150px; text-decoration: underline; color: #4444ff;">
<div id="side_bar"></div>
</td>
</tr>
</table>
<div id="info"></div>
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=MY_SECRET_KEY&callback=initialize">
</script>
</body>
</html>код, чтобы удалить, чтобы заставить его работать на местном уровне:
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=MY_SECRET_KEY&callback=initialize">
</script>Пожалуйста, нужен совет. Благодарю.
Он смотрит на меня, как вы в том числе API в два раза, что приведет к проблемам. – geocodezip
Работал отлично. Спасибо. –