Я создаю веб-страницу, отображающую события на карте. События, представленные маркерами на Картах Google, можно щелкнуть, чтобы пользователи могли получить дополнительную информацию. Пока это работает нормально.Доступ к маркерам Google Maps в 2D-массиве извне
В другом месте на веб-сайте также есть список тех же событий. Я хочу, чтобы пользователи могли нажимать на что-то вроде «Просмотр на карте», чтобы пользователи были увеличены на этом конкретном событии на карте, при этом откроется окно infoWindow.
Этот раздел не является новым для StackOverflow, но существующие решения, которые я нашел, по-видимому, не работают над моим кодом (или я просто запутываю вещи). Мне нужно найти решение для работы с массивами, но я не вижу решения ...
Информация для маркеров и инфо-окон выходит из базы данных через PHP (вводится в код). Информация поступает в 2D-массив. Я новичок, поэтому код будет немного noobish.
function initialize() {
var map;
var bounds = new google.maps.LatLngBounds();
var mapOptions = { mapTypeId: 'roadmap'};
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
<?php
// Some query
?>
// Generate array with markers
var markers = [
<?php
// Get stuff from database
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "['".$row['conname']."', ".$row["gps_long"].",".$row['gps_lat']."],\r\n";
}
}
?>
];
// Generate array for infoWindow
var infoWindowContent = [
<?php
// More stuff from database
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "['blablabla'],";
}
}
?>
];
var infoWindow = new google.maps.InfoWindow(), marker, i;
for(i = 0; i < markers.length; i++) {
var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
bounds.extend(position);
marker = new google.maps.Marker({
position: position,
map: map,
title: markers[i][0]
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infoWindow.setContent(infoWindowContent[i][0]);
infoWindow.open(map, marker);
}
})(marker, i));
google.maps.event.addListener(map, "click", function(event) {
infoWindow.close();
});
map.fitBounds(bounds);
}
var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
this.setZoom(5);
google.maps.event.removeListener(boundsListener);
});
}
google.maps.event.addDomListener(window, 'load', initialize)
Этот файл также генерируется PHP по тому же самому происхождению в одно время. Где-то ...
<?php
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo '<p><a href=./?event="'.$row["id"].'">'.$row["eventname"]."</a><br>";
echo $row["date"]."<br>\n";
echo '<a href="#">View on map</a></p><br>';
}
}
;?>
Надеюсь, вы, ребята, можете мне помочь.