Я видел много других людей с тем же вопросом, но не смог найти ответа. У меня есть простая карта, которую я построил с помощью Google Maps Javascript api v3. На карте есть несколько маркеров, которые связаны с инфоиндустом, чтобы отображать конкретную информацию для каждого маркера. Я хочу добавить диаграмму google в infowindow, но просто не мог понять, как это сделать. Я просмотрел все сообщения, которые мог найти (здесь и на других форумах), и я заметил, что другие люди пытаются что-то сделать, но, похоже, нет конкретного ответа. Я заметил, что люди успешно делают такую вещь, используя таблицы слияния, но это не мой случай, поскольку я загружаю данные из таблицы MySQL. На данный момент у меня есть простая карта, код которой показан ниже:
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(-33.837342,151.208954),
zoom: 10,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
var data = [
['Bondi Beach', -33.891044,151.275537],
['Cronulla Beach', -34.046544,151.159601],
];
var myLatLng1 = new google.maps.LatLng(-33.891044,151.275537);
var myLatLng2 = new google.maps.LatLng(-34.046544,151.159601);
var marker1 = new google.maps.Marker({
position: myLatLng1,
map: map
});
var marker2 = new google.maps.Marker({
position: myLatLng2,
map: map
});
google.maps.event.addListener(marker1, 'click', function() {
var infowindow1 = new google.maps.InfoWindow();
infowindow1.setContent('Display the chart here');
infowindow1.open(map, marker1);
});
google.maps.event.addListener(marker2, 'click', function() {
var infowindow2 = new google.maps.InfoWindow();
infowindow2.setContent('Display the chart here');
infowindow2.open(map, marker1);
infowindow2.setContent('Display the chart here');
infowindow2.open(map, marker2);
});
}
и вот код для простой диаграммы, например:
https://google-developers.appspot.com/chart/interactive/docs/quick_start
Я пробовал много разных подходов, и мне кажется более очевидным добавить контейнер() в свойство setContent InfoWindow, а затем вызвать внешнюю функцию, которая создает диаграмму. Кажется, что это не работает, поскольку функция не может видеть контейнер. Я также попытался встроить весь код для диаграммы в свойство setContent, как предлагается в этом сообщении:
используя инструменты диаграммы google в строке содержимого google maps api infowindow
Мне удалось выполнить код без ошибок, однако ничего не отображается. Такой подход мог бы создать диаграмму на другой странице html и каким-то образом установить эту страницу в свойство setContent, а также не добиться успеха.
Я собираюсь сдаться, поскольку я не вижу способа сделать это.
Буду признателен за любую помощь.
Спасибо
Jose