0

我确信这是一个简单的修复，但我一直在搜索，我尝试的一切都不起作用。我要做的就是用自定义图标替换默认标记，但它不会显示。这是我的代码：

<script type="text/javascript">

function initialize() {
var myLatlng = new google.maps.LatLng(43.041936,-88.044523);
var mapOptions = {
    center:myLatlng,
    zoom:15,
    disableDefaultUI:true,
    mapTypeId:google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("milwaukeeMap"), mapOptions);

var marker = new google.maps.Marker();
    marker.setPosition(myLatlng);
    marker.setMap(map);
    marker.setIcon('/images/map-marker.png');
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

我知道图像在正确的位置；如果我输入路径，我可以在浏览器中找到它。我已经检查并仔细检查了，但是我的代码有问题吗？对不起，我不能提供一个活生生的例子。

4

4 回答 4

4 
<script type="text/javascript">

function initialize() {
var myLatlng = new google.maps.LatLng(43.041936,-88.044523);
var mapOptions = {
        center:myLatlng,
        zoom:15,
        disableDefaultUI:true,
        mapTypeId:google.maps.MapTypeId.ROADMAP
        }
var map = new google.maps.Map(document.getElementById("milwaukeeMap"), mapOptions);

var markerImage = 'images/map-marker.png';

var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        icon: markerImage
        });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

试试这个，我改变了如何创建标记。

我更改了图像 url 来测试它，它接缝它的工作：

<html>
<head>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript">

function initialize() {
var myLatlng = new google.maps.LatLng(43.041936,-88.044523);
var mapOptions = {
        center:myLatlng,
        zoom:15,
        disableDefaultUI:true,
        mapTypeId:google.maps.MapTypeId.ROADMAP
        }
var map = new google.maps.Map(document.getElementById("milwaukeeMap"), mapOptions);

var markerImage = 'http://www.mapsmarker.com/wp-content/uploads/leaflet-maps-marker-icons/bar_coktail.png';

var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        icon: markerImage
        });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="milwaukeeMap" style="height:400px;width:400px;"></div>
</body>
</html>

JSFiddle 上的代码http://jsfiddle.net/iambnz/NGja4/160/

于 2013-07-12T15:53:54.730 回答
0

我创建了一个小测试文件，您的 javascript 代码似乎没有任何问题。我完美地看到了我自己的标记。因此，您的 HTML 文件的其余部分似乎有问题。PNG文件是否存在？真的是PNG吗？也许尝试不同的图像来确定。

罗恩。

于 2013-07-12T15:52:52.977 回答
0

我发现在某些情况下，外部托管的图标需要一个额外的参数，例如

images/map-marker.png?raw=true
于 2017-06-04T17:48:00.793 回答
0

我在 Ubuntu 上使用 Firefox 57.0.4，然后我切换到 Chromium 版本 63.0.3239.84 并且它工作正常。那是与

?raw=true

开和关。

于 2018-01-19T23:23:22.297 回答