Google maps api 3 从页面其他地方的链接触发点击Google Map API3标记

我一直在阅读许多类似的线程，看不到如何在我的代码中实现这一点。。。如有任何建议，将不胜感激

我通过AJAX设置了许多标记，并根据JSON结果中返回的数据在地图下方创建了一个表。我想在我的datatable中创建一个可点击的链接，该链接将模拟对地图上相应标记的点击，并打开已经为实际点击标记定义的信息窗口

function display( json_results ) {

        $("#map").gmap3({action:'clear'});

        $("#map").gmap3(
            {action: 'init',
              options:{
                center:true,
                zoom:13,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: true,
                mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
                },
                navigationControl: true,
                scrollwheel: true,
                streetViewControl: true
                }
            },
            {action: 'addMarkers',
                radius:100,
                markers: json_results,
                clusters:{
                            maxZoom: 10,
                            // This style will be used for clusters with more than 0 markers
                            20: {
                            content: '<div class="cluster cluster-1">CLUSTER_COUNT</div>',
                            width: 53,
                            height: 52
                            },
                            // This style will be used for clusters with more than 20 markers
                            50: {
                            content: '<div class="cluster cluster-2">CLUSTER_COUNT</div>',
                            width: 56,
                            height: 55
                            },
                            // This style will be used for clusters with more than 50 markers
                            100: {
                            content: '<div class="cluster cluster-3">CLUSTER_COUNT</div>',
                            width: 66,
                            height: 65
                            }

                    },
                marker: {
                    options: {
                        //icon: new google.maps.MarkerImage('http://maps.gstatic.com/mapfiles/icon_green.png'),
                        clickable: true
                        },
                    events:{
                        click: function(marker,event,data) {
                            $(this).gmap3({action: 'clear', name : 'infowindow'});
                            $(this).gmap3({action: 'addinfowindow', anchor: marker, options: { content:
                            '<div class="text"><strong><div style="color:navy;">' + data.itype + '</strong><br/><div id="address" snum="' + data.streetnum + '" snam="' + data.streetnam + '" styp="' + data.streettyp + '">'+ data.iaddress +'</div><br/>' + data.inum + '<br/>'+ data.datetime +'</div><hr>'+data.notes+'</div>'} })
                        },  
                        mouseover: function(marker, event, data){
                            $(this).gmap3(
                                { action:'clear', name:'overlay'},
                                { action:'addOverlay',
                                    latLng: marker.getPosition(),
                                    content:    '<div class="infobulle">' +
                                                '<div class="bg"></div>' +
                                                '<div class="text">' + data.itype +'</div>' +
                                                '</div>' +
                                                '<div class="arrow"></div>',
                                    offset: {
                                        x:-46,
                                        y:-73
                                    }
                                });
                        },
                        mouseout: function(){
                            $(this).gmap3({action:'clear', name:'overlay'});
                            }

                    } //end events
                } // end marker

                }
                ,{action:"autofit"} //end action

                );
            };

函数显示（json_结果）{
$（“#map”）.gmap3（{操作：'clear'}）；
$（“#地图”）.gmap3(
{操作：'init'，
选项：{
中：是的，
缩放：13，
mapTypeId:google.maps.mapTypeId.ROADMAP，
mapTypeControl:true，
mapTypeControlOptions：{
样式：google.maps.MapTypeControlStyle.DROPDOWN_菜单
},
导航控制：对，
滚轮：对，
街景控制：正确
}
},
{操作：'addMarkers'，
半径：100，
标记：json_结果，
集群：{
最大缩放：10，
//此样式将用于标记数超过0的簇
20: {
内容：“群集计数”，
宽度：53，
身高：52
},
//此样式将用于具有20个以上标记的簇
50: {
内容：“群集计数”，
宽度：56，
身高：55
},
//此样式将用于具有50个以上标记的簇
100: {
内容：“群集计数”，
宽度：66，
身高：65
}
},
标记：{
选项：{
//图标：新的google.maps.MarkerImage（'http://maps.gstatic.com/mapfiles/icon_green.png'),
可点击：正确
},
活动：{
单击：功能（标记、事件、数据）{
$（this.gmap3（{action:'clear'，name:'infowindow'}）；
$（this）.gmap3（{action:'addinfo window'，锚点：marker，选项：{content:
“”+data.itype+”
“+data.iaddress+”
“+data.inum+”
“+data.datetime+”
”+data.notes+”}）
},  
鼠标悬停：功能（标记、事件、数据）{
$（本文件）。gmap3(
{操作：'clear'，名称：'overlay'}，
{操作：'addOverlay'，
latLng:marker.getPosition（），
内容：“”+
'' +
“”+data.itype+“”+
'' +
'',
偏移量：{
x:-46，
y:-73
}
});
},
mouseout:function（）{
$（this.gmap3（{action:'clear'，name:'overlay'}）；
}
}//结束事件
}//结束标记
}
，{action:“autofit”}//结束操作
);
};

当加载页面和提交带有搜索结果的表单时，我从一些JQUERY调用此函数。一切都很完美。现在我想在地图外添加一个链接，该链接将触发对相应标记的单击

function display( json_results ) {

        $("#map").gmap3({action:'clear'});

        $("#map").gmap3(
            {action: 'init',
              options:{
                center:true,
                zoom:13,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: true,
                mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
                },
                navigationControl: true,
                scrollwheel: true,
                streetViewControl: true
                }
            },
            {action: 'addMarkers',
                radius:100,
                markers: json_results,
                clusters:{
                            maxZoom: 10,
                            // This style will be used for clusters with more than 0 markers
                            20: {
                            content: '<div class="cluster cluster-1">CLUSTER_COUNT</div>',
                            width: 53,
                            height: 52
                            },
                            // This style will be used for clusters with more than 20 markers
                            50: {
                            content: '<div class="cluster cluster-2">CLUSTER_COUNT</div>',
                            width: 56,
                            height: 55
                            },
                            // This style will be used for clusters with more than 50 markers
                            100: {
                            content: '<div class="cluster cluster-3">CLUSTER_COUNT</div>',
                            width: 66,
                            height: 65
                            }

                    },
                marker: {
                    options: {
                        //icon: new google.maps.MarkerImage('http://maps.gstatic.com/mapfiles/icon_green.png'),
                        clickable: true
                        },
                    events:{
                        click: function(marker,event,data) {
                            $(this).gmap3({action: 'clear', name : 'infowindow'});
                            $(this).gmap3({action: 'addinfowindow', anchor: marker, options: { content:
                            '<div class="text"><strong><div style="color:navy;">' + data.itype + '</strong><br/><div id="address" snum="' + data.streetnum + '" snam="' + data.streetnam + '" styp="' + data.streettyp + '">'+ data.iaddress +'</div><br/>' + data.inum + '<br/>'+ data.datetime +'</div><hr>'+data.notes+'</div>'} })
                        },  
                        mouseover: function(marker, event, data){
                            $(this).gmap3(
                                { action:'clear', name:'overlay'},
                                { action:'addOverlay',
                                    latLng: marker.getPosition(),
                                    content:    '<div class="infobulle">' +
                                                '<div class="bg"></div>' +
                                                '<div class="text">' + data.itype +'</div>' +
                                                '</div>' +
                                                '<div class="arrow"></div>',
                                    offset: {
                                        x:-46,
                                        y:-73
                                    }
                                });
                        },
                        mouseout: function(){
                            $(this).gmap3({action:'clear', name:'overlay'});
                            }

                    } //end events
                } // end marker

                }
                ,{action:"autofit"} //end action

                );
            };

例如：

，其中我将是一个值，在我将lat/long和infowindow数据传递给上述函数的同时，在JSON中传递该值。我假设发送用于映射的第一个数据数组是0，第二个数组是1等等，所以我将第一个链接设为I=0，第二个链接设为I=1等等

不确定这种逻辑是否合理，也许有更好的方法将引用传递给标记

function display( json_results ) {

        $("#map").gmap3({action:'clear'});

        $("#map").gmap3(
            {action: 'init',
              options:{
                center:true,
                zoom:13,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: true,
                mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
                },
                navigationControl: true,
                scrollwheel: true,
                streetViewControl: true
                }
            },
            {action: 'addMarkers',
                radius:100,
                markers: json_results,
                clusters:{
                            maxZoom: 10,
                            // This style will be used for clusters with more than 0 markers
                            20: {
                            content: '<div class="cluster cluster-1">CLUSTER_COUNT</div>',
                            width: 53,
                            height: 52
                            },
                            // This style will be used for clusters with more than 20 markers
                            50: {
                            content: '<div class="cluster cluster-2">CLUSTER_COUNT</div>',
                            width: 56,
                            height: 55
                            },
                            // This style will be used for clusters with more than 50 markers
                            100: {
                            content: '<div class="cluster cluster-3">CLUSTER_COUNT</div>',
                            width: 66,
                            height: 65
                            }

                    },
                marker: {
                    options: {
                        //icon: new google.maps.MarkerImage('http://maps.gstatic.com/mapfiles/icon_green.png'),
                        clickable: true
                        },
                    events:{
                        click: function(marker,event,data) {
                            $(this).gmap3({action: 'clear', name : 'infowindow'});
                            $(this).gmap3({action: 'addinfowindow', anchor: marker, options: { content:
                            '<div class="text"><strong><div style="color:navy;">' + data.itype + '</strong><br/><div id="address" snum="' + data.streetnum + '" snam="' + data.streetnam + '" styp="' + data.streettyp + '">'+ data.iaddress +'</div><br/>' + data.inum + '<br/>'+ data.datetime +'</div><hr>'+data.notes+'</div>'} })
                        },  
                        mouseover: function(marker, event, data){
                            $(this).gmap3(
                                { action:'clear', name:'overlay'},
                                { action:'addOverlay',
                                    latLng: marker.getPosition(),
                                    content:    '<div class="infobulle">' +
                                                '<div class="bg"></div>' +
                                                '<div class="text">' + data.itype +'</div>' +
                                                '</div>' +
                                                '<div class="arrow"></div>',
                                    offset: {
                                        x:-46,
                                        y:-73
                                    }
                                });
                        },
                        mouseout: function(){
                            $(this).gmap3({action:'clear', name:'overlay'});
                            }

                    } //end events
                } // end marker

                }
                ,{action:"autofit"} //end action

                );
            };

有人能帮我解决这个问题吗？也许是一个简单的函数，我可以将标记的值传递到我现有的代码中？或者你认为最好的方式

---

谢谢大师

您是否尝试定义自己的函数来处理点击

function myclick(i) {
    google.maps.event.trigger(markers[i],"click");
  }

及

函数setHTML（）{
var html=“”；
对于（var i=0；我不认为有更好的方法。如果用单引号替换单击前后的双引号，您的示例应该可以正常工作。我做了更改，但firebug说没有定义标记…我怀疑我需要更改语法以达到脚本中的标记，但不确定是什么？标记[i].id不是marker的默认属性，我在创建时设置了它。我已经对它的各种变体进行了修改，但在上面的示例中，我应该能够简单地传递
google.maps.event.trigger（markers[I]，“click”）
通过链接，我用I替换json数组的键……它不起作用……它只是说，标记没有定义，也没有触发地图上的覆盖图……我肯定错过了一些明显的东西。