<分区>
我正在尝试构建一个脚本，该脚本使用以下命令从数据库中提取数据
PHP/MySQL。我想用
中的位置创建一个侧边栏
我的数据库。有点像下面链接中的例子
http://www.geocodezip.com/v3_MW_example_map15c.html
我能够提取数据并在我的 map 上显示位置 很好......但是侧边栏没有显示我的任何标记我很确定我的代码创建标记的部分有问题..我是javascript的新手虽然所以可能是错误的。这部分代码可以在第 36 行找到...以类似
的内容开头 function createMarker(latlng, name, html) {
这是我的脚本的链接
http://onlineworkplace.info/googlemaps/testing.php
这是实际的脚本。
<script type="text/javascript">
var customIcons = {
c: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png',
shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
},
u: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
}
};
// this variable will collect the html which will eventually be placed in the select
var select_html = "";
// arrays to hold copies of the markers
// because the function closure trick doesnt work there
var gmarkers = [];
// global "map" variable
var map = null;
// A function to create the marker and set up the event window function i am pretty sure something is not right here
function createMarker(latlng, name, html) {
var ContentString = html;
var markers = new google.maps.Marker({
position: latlng,
map: map,
zIndex: Math.round(latlng.lat()*-100000)<<5
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(ContentString);
infowindow.open(map,marker);
});
// ======= Add the entry to the select box =====
select_html += '<option> ' + name + '<\/option>';
// ==========================================================
// save the info we need to use later
gmarkers.push(markers);
return markers;
}
// ======= This function handles selections from the select box ====
// === If the dummy entry is selected, the info window is closed ==
function handleSelected(opt) {
var i = opt.selectedIndex - 1;
if (i > -1) {
google.maps.event.trigger(gmarkers[i],"click");
}
else {
infowindow.close();
}
}
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(29.760, -95.387),
zoom: 10,
mapTypeId: 'hybrid'
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("phpsqlajax_genxml2.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("skatespots");
// ==== first part of the select box ===
select_html = '<select onChange="handleSelected(this)">' +
'<option selected> - Select a location - <\/option>';
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
var confirmed = markers[i].getAttribute("confirmed");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var html = "<b>" + name + "</b>";
var icon = customIcons[confirmed] || {};
// i think the varmarker bit is not right not here not sure though
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
bindInfoWindow(marker, map, infoWindow, html);
}
// ===== final part of the select box =====
select_html += '<\/select>';
document.getElementById("selection").innerHTML = select_html;
});
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
// This Javascript is based on code provided by the
// Community Church Javascript Team
// http://www.bisphamchurch.org.uk/
// http://econym.org.uk/gmap/
// from the v2 tutorial page at:
// http://econym.org.uk/gmap/basic3.htm
任何有关问题的帮助或提示都将不胜感激
谢谢