Google maps api 3 谷歌地图API V3标记未显示
我使用版本2已经有相当长的一段时间了，并且决定将版本3作为主要站点更新的一部分。我所有的代码都基于“”。经过数小时的微调，我让一切正常，包括集群和自定义标记 我是一只非常快乐的小兔子，渴望炫耀自己。然后令我失望的是，我发现它在IE或Firefox中都不起作用（我一直在Chrome中测试它） 我很清楚GoogleMapsAPI不是一件容易使用的事情，但是有什么理由让我在不同的浏览器中使用这种行为吗？通过转到并单击“地图搜索”可以查看地图。代码如下：Google maps api 3 谷歌地图API V3标记未显示,google-maps-api-3,google-maps-markers,Google Maps Api 3,Google Maps Markers,我使用版本2已经有相当长的一段时间了，并且决定将版本3作为主要站点更新的一部分。我所有的代码都基于“”。经过数小时的微调，我让一切正常，包括集群和自定义标记 我是一只非常快乐的小兔子，渴望炫耀自己。然后令我失望的是，我发现它在IE或Firefox中都不起作用（我一直在Chrome中测试它） 我很清楚GoogleMapsAPI不是一件容易使用的事情，但是有什么理由让我在不同的浏览器中使用这种行为吗？通过转到并单击“地图搜索”可以查看地图。代码如下： <!DOCTYPE html> &l
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Little Hotels of Spain - Google Map</title>
<meta name="description" content="Little Hotels provides maps showing the location of hotels, using Google Maps to create both a street/road map and a satellite image.">
<meta name="keywords" content="Little Hotels, Little Hotels of Spain, Spain, mainland spain, balearic, balearics, canary, canaries, small, hotel, hotels, map, google map, holiday, holidays">
<style type="text/css">
html { height: 100% }
body{ height: 100%; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size:12px; color:#333333;}
a:link, a:visited, a:hover {color: #FF6600; text-decoration: none; font-weight: bold;}
h1{font-size: 16px; color: #2B8CB9; font-weight: bold;}
#content{padding: 0 5px 0; width: 640px;}
#map_canvas { height: 100% }
.verdana{font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 9px; color: #666666;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer_compiled.js"></script>
<script type="text/javascript" src="../js/downloadxml.js"></script>
<script type="text/javascript">
//<![CDATA[
var gmarkers = [];
// global "map" variable
var map = null;
var markerclusterer = null;
var image = new google.maps.MarkerImage('../images/hotel_icon.png',
new google.maps.Size(32, 37),
new google.maps.Point(0,0),
new google.maps.Point(16, 35));
var shadow = new google.maps.MarkerImage('../images/hotel_shadow.png',
new google.maps.Size(51, 37),
new google.maps.Point(0,0),
new google.maps.Point(16, 35));
// A function to create the marker and set up the event window function
function createMarker(latlng, name, html) {
var contentString = html;
var marker = new google.maps.Marker({
position: latlng,
icon: image,
shadow: shadow
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(contentString);
infowindow.open(map,marker);
});
// save the info we need to use later for the side_bar
gmarkers.push(marker);
}
// This function picks up the click and opens the corresponding info window
function myclick(i) {
google.maps.event.trigger(gmarkers[i], "click");
}
function initialize() {
var lat = 0;
var lng = 0;
var zoomzoom = 0;
var query = location.search.substring(1);
var pairs = query.split("&");
for (var i=0; i<pairs.length; i++) {
var pos = pairs[i].indexOf("=");
var argname = pairs[i].substring(0,pos).toLowerCase();
var value = pairs[i].substring(pos+1).toLowerCase();
if (argname == "lat") {lat = parseFloat(value);}
if (argname == "lng") {lng = parseFloat(value);}
if (argname == "zoom") {zoomzoom = parseInt(value);}
}
var thisLatlng = new google.maps.LatLng(lat, lng);
var myOptions = {
center: thisLatlng,
zoom: zoomzoom,
mapTypeId: google.maps.MapTypeId.ROADMAP,
streetViewControl: false,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
}
}
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
google.maps.event.addListener(map, 'click', function() {
infowindow.close();
});
downloadUrl("php-to-xml.php", function(doc) {
var xmlDoc = xmlParse(doc);
var markers = xmlDoc.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var lat = parseFloat(markers[i].getAttribute("lat"));
var lng = parseFloat(markers[i].getAttribute("lng"));
var point = new google.maps.LatLng(lat,lng);
var html=markers[i].getAttribute("html");
var hotel=markers[i].getAttribute("hotel");
var marker = createMarker(point,hotel,html);
}
var clusterStyles = [
{
opt_textColor: '#5a7aba',
url: '../images/cluster_icon.png',
height: 40,
width: 40
}
];
var mcOptions = {gridSize: 35, maxZoom: 8, styles: clusterStyles};
markerCluster = new MarkerClusterer(map, gmarkers,mcOptions);
});
}
var infowindow = new google.maps.InfoWindow(
{
size: new google.maps.Size(300,50)
});
//]]>
</script>
</head>
<body onload="initialize()">
<div id="content">
<h1>Little Hotels Map Search</h1>
<span class="verdana">Click on the icons for more information or use the Google controls to zoom, scroll, pan and change view.<br /><br /></span>
<table border=1 bordercolor="#666666">
<tr>
<td>
<div id="map_canvas" style="width: 640px; height: 450px"></div>
</td>
</tr>
</table>
<br />
</div>
</body>
</html>
西班牙小酒店-谷歌地图
html{高度：100%}
正文{高度：100%；边距：0；填充：0；字体系列：Arial，Helvetica，无衬线；字体大小：12px；颜色：#333333；}
a:链接，a:已访问，a:悬停{color:#FF6600；文本装饰：无；字体重量：粗体；}
h1{字体大小：16px；颜色：#2B8CB9；字体大小：粗体；}
#内容{填充：0 5px 0；宽度：640px；}
#地图画布{高度：100%}
.verdana{字体系列：verdana，Arial，Helvetica，无衬线；字体大小：9px；颜色：#666666；}
//
小酒店地图搜索
单击图标了解更多信息，或使用谷歌控件缩放、滚动、平移和更改视图。
感谢任何人提供的建议。返回的XML格式不正确。它包括：
pretty "pueblos blancos"
“因此，您将无法将返回的数据解析为XML，我在Firefox中遇到错误： 错误：格式不正确 源文件： 行：1，列：1722
使用XML验证器进行检查。Molle博士，这是PHP脚本：
<?php
header('Content-Type: text/xml');
header('charset:UTF-8');
require_once('../Connections/MySQL_extranet.php');
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','<',$htmlStr);
$xmlStr=str_replace('>','>',$xmlStr);
$xmlStr=str_replace('"','"',$xmlStr);
$xmlStr=str_replace("'",''',$xmlStr);
$xmlStr=str_replace("&",'&',$xmlStr);
$xmlStr=str_replace("ñ",'ñ',$xmlStr);
return $xmlStr;
}
mysql_select_db($database_MySQL_extranet, $MySQL_extranet);
// Select all the rows in the markers table
$query = "SELECT hid, hotel, lat, lng, picture, summary FROM ex_hotel WHERE country = 'spain'";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
// Start XML file, echo parent node
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>";
echo '<markers>';
// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
echo '<marker ';
echo ' html="<img src="../images/' . $row['picture'] . '" align="left" height="108" width="155" style="margin-right:8px;"> <div style="width:320px"> <a href="' . 'http://www.littlehotels.co.uk/new/spain/' . $row['hid'] . '.php" target="_parent" >' . parseToXML($row['hotel']) . '</a> <br><span class="verdana"><br>'.parseToXML($row['summary']).'</span></div>"';
echo ' lat="' . $row['lat'] . '"';
echo ' lng="' . $row['lng'] . '"';
echo ' />';
}
// End XML file
echo '</markers>';
?>
非常感谢您为我指明了正确的方向。我刚刚研究了同一个问题。看来自定义图标阴影功能正在被删除 “在视觉刷新中已删除所有阴影。以编程方式指定的任何阴影都将被忽略。”
我也在关注同样的事情。我在那里发现了一些可以阻止它的例子。不过，直到我读了你的文章，我才找到“直到我读了你的文章”。谢谢我删除了“并将ñ改为n，只是为了让它正常工作。现在我只需要解决如何将它们在我的php文件中转换为xml文件，从而使其成为一个永久和干净的解决方案。感谢您花费时间和精力提供帮助。看到php脚本会很有帮助