【发布时间】:2014-06-29 16:20:12
【问题描述】:
我是设计 www.localenvironmentsurvey.com 的新手编码员。主页上的地图显示了填写调查表的每个人的位置,并且该地图在 Chrome 中运行。但是,Firefox 或 IE 中没有显示任何标记。
首先,我的 index.html 文件中的相关代码:
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(44.9672, -103.7716),
zoom: 3,
});
var infoWindow = new google.maps.InfoWindow;
downloadUrl("phpsqlajax_genxml2.php", function(data) {
var xml = data.responseXML;
var survey = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < survey.length; i++) {
var govname = survey[i].getAttribute("govname");
var state = survey[i].getAttribute("state");
var govtype = survey[i].getAttribute("govtype");
var point = new google.maps.LatLng(
parseFloat(survey[i].getAttribute("lat")),
parseFloat(survey[i].getAttribute("lng")));
var html = "<b>" + govname + "</b> <br/>" + state;
var marker = new google.maps.Marker({
map: map,
position: point,
});
bindInfoWindow(marker, map, infoWindow, 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() {}
接下来,这是 phpsqlajax_genxml2.php 文件中的代码:
<?php
require("les.php");
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','<',$htmlStr);
$xmlStr=str_replace('>','>',$xmlStr);
$xmlStr=str_replace('"','"',$xmlStr);
$xmlStr=str_replace("'",''',$xmlStr);
$xmlStr=str_replace("&",'&',$xmlStr);
return $xmlStr;
}
// Opens a connection to a MySQL server
$connection=mysql_connect ('db', $username_les, $password_les);
if (!$connection) {
die('Not connected : ' . mysql_error());
}
// Set the active MySQL database
$db_selected = mysql_select_db($database_les, $connection);
if (!$db_selected) {
die ('Can\'t use db : ' . mysql_error());
}
// Select all the rows in the survey table
$query = "SELECT * FROM survey WHERE 1";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml");
// Start XML file, echo parent node
echo '<survey>';
// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
echo '<marker ';
echo 'govname="' . parseToXML($row['govname']) . '" ';
echo 'state="' . parseToXML($row['state']) . '" ';
echo 'lat="' . $row['lat'] . '" ';
echo 'lng="' . $row['lng'] . '" ';
echo 'govtype="' . $row['govtype'] . '" ';
echo '/>';
}
// End XML file
echo '</survey>';
?>
任何关于如何让这张地图在 Firefox 和 IE 中工作的建议都将不胜感激!
【问题讨论】:
-
标记选项中有多余的逗号:
position: point,。在 console.log 中报告了一些错误。在 Chrome 和 FF 中也是如此。
标签: javascript mysql google-chrome firefox google-maps-api-3