Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.04.2016, 20:24
Новичок на форуме
Отправить личное сообщение для drpozitiff Посмотреть профиль Найти все сообщения от drpozitiff
 
Регистрация: 28.04.2016
Сообщений: 5

Google Maps API, как добавить текст к маркеру?
Здравствуйте. Вот какая проблема: есть карта, добавил маркер, добавил окно информации, пулпап - это все работает. Но не могу никак добавить адрес, на который указывает маркер. Просмотрел все примеры на сайте Google maps API, курил документацию, гуглил. Ничего. Это либо невозможно (хотя если генерить айфрейм через "поделиться" в самих картах гугла - подпись есть) либо я очень сильно туплю, так как это очевидная вещь.
Вот как оно должно выглядеть:


function initMap() {
	var map = new google.maps.Map(document.getElementById('map'), {
		zoom: 16,
		center: {lat: 49.397, lng: 28.644},
	});
	var geocoder = new google.maps.Geocoder();

	window.onload = function() {
		geocodeAddress(geocoder, map);
	};
}

function geocodeAddress(geocoder, resultsMap) {
	var address = document.getElementById('address').value;
	var infowindow = new google.maps.InfoWindow({
			content: "hi"
	});
	geocoder.geocode({'address': address}, function(results, status) {
    if (status === google.maps.GeocoderStatus.OK) {
		resultsMap.setCenter(results[0].geometry.location);
		marker = new google.maps.Marker({
			map: resultsMap,
			position: results[0].geometry.location,
			title: address,
			draggable: false
		});
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}
Ответить с цитированием
  #2 (permalink)  
Старый 28.04.2016, 20:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сообщение от drpozitiff
document.getElementById('address')
это input?
Ответить с цитированием
  #3 (permalink)  
Старый 28.04.2016, 20:40
Новичок на форуме
Отправить личное сообщение для drpozitiff Посмотреть профиль Найти все сообщения от drpozitiff
 
Регистрация: 28.04.2016
Сообщений: 5

да
Ответить с цитированием
  #4 (permalink)  
Старый 28.04.2016, 20:47
Новичок на форуме
Отправить личное сообщение для drpozitiff Посмотреть профиль Найти все сообщения от drpozitiff
 
Регистрация: 28.04.2016
Сообщений: 5

<input id="address" type="textbox" value="Хмельниьке шосе, 13">
<div id="map"></div>

это по сути весь html
Подключаем так:
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB_zbBKBYP1-MLldK3xCN04GxUwmXXMGnM&signed_in=true&callback=initMap"
        async defer></script>

key - ключ, генерится на сайте гугл мэпс апи
Ответить с цитированием
  #5 (permalink)  
Старый 28.04.2016, 21:18
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

drpozitiff,
может так?
<input type="text" id="address"  value="Хмельницьке шосе, 13">

function geocodeAddress(geocoder, resultsMap) {
    var address = document.getElementById('address').value;
    var infowindow = new google.maps.InfoWindow({
            content: address
    });
    geocoder.geocode({'address': address}, function(results, status) {
    if (status === google.maps.GeocoderStatus.OK) {
        resultsMap.setCenter(results[0].geometry.location);
        marker = new google.maps.Marker({
            map: resultsMap,
            position: results[0].geometry.location,
            title: address,
            draggable: false
        });
       infowindow.open(resultsMap, marker);


    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}
Ответить с цитированием
  #6 (permalink)  
Старый 28.04.2016, 21:28
Новичок на форуме
Отправить личное сообщение для drpozitiff Посмотреть профиль Найти все сообщения от drpozitiff
 
Регистрация: 28.04.2016
Сообщений: 5

Неа, это инфобокс, который появляется по клику на маркер. Выглядит вот так:
Ответить с цитированием
  #7 (permalink)  
Старый 28.04.2016, 21:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

drpozitiff,
кроме label которая добавляет одну букву, не нашёл в документации ничего для текста.
Ответить с цитированием
  #8 (permalink)  
Старый 28.04.2016, 21:48
Новичок на форуме
Отправить личное сообщение для drpozitiff Посмотреть профиль Найти все сообщения от drpozitiff
 
Регистрация: 28.04.2016
Сообщений: 5

так и я вот тоже... Картинки, слои, всякая полезная фигня... а текст добавить нельзя.
Ответить с цитированием
  #9 (permalink)  
Старый 05.09.2016, 10:41
Интересующийся
Отправить личное сообщение для andrey3681 Посмотреть профиль Найти все сообщения от andrey3681
 
Регистрация: 30.06.2016
Сообщений: 20

infowindow google maps api отображаются не над маркером, а в стороне, и с содержимым последнего Подскажите пожалуйста в чем проблема

... добавляю маркеры на карту из массива
for (var i = 0; i < objects.length; i++) {
    var ll = objects[i].coordinates.split(',');
    var latlng = new google.maps.LatLng(ll[0], ll[1]);
    var address = [];
    address = objects[i].address;
    if (distHaversine(latlng, circleOptions.center) < radius) {
        infowindow = new google.maps.InfoWindow({
            content: address
        });
        objects_markers[i] = new google.maps.Marker({
            position:latlng,
            clickable:true,
            map: map,
            title: address,
            animation: google.maps.Animation.DROP,
            visible: true,
            icon: 'images/beachflag.png'
        });
        objects_markers[i].addListener('click', function() {
            infowindow.open(map, objects_markers[i]);
        });
    }
Ответить с цитированием
  #10 (permalink)  
Старый 05.09.2016, 11:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

andrey3681,
веротно не учитываите что i везде одно и тоже.
уберите for , замените на forEach
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как при выборе select'a добавить текст в textarea? anymaxis Элементы интерфейса 3 18.08.2015 10:33
Google Api Chart - как настроить вид осей? mdlv Библиотеки/Тулкиты/Фреймворки 0 11.11.2013 16:54
прогкрутка к якорям cOAPerator Общие вопросы Javascript 20 27.08.2013 03:30
Как создать проверку вводимого пароля на стойкость, используя API Google. Александр Черепов Элементы интерфейса 4 03.11.2008 02:16