代码之家 › 专栏 › 技术社区 › Mere Development

使用InfoBox时如何定位jquery-ui-map生成的映射

infobox jquery-ui-map google-maps-api-3 jquery

0

Mere Development · 技术社区 · 13 年前

我正在使用 jquery-ui-map 要创建这样的谷歌地图实例:

$('#CHMap').gmap({
  mapTypeControl : false
}).bind('init', function(evt, map) {
  log("Map initilised");
});

然后在我使用的脚本的其他地方 InfoBox 添加一些样式信息框,其中填充了从地理定位服务中提取的数据,如下所示:

var boxText = document.createElement("div");
var ib = new InfoBox(myOptions); //myOptions can be ignored for this example

$.each(data, function(name, value) {
  $('#CHMap').gmap('addMarker', {
    id:value['YourId'],
    'position': value['Latitude']+','+value['Longitude'],
    'bounds': true,
    'icon': '/img/gicon.png'
  }).click(function() {
    boxText.innerHTML = "hello";
    ib.setContent(boxText);
    ib.open(map, this);
  });
});

“data”是从地理定位服务返回的对象。如果我在第一次创建gmap时将上面的addMarker代码放在绑定的init函数中,那么infoBox就会显示良好。当我在其他地方使用“addMarker”代码时,我会在控制台中得到“Uncaught ReferenceError:map is not defined”错误。

如何正确引用“地图”?看起来我做不到 var map = $('#CHMap').gmap({//options}); 正如“jquery-ui-map”文档所建议的那样,gmap什么也不返回。

1 回复 | 直到 13 年前

1

0

Mere Development 13 年前

我想你可以

var map = $('#CHMap').gmap();

OP中的注意事项。最新插件中的正确方式是:

var map = $('#CHMap').gmap('get', 'map');

我看不出它在API中什么也不返回

当您需要运行accessthemap时,您可以将代码添加到googlemaps事件侦听器中,该侦听器将等待,直到像这样加载map瓦片。

由于Gmaps是从谷歌异步获取的,除非你这样做,否则当你调用它时,你不能总是确定它会在那里。

google.maps.event.addListener(YOUR_GOOGLE_MAPS_INSTACE, 'tilesloaded', function() {
       // put your initialization code in here.
}

因此,它只会在映射完全加载后执行。

来自巴西的欢呼!