2013-07-04 51 views
0

我的Google地图工作正常,但鼠标悬停和鼠标未显示div。任何人都可以看到我的错误或我做错了什么?我的主机服务器上安装了jquery。Google地图工具提示mouseover/mouseout

<html> 
<head> 
<title>Map</title> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
<meta charset="utf-8"> 

<script src="jquery/jquery.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 

<script type="text/javascript"> 
function initialize() { 
    var LatLng = new google.maps.LatLng(51.620946, -8.890981); 
    var mapOptions = { 
     zoom: 12, 
     center: LatLng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(document.getElementById('map-canvas'), 
     mapOptions); 

    var contentstring = '<div style="height:50px;background-color:red;width:50px;">Hello</div>';   

    var LatLng = new google.maps.LatLng(51.620946, -8.890981); 
    var marker_0 = new google.maps.Marker({ 
     position:LatLng, 
    map:map, 
    descrip:contentstring, 
    link:'https://www.google.ie/' 
    }) 

    google.maps.event.addListener(marker_0,'mouseover',function(){ 
    tooltip.show(this.descrip); 
    }); 

    google.maps.event.addListener(marker_0,'mouseout',function(){ 
     tooltip.hide(); 
    }); 

    google.maps.event.addListener(marker_0,'click',function(){ 
     window.open(this.link);  
    }); 
} 

$(document).ready(function(){ 
    initialize(); 
}) 



</script> 
</head> 
<body> 
    <div id="map-canvas" style="width:600px;height:400px;border:solid 1px red;"></div> 
</body> 
</html> 

在此先感谢您的帮助。

+0

你有什么错误吗?也许在控制台中的代码错误?而我无法看到工具提示实际定义在哪里... –

回答

0

从上面的代码,它看起来并不像你所定义的变量“提示”

0

不是传递descriplink属性您marker_0,尽量刚好路过title和它的作品。像这样...

function initialize() { 
    var LatLng = new google.maps.LatLng(51.620946, -8.890981); 
    var mapOptions = { 
     zoom: 12, 
     center: LatLng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    var contentstring = '<div style="height:50px;background-color:red;width:50px;">Hello</div>';   

    var marker_0 = new google.maps.Marker({ 
     position:LatLng, 
     map:map, 
     title: contentstring 
     //descrip:contentstring, 
     //link:'https://www.google.ie/' 
    }) 

    /* 

    ** HAVE COMMENTED THIS BIT OUT AS THE MARKER ABOVE WILL WORK AS A TOOL TIP ** 
    google.maps.event.addListener(marker_0,'mouseover',function(){ 
     tooltip.show(this.descrip); 
    }); 

    google.maps.event.addListener(marker_0,'mouseout',function(){ 
     tooltip.hide(); 
    }); 

    google.maps.event.addListener(marker_0,'click',function(){ 
     window.open(this.link);  
    }); */ 
} 

有一个在DOCS一个Simple Marker Exmaple Here

可用于标记的属性是干邑生产商。

希望这会有所帮助。