众果搜的博客

脚踏大地,仰望星空,致力于财经投资网站导航与在线网络工具的开发与普及

Search(博客搜索)

热文排行

最近发表

最新评论及回复

« FTP550错误的原因在线查询火车票代售点(广州市的代售点列表) »

Google Maps API中创建多个Marker的问题解决

 显示Google地图使用的是HTML网页,后台数据使用asp.net网页返回数据。由于返回数据采用XML格式后,在本地测试,在IE或Chrome或FireFox浏览器中均可以正常显示,上传到网站所租用的虚拟空间后,只有Chrome(FireFox)可以正常显示,IE无法返回XML格式的数据,分析估计是虚拟空间中防止IE使用XML注入漏洞,关闭了相应的功能。没有办法,只好另谋高就。

在改用返回HTML格式字符串方式,返回数据,然后进行分割显示。没有想到,问题接二连三出现。当采用以下代码添加Marker时,不知为何,始终显示的是最后一个Marker的信息,即只弹出最后一个Marker的窗口。比如有10个Marker需要加入地图,加入后,单击Marker,始终显示的是最后一个标记的信息窗口。使用XML格式的数据,经过解析后显示时则没有这样的问题。显示Marker的代码如下:

 var icon = new GIcon();
                   icon.image = "pushpinicon/" + siteId + ".png";

                    //icon.iconSize = new GSize(16, 16);
                    icon.iconAnchor = new GPoint(12, 12);
                    icon.infoWindowAnchor = new GPoint(12, 12);
                    var info = "";
                    info += "名称:" + name + "<br>";
                    info += "电话:" + telephone + "<br>";
                    info += "地址:" + address + "<br>";
                    //将代售点信息加入地图之中
                    markerOptions = { icon: icon };
                    var marker = new GMarker(point, markerOptions);
                    marker.id = siteId;
                    GEvent.addListener(marker, "click", function() {
                        marker.openInfoWindowHtml(info);
                    });
                    map.addOverlay(marker);
                    batch.push(marker); //将标记推入数组保存起来
                    batchInfo.push(info);
在Marker添加完毕,通过链接调用倒是可以正常显示各个Marker的信息窗口:
function openInfo(i) {
        var marker = batch[i-1];//因为数组是以0开头的,标记是以1开头的。
        marker.openInfoWindowHtml(batchInfo[i-1]);
    }
整了2天,一无所获。通过查找网络,知道可以将监听Click事件改为:
 GEvent.addListener(marker, "click", function() {
                        this.openInfoWindowHtml(info);
                    });
这时,单击每个Marker可以显示信息窗口,但是没有信息,信息是空白。
 
最后,尝试了一下Google Maps API中提供的这个方法,替代监听Click方法,解决了所有问题。单击某个Marker就显示某个Marker的信息:
markernew.bindInfoWindowHtml(info);
相关解释:bindInfoWindowHtml(content, opts?)  将给定的 HTML 捆绑到此标记中。当点击标记时,HTML 内容将自动显示在信息窗口中。将参数 content 设置为 null 时将解除绑定。(自 2.85 开始) 
从而解决了jQuery中AJAX使用XML数据,IE无法返回数据和Marker信息错乱的问题。
程序结果参见:http://www.zhongguosou.com/zonghe/trainticketsalesite00.html
至于XML数据在IE中无法正常返回,尤其是使用jQuery的AJAX时,看看这篇文章,或许有帮助:
http://www.nabble.com/jquery-code-works-with-firefox-but-not-ie.-td19745367s27240.html

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Powered By Z-Blog 1.8 Spirit Build 80722 Code detection by Codefense

Copyright www.zhongguosou.com. Some Rights Reserved.微信号:MiZhiHeiGeTaXiaoMi