Отображение карты (google) в пределах указателя-указателя

80
4

Я пытаюсь отобразить небольшую карту в диалоговом окне карты Google. Цель состоит в том, чтобы пользователь щелкнул по маркеру, откроется окно с маленькой картой, в которой отображается вид со спутника. Основной код ниже работает достаточно хорошо. Единственное, что у меня есть пустой "map_loc", потому что я не знаю, куда поместить "var map_loc".

Я использую запрос в цикле while из базы данных mysql, чтобы получить необходимую информацию.

В основном, мой вопрос заключается в том, где я должен поместить эту часть кода в основной код ниже, чтобы отобразить небольшую карту с именем 'map_loc', которую div находится в местах расположения маркеров:

var map_loc = new google.maps.Map(document.getElementById('map_loc'), {
zoom: 17,
center: new google.maps.LatLng(<?php echo $latlng_loc?>),
mapTypeId: google.maps.MapTypeId.SATELLITE
});

-

<div id="map" style="width:600px; height:600px;"></div>

<script type="text/javascript">
var locations = [
<?php
while ($x = $req->fetch())
{
// variables obtained :
$name = $d['name'];
$latlng_loc = $d['latlng']; // I need it to display the marker at the good location but also now to display the map within the infowindow
?>
['<h3><?php echo $name;?></h3><div id="loc_map" style="width:250px; height:150px;"></div>', <?php echo $latlng_loc?>],<?php
}
?>
];

// here is the main map
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: new google.maps.LatLng(<?php echo $latlng?>),
mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();

var marker, i;

for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});

google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}

Спасибо за любую помощь.

спросил(а) 2013-09-10T10:36:00+04:00 6 лет, 2 месяца назад
1
Решение
79

infowindow google map, Может быть использовано HTML-намерение.. попробуйте это: пример 1 маркер:

var content1 = '<div id="smallmap1"></div>';
var map_loc;
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(content1);
infowindow.open(map, marker);
set_small_map(i);
}
})(marker, i));

//"smallmap"+i == smallmap1, if i == 1;
function set_small_map(i){
map_loc = new google.maps.Map(document.getElementById("smallmap"+i), {
zoom: 17,
center: new google.maps.LatLng(<?php echo $latlng_loc?>),
mapTypeId: google.maps.MapTypeId.SATELLITE
});
};

ответил(а) 2014-07-06T21:14:00+04:00 5 лет, 5 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема