如何在Infobox中使用AjaxUrl属性(ExtInfoWindow)?

时间:2013-04-19 13:40:08

标签: javascript jquery google-maps google-maps-api-3

我的任务是将googlemaps版本2更新为版本3.

我有第二版的代码,使用ExtInfoWindow获取信息的“弹出窗口”,经过对下面链接的广泛阅读后,我发现该方法的等价物是Infobox或InfoWindow。我决定去信息框。

阅读链接:

https://developers.google.com/maps/documentation/javascript/reference#InfoWindow

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/examples.html

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html

http://gmaps-utility-library-dev.googlecode.com/svn/trunk/extinfowindow/docs/reference.html

第2版的代码:

 google.maps.event.addListener(marker, 'click', function() {
        marker.openExtInfoWindow(
        map,
        "mapwindow",
        "<img src='/images/ajax-loader.gif'>",
        { beakOffset: 0, paddingX: 60, paddingY: 45, ajaxUrl: '/templates/GoogleMapsMarkerInfo.aspx?id=' + page + '&epslanguage=<%=CurrentPage.LanguageBranch %>' }
        ); 
};

正如您从代码中看到的,我有属性ajaxUrl,我无法在InfoWindow或InfoBox中找到它。我想我可以把上面的AjaxUrl放在内容属性中(检查下面的代码)但是在读完内容属性的文档后几次我意识到这不起作用。

我的尝试:

 google.maps.event.addListener(marker, 'click', function() {
                var myOptions = {
                 content: {"<img src='/images/ajax-loader.gif'>",'/templates/GoogleMapsMarkerInfo.aspx?id=' + page + '&epslanguage=<%=CurrentPage.LanguageBranch %>'}
                ,disableAutoPan: false
                ,maxWidth: 0
                ,pixelOffset: new google.maps.Size(60, 45)
                };
            var ib = new InfoBox(myOptions);
            ib.open(map, marker);
}

firebug错误消息: http://img401.imageshack.us/img401/8646/firebugerror.png

我一直在寻找大约5个小时的相当于来自ExtInfoWindow的AjaxUrl而没有任何运气。

如果有人对我的问题有答案我会感谢答案,如果不是问题我会很感激,如果你能把我链接到一些关于解决方案的文档。

谢谢!

2 个答案:

答案 0 :(得分:1)

根据文档,“content”采用字符串或节点。

  

要在InfoWindow中显示的内容。这可以是HTML元素,a   纯文本字符串或包含HTML的字符串。 InfoWindow将是   根据内容大小。为。设置显式大小   内容,将内容设置为具有该大小的HTML元素。

您应该只对内容执行自己的ajax请求并将其提供给infowindow / infobox。

答案 1 :(得分:0)

我找到了解决方案!

感谢Rick尝试启动我的大脑。

一旦我理解了Rick的内容,我就非常简单。

我执行了一个ajax请求,我收到的数据是一个html文档。

正如Rick提到的内容属性可以显示这些信息所以我只是设置了我回到内容的数据而且瞧!

代码:

 $.ajax({
                url: '/templates/GoogleMapsMarkerInfo.aspx?id=' + page + '&epslanguage=<%=CurrentPage.LanguageBranch %>',
                dataType: "html",
                success: function(data){
                    var infowindow = new google.maps.InfoWindow({
                      content:data
                    });
                    infowindow.open(map, marker);
                }
             });

谢谢里克!