如何向Gmap3标记添加一些新变量,并在鼠标事件触发时检索它们

How to add some new variables to Gmap3 marker and retrieve them when a mouse event fire?

本文关键字:鼠标 事件 检索 变量 Gmap3 添加 新变量      更新时间:2023-09-26

我遇到gmap3问题。我想在标记中添加一些信息,并将它们显示在信息窗口中。但我不知道如何将这些信息添加到标记中,因为默认标记只包含一些变量,如:"title"、"data"和一些选项。

现在我想添加一些信息,比如地址。如何将它们存储到标记中,并在鼠标事件触发时获取它们?

 $('#gmap').gmap3({
        map:{
            options:{
                center:[10.823099,106.629664],
                zoom: 15
            }
        },
        marker:{
            values:Markers,
            options:{
                draggable: false
            },
            events:{
                click: function(marker,event,context){
                },
                mouseover: function(marker, event, context){
                    var map = $(this).gmap3("get"),
                            infowindow = $(this).gmap3({get:{name:"infowindow"}});
                    if (infowindow){
                        infowindow.open(map, marker);
                        infowindow.setContent('<div class="infoWindow">'+context.data+'</div>');
                    } else {
                        $(this).gmap3({
                            infowindow:{
                                anchor:marker,
                                options:{content: context.data}
                            }
                        });
                    }
                },
                mouseout: function(){
                    var infowindow = $(this).gmap3({get:{name:"infowindow"}});
                    if (infowindow){
                        infowindow.close();
                    }
                }
            }
        }
    });

这是我的初始化函数。

这是我的标记:

marker = {
            latLng : [location.Latitude, location.Longitude],
            data   : '<span class="title"><b>'+location.Title+'</b></span>'+'<br>'+'<span class="address">'+location.Address+'</span>',
            options:{icon: 'data:image/png;base64,'+location.LocationType.Image},
            locationData: location
        };
        Markers.push(marker);

所以主要的问题是:当点击事件触发时,我如何检索locationData?

谢谢你的预付款。

我自己找到了解决方案。

首先转到gmap3.js并编辑函数:

function tuple(args, value) {
    var k, i,
        keys = ["data", "tag", "id", "events",  "onces", "locationData"],
        td = {};

请注意,我已将locationData添加到密钥中。

然后转到功能附加事件并像这样编辑

function attachEvents($container, args, sender, id, senders) {
    var td = args.td || {},
        context = {
            id: id,
            data: td.data,
            tag: td.tag,
            locationData: td.locationData
        };

通过这种方式,您必须编辑原始js文件。寻找另一种解决方案,使其变得更好。感谢