2012-01-17 47 views
0

怎能openInfoWindowHtml在谷歌地图,而鼠标在PHP MySQL的结果如下,显示多个位置标记

http://www.yelp.com/c/denver/health

该网站显示在谷歌地图信息窗口,同时鼠标移到结果的标题

尝试作为以下,

//<![CDATA[ 
var map; 
var geocoder; 
var markerArray = []; 
function loadMap(params) { 
    if (GBrowserIsCompatible()) { 
     geocoder = new GClientGeocoder(); 
     map = new GMap2(document.getElementById('map')); 
     map.addControl(new GSmallMapControl()); 
     map.addControl(new GMapTypeControl()); 
     map.setCenter(new GLatLng(40, -100), 4); 
     map.setZoom(8); 
     searchLocationsNear(params) 
    } 
} 

function searchLocationsNear(params) { 

    var data = JSON.parse(params); 
    var lenght = data.length; 
    var bounds = new GLatLngBounds(); 
    for (var i = 0; i < lenght; i++) { 

     // check lat and long available with data 
     if (data[i].enough_for_map) { 
      var name = data[i].name; 
      var address = data[i].address; 

      if (data[i].description) 
       var description = data[i].description; 

      var point = new GLatLng(data[i].latitude, data[i].longitude); 

      var marker = createMarker(point, name, address, description); 

      map.addOverlay(marker); 

      markerArray[i + 1] = marker; 

      var el_index = $('service_name_' + i); 

      if (el_index) { 

       el_index.addEvent('mouseover', marker); 

       // GEvent.addDomListener(el_index, 'mouseover', function() { 
       // GEvent.trigger(markerArray[i], 'click'); 
       // }); 

      } 

      bounds.extend(point); 
     } 
    } 
    map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)); 
} 

function createMarker(point, name, address, description) { 
    var marker = new GMarker(point); 
    var html = '<b>' + name + '</b> <br/><p>' + description + '</p>' + address; 
    GEvent.addListener(marker, 'click', function() { 
     marker.openInfoWindowHtml(html); 
    }); 
    return marker; 
} 

上述地图上的位置从MySQL结果S指出等。

<h2> 
    <a id="service_name_1" href="/example/details/bookkeeper/191">Photographer</a> 
</h2> 
<h2> 
    <a id="service_name_2" href="/example/details/bookkeeper/192">Teacher</a> 
</h2> 
<h2> 
    <a id="service_name_3" href="/example/details/bookkeeper/193">Accountant</a> 
</h2> 

除外结果: 虽然每个h2鼠标悬停应该表现出相应的在地图上的位置信息。

任何建议将不胜感激

感谢

回答

0

有多远,你得到?

原则上你可以,

放在您放置其中显示自定义信息窗口(几个不同的方法/例子在这里:http://code.google.com/intl/sv-SE/apis/maps/documentation/javascript/demogallery.html)在地图上的标记标准“click'事件侦听器。

在侧边栏列表的li元素上有另一个'mouseover'侦听器,轮流触发click事件。 (这里是如何触发谷歌地图事件:http://code.google.com/intl/sv-SE/apis/maps/documentation/javascript/reference.html#event

+0

用脚本编辑的问题。请问您可以查看 – abhis 2012-01-18 09:42:25

+0

您为什么使用API​​-2?你的问题标签说API-3。 – jenswirf 2012-01-18 10:08:19

+0

如果我是你,我会研究'el_index.addEvent('mouseover',marker)''行,也许用'el_index.addEventListener('mouseover',function(){GEvent。 trigger(markerArray [i],'click')}); – jenswirf 2012-01-18 10:11:40

相关问题