2016-03-02 89 views
0

我已经添加了一个带有标记的地图到我的网站,但我不确定Title属性为标记做了什么。谷歌地图标记标题没有显示?

我从developers.google网站

https://developers.google.com/maps/documentation/javascript/examples/marker-simple

使用的文档在这个例子是什么这个 “Hello World”(标记名称)究竟做什么? 我在OS X埃尔卡皮坦 - 铬

function initMap() { 
    var myLatLng = {lat: -25.363, lng: 131.044}; 

    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 4, 
    center: myLatLng 
    }); 

    var marker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    title: 'Hello World!' 
    }); 
} 
+3

当你将鼠标悬停在标记上的提示将与标题显示在....你的情况'你好世界'.....多数民众赞成使用标题 – Vijaykrish93

+3

如果你悬停在标记上,你可以看到标题(你好世界)。 – harry

+0

这就是我的预期,但它似乎并没有工作。甚至没有在谷歌网站上 –

回答

1

这会为你工作,尝试

<div id="map"></div> 
<script src="https://maps.googleapis.com/maps/api/js"></script> 
<script> 

function init() { 
    var myLatLng = {lat: -25.363, lng: 131.044}; 

    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 4, 
    center: myLatLng 
    }); 

    var marker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    title: 'Hello World!' 
    }); 

    google.maps.event.addListener(marker , 'click', function(){ 
     var infowindow = new google.maps.InfoWindow({ 
     content:'Hello Title', 
     position: myLatLng, 
     }); 
     infowindow.open(map); 
    }); 
} 

$(document).ready(function(){ 
    google.maps.event.addDomListener(window, 'load', init()); // two calls 

}); 

</script> 

你只是错过了的addListener事件与标记附着。

2

我发现它不可靠,它不会在显示一组标记时在鼠标悬停上显示所有标题工具提示。

解决的办法是设置在创建标记时,该选项:。

optimized: false 

“优化渲染许多标记作为一个单一的静态元素的优化渲染默认情况下启用禁用优化渲染动画GIF或PNG ,或者每个标记必须呈现为单独的DOM元素(仅限高级用法)。“

https://developers.google.com/maps/documentation/javascript/3.exp/reference#MarkerOptions

感谢这里的评论对谷歌地图问题跟踪凸显此解决方案: https://issuetracker.google.com/35822066#comment22

+0

但是你应该注意,这个选项会使标记“可拖动”。开始使用标记时,不能再拖动地图(标记的行为与图像相同)。 – jacqbus

+0

_this选项使标记“可拖动”_ - 不,它不。 _“你不能拖动地图了” - - 是的,你可以。 – duncan

+0

写“可拖动”我的意思不是标记本身,但它的形象。它的开始行为与典型的元素相似 - 您可以拖动它。关于拖拽地图 - 不,如果您尝试在标记上拖动地图时不能拖曳地图,则不会映射它自己。下面是例子:http://imgur.com/a/9oYwu – jacqbus