2

有人可以帮助我吗?

我在 Google Maps API 中显示 infoWindow 时遇到问题 - 背景阴影未正确显示。阴影的透明度不起作用。

[您可以在网页上看到问题][1](点击圆圈中的红色小A表示问题)

代码在这里:

var geocoder;
var map;
function initialize() {  
var pinkParksStyles = [
{
featureType: "all",
stylers: [
{ saturation: -80 }
]
},
{
featureType: "landscape.man_made",
stylers: [
{ hue: "#ed1c26" },
{ saturation: 100 },
{ gamma: 0.2 }
]
}
];   

var pinkMapType = new google.maps.StyledMapType(pinkParksStyles,
{name: "Architektonická mapa"});

geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(49.830896,15.331421);


var myOptions = {
  zoom: 7,
  center: latlng,
  mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP, "pink_parks"]
  }
}

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

var hvezdo = new google.maps.LatLng(49.872623,14.769359);

map.mapTypes.set("pink_parks", pinkMapType);
map.setMapTypeId("pink_parks");

var image = "http://www.cka2011.cz/archbook/wp-content/plugins/Ada_archmapa/icon-arch.png";

var hvezdo = new google.maps.LatLng(49.872623,14.769359);

  var marker = new google.maps.Marker({
  position: hvezdo,
  map: map,
  title:"matomas.cz",
  icon: image, 
});

var contentString = "<div id=content>"+
"<div id= siteNotice >"+
"</div>"+
"<h2 id= firstHeading  class= firstHeading >Uluru</h2>"+
"<div id= bodyContent >"+
"<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large " +
"sandstone rock formation in the southern part of the "+
"Northern Territory, central Australia. It lies 335 km (208 mi) "+
"south west of the nearest large town, Alice Springs; 450 km "+
"(280 mi) by road. Kata Tjuta and Uluru are the two major "+
"features of the Uluru - Kata Tjuta National Park. Uluru is "+
"sacred to the Pitjantjatjara and Yankunytjatjara, the "+
"Aboriginal people of the area. It has many springs, waterholes, "+
"rock caves and ancient paintings. Uluru is listed as a World "+
"Heritage Site.</p>"+
"<p>Attribution: Uluru, <a href= http://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194 >"+
"http://en.wikipedia.org/w/index.php?title=Uluru</a> (last visited June 22, 2009).</p>"+
"</div>"+
"</div>";

var infobox = new google.maps.InfoWindow({
content: contentString
 });

google.maps.event.addListener(marker, "click", function() {

infobox.open(map,marker);
});
}

function codeAddress() {
var address = document.getElementById("address").value;
geocoder.geocode( { "address": address}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
    map.setCenter(results[0].geometry.location);
    map.setZoom(14);
    var marker = new google.maps.Marker({
        map: map,
        position: results[0].geometry.location
    });
  } else {
    alert("Geocode was not successful for the following reason: " + status);
  }
  });
  }
4

2 回答 2

5

您的 CSS 干扰了地图:

.entry img, img.thumbnail {
    background-color: #FFFFFF;

您需要关闭地图图像的背景颜色:

#map_canvas img {
    background-color: transparent;
    }

datetime is undefined(您的页面每秒也会出现一个错误。)

于 2012-05-11T22:17:33.460 回答
0

您的样式表正在影响信息窗口呈现。

此样式表的第 285 行:

.entry img, img.thumbnail { padding: 5px; background:#FFF; }

级联并影响所有元素,包括信息窗口。建议您使样式表更具体,以免影响所有子 img 元素。

于 2012-05-11T22:20:59.047 回答