6

本来想发这个的,后来想通了。但无论如何我都会将它发布给其他需要它的人。吸取的教训是,如果您希望它们在 IE 中工作,则将 .ico 文件用于自定义标记图像。(附带说明,它在 Safari 中仍然无法正常工作,但这是另一个问题。)


一段时间以来,我遇到了一个问题,即使用自定义图像创建的 Google Maps API V3 标记不会显示在 IE 或 Safari 中。它在我测试过的所有其他浏览器中都能正常工作,但我们的大多数用户群仍在 IE 上,所以我需要修复这个问题。

这显然是一个已知问题(至少对 Google 而言),如以下 Google 支持线程所示: http ://www.google.com/support/forum/p/maps/thread?tid=26db8fd040386548&hl=en

我想知道是否有其他人遇到过这个问题或知道解决方法?

这是我创建的一个简单测试页面的 js,它演示了这个错误:

var map;
var latLng = new google.maps.LatLng(41.342, -84.932);

$(function() {
    var myOptions = {
        zoom: 17,
        center: latLng,
        mapTypeId: google.maps.MapTypeId.HYBRID
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var newMarker = new google.maps.Marker({
        map: map,
        position: latLng,
        icon: 'images/active_point.png'
    });
});

修复:我将图像转换为 active_point.ico,这对 IE 来说效果很好。出于某种原因,IE 不喜欢我的 .png。


经过更多研究后,似乎必须将 Safari 视为一种特殊情况,因为它似乎不适用于 .ico 或 .png 标记图像。我只让 .jpgs 工作,这很烦人,因为它们不支持 alpha 通道。

4

5 回答 5

2

添加元标记

<meta http-equiv="X-UA-Compatible" content="IE=9"/>

&此代码到 Google Api 代码

//google map custom marker icon - .png fallback for IE
var is_internetExplorer11 = navigator.userAgent.toLowerCase().indexOf('trident') > -1;

var marker_url = (is_internetExplorer11) ? 'IE-map-icon-location.png' : 'map-icon-location.png ';
于 2015-06-13T10:37:56.657 回答
0

另一种选择是使用MarkerImage类。

icon: new google.maps.MarkerImage('images/active_point.png');
于 2011-11-11T17:26:34.057 回答
0

IE 必须需要特定的 PNG 文件。从google api的示例更新我的动态图标源apis.google.com修复了它:

 // new source of icons
 var iconnumber = 5;
 var imgsrc = "http://chart.googleapis.com/chart?chst=d_map_pin_letter&chld=" + iconnumber + "|00FF00|000000&.png";
 var img = new google.maps.MarkerImage(imgsrc);
于 2015-08-05T23:37:26.247 回答
0

optimized: false创建自定义时的设置Marker解决了我.svg在 IE 中没有出现图标时遇到的问题。

有关更多详细信息,请参阅此链接 Google Maps SVG 标记在 IE 11 上不显示

于 2017-09-08T09:05:24.890 回答
0

另一种可能性是将属性 draggable = true 添加到标记中:

 <ui-gmap-markers coords="'self'" icon="'icon'" options="{ draggable: true }"> 

不知道为什么这解决了 IE 中的问题,检查一下

于 2016-03-16T15:51:36.547 回答