-1
我已經使用谷歌地圖顯示細節。當我點擊標記圖標時，信息窗口打開。我在信息窗口中顯示了一些值，但是當我點擊它時沒有傳遞值，我該如何解決這個問題。谷歌地圖信息窗口按鈕不傳遞值的JavaScript？
- 當我點擊信息窗口獲取按鈕時，它應該通過該特定值。
// Our markers
markers1 = [
['0', 'Madivala', 12.914494, 77.560381, 'car', 'as12'],
['1', 'Majestic', 12.961229, 77.559281, 'third', 'as13'],
['2', 'Ecity', 12.92489905, 77.56070772, 'car', 'as14'],
['3', 'Jp nagar', 12.91660662, 77.52047465, 'second', 'as15']
];
/**
* Function to init map
*/
function initialize() {
var goo = google.maps,
gmarkers1 = [],
map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 11,
center: new google.maps.LatLng(12.9667, 77.5667),
mapTypeId: google.maps.MapTypeId.TERRAIN,
noClear: true
}),
card = document.getElementById('infocard'),
types = document.getElementById('type');
//drawcard and select as map-controls
map.controls[goo.ControlPosition.RIGHT_BOTTOM].push(card);
map.controls[goo.ControlPosition.TOP_LEFT].push(types);
for (i = 0; i < markers1.length; i++) {
addMarker(markers1[i]);
}
google.maps.event.addDomListener(types, 'change', function() {
filterMarkers(this.value);
});
/**
* Function to add marker to map
*/
function addMarker(marker) {
var category = marker[4];
var title = marker[1];
var pos = new google.maps.LatLng(marker[2], marker[3]);
var content = marker[1];
var fullContent = marker.slice(1, 6).join();
var marker1 = new google.maps.Marker({
title: title,
position: pos,
category: category,
map: map
});
gmarkers1.push(marker1);
// Marker click listener
google.maps.event.addListener(marker1, 'click', (function(marker1, idx, markers1) {
return function() {
var compiled = '<div><div>' +
markers1[idx][0] +
'</div><div>' +
markers1[idx][1] + ' </div><div>' +
markers1[idx][2] + ' </div><div>' +
'<button onclick="getid(markers1[' + i +
'][5])">Get</button></div></div>';
map.panTo(this.getPosition());
map.setZoom(15);
//set content of card
card.innerHTML = compiled;
//show card
card.style.display = 'block';
//store marker as property of the card
card.marker = this;
}
})(marker1, i, markers1));
}
function getid(id)
{
console.log(id);
}
/**
* Function to filter markers by category
*/
filterMarkers = function(category) {
for (i = 0; i < gmarkers1.length; i++) {
var marker = gmarkers1[i],
visible = (marker.category == category || category.length === 0);
marker.setVisible(visible);
if (card.marker === marker) {
//show the card when current marker is visible
//and the card shows info of the currentmarker
card.style.display = (visible) ? 'block' : 'none';
}
}
}
}
google.maps.event.addDomListener(window, 'load', initialize);html,
body,
#map-canvas {
height: 100%;
margin: 0;
padding: 0;
}
#infocard {
background: tomato;
padding: 8px;
border: 1px solid #000;
border-radius:4px;
display: none;
margin:4px;
}<div id="map-canvas">
<div id="infocard"></div>
<select id="type">
<option value="">Please select category</option>
<option value="second">second</option>
<option value="car">car</option>
<option value="third">third</option>
</select>
</div>