我面临一个关于谷歌地图单标记针位置的奇怪问题。我到底怎么了?我正在使用 infobubble.js 和 gmap3.js 在 Google 地图上创建带有信息窗口的集群标记。每件事都运行良好,但我面临的一个问题是,当我单击群集时,信息窗口在当前单击的群集上打开,这是正确的,但是当我单击单个标记引脚然后单击群集时,单个标记引脚会跳转到当前点击的集群。
信息气泡js:
<script type='text/javascript' src="http://londonescort.se/wp-content/themes/javo-directory/assets/js/google.map.infobubble.js?f42488"></script>
我使用这段代码初始化这个js
var myList=0;
var mainPos=0;
var groupLtdLnt='';
var marker_id_default='';
jQuery( function($){
var javo_search_func = {
/*****************************************
**
** Variables
**
*****************************************/
el : $('.javo-search-map-area')
, distance_unit : $('[javo-map-distance-unit]').val()
, distance : $('[javo-map-distance-unit]').val() == 'mile' ? 1609.344 : 1000
, distance_max : $('[javo-map-distance-max]').val()
, ob_ib : null
, markers : null
, bound : new google.maps.LatLngBounds()
, options:{
/* InfoBubble Option */
info_bubble:{
minWidth:362
, minHeight:180
, overflow:true
, shadowStyle: 1
, padding: 5
, borderRadius: 10
, arrowSize: 20
, borderWidth: 1
, disableAutoPan: false
, hideCloseButton: false
, arrowPosition: 50
, arrowStyle: 0
}
/* Display Ratings */
, raty:{
starOff: '<?php echo JAVO_IMG_DIR?>/star-off-s.png'
, starOn: '<?php echo JAVO_IMG_DIR?>/star-on-s.png'
, starHalf: '<?php echo JAVO_IMG_DIR?>/star-half-s.png'
, half: true
, readOnly: true
}
/* Map */
, map_init:{
map:{
options:{
center: new google.maps.LatLng(0, 0)
, mapTypeControl : false
//,draggable: false
//, scrollwheel: false
}
}
, panel:{
options:{
content :"<div class='btn-group'><a class='btn btn-default active' data-map-move-allow><i class='fa fa-unlock'></i></a></div>"
,right : true
, middle: true
}
}
, marker:{
events:{}
, cluster:{
radius:100
, 0:{ content:'<div class="javo-map-cluster admin-color-setting">CLUSTER_COUNT</div>', width:52, height:52 }
, events:{}
}
}
}
/* Map Style & P.O.I InfoBox Delete */
, map_style:[
{
featureType: "poi",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
}
]
}
/*****************************************
**
** Main Funciton
**
*****************************************/
, init:function(){
/* Get Self Oboject */
var $object = this;
/* Define InfoBubble Plug-in */
this.ob_ib = new InfoBubble( this.options.info_bubble );
/* Set Marker Variable */
this.markers = new Array();
var is_poi_hidden = $('[name="javo_google_map_poi"]').val() == 'off';
/* Get Marker Informations */
this.sanitize_marker = JSON.parse( $('input[name="javo-this-term-all-item"]').val() );
/* Get Marker Informations */
$.each( this.sanitize_marker, function(i, k)
{
if( k.lat != "" && k.lng != "" )
{
$object.markers.push({
id : '#javo_map_tmp_' + i
, latLng : new google.maps.LatLng( k.lat, k.lng )
, options : { icon: k.icon }
, data : k
});
}
});
/* Set bind Markers */
this.options.map_init.marker.values = this.markers;
//this.options.map_init.marker.events.clickMap = this.marker_cluster_click;
this.options.map_init.marker.events.click = this.marker_click;
//this.options.map_init.marker.events.click = this.marker_single_click;
this.options.map_init.marker.cluster.events.click = this.cluster_click;
/* Define Google Map for Div Element */
this.el.height(500).gmap3( this.options.map_init, 'autofit' );
this.map = this.el.gmap3('get');
if( is_poi_hidden )
{
// Map Style
this.map_style = new google.maps.StyledMapType(
this.options.map_style
, { name : 'Javo Single Item Map' }
);
this.map.mapTypes.set('map_style', this.map_style);
this.map.setMapTypeId('map_style');
}
/* Set Ratings */
$('.javo_archive_list_rating').each(function(){
$object.options.raty.score = $(this).data('score');
$(this).raty( $object.options.raty ).width('');
});
var javo_search_position_slide_option = {
start: [300]
, step: 1
, range:{ min:[1], max:[ parseInt( $object.distance_max ) ] }
, serialization:{
lower:[
$.Link({
target: $('[javo-wide-map-round]')
, format:{ decimals:0 }
})
, $.Link({
target: '-tooltip-<div class="javo-slider-tooltip"></div>'
, method: function(v){
$(this).html('<span>' + v + ' ' + $object.distance_unit + '</span>');
}, format:{ decimals:0, thousand:',' }
})
]
}
};
/*
Geo Location Slider Block
$('[data-javo-search-form]')
.find(".javo-position-slider")
.noUiSlider(javo_search_position_slide_option)
.on('set', $object.geolocation);
*/
; $( document ).on('click', '[data-map-move-allow]', this.lock_map );
}
, lock_map: function(e){
var $object = javo_search_func;
$( this ).toggleClass('active');
if( $( this ).hasClass('active') )
{
// Allow
$object.map.setOptions({ draggable: true, scrollwheel: true });
$( this ).find('i').removeClass('fa fa-lock').addClass('fa fa-unlock');
}else{
// Not Allowed
$object.map.setOptions({ draggable:false, scrollwheel: false });
$( this ).find('i').removeClass('fa fa-unlock').addClass('fa fa-lock');
}
}
, geolocation: function(){
var $this = $(this);
var $object = javo_search_func;
var $radius = $('[javo-wide-map-round]').val();
$object.el.gmap3({
getgeoloc:{
callback:function(latlng){
if( !latlng ){
$.javo_msg({content:'Your position access failed.'});
return false;
};
$(this).gmap3({ clear:'circle' });
$(this).gmap3({
map:{
options:{ center:latlng, zoom:12 }
}, circle:{
options:{
center:latlng
, radius:$radius * parseFloat( $object.distance )
, fillColor:'#464646'
, strockColor:'#000000'
}
}
});
$(this).gmap3({
get:{
name: 'circle'
, callback: function(c){
$(this).gmap3('get').fitBounds( c.getBounds() );
}
}
});
}
}
});
}
, cluster_click: function(c, e, d){
var $object = javo_search_func;
var $map = $(this).gmap3('get');
var maxZoom = new google.maps.MaxZoomService();
var c_bound = new google.maps.LatLngBounds();
// IF Cluster Max Zoom ?
maxZoom.getMaxZoomAtLatLng( d.data.latLng , function( response ){
//if( response.zoom <= $map.getZoom() && d.data.markers.length > 0 )
//{
var str = '';
str += "<div class='list-group'>";
str += "<a class='list-group-item disabled text-center'>";
str += "<strong>";
str += $("[javo-cluster-multiple]").val();
str += "</strong>";
str += "</a>";
var p=1;
$.each( d.data.markers, function( i, k ){
myList=p;
str += "<a href=\"javascript:javo_search_func.cluster_trigger('" + k.id +"');\" ";
str += "class='list-group-item'>";
str += k.data.post_title + " (" + k.data.category + ' / ' + k.data.location + ")";
str += "</a>";
p++;
});
str += "</div>";
groupLtdLnt=c.main.getPosition();
console.log(c.main.getPosition());
$object.ob_ib.setContent( str );
$object.ob_ib.setPosition( c.main.getPosition() );
$object.ob_ib.open( $map );
if( response.zoom <= $map.getZoom() )
{
console.log('ZoomOut');
console.log(c.main.getPosition());
}
else{
$map.setCenter( c.main.getPosition() );
//console.log('ZoominOut');
//console.log(c.main.getPosition());
//$map.setZoom( $map.getZoom() );
}
} );
}
, cluster_trigger: function( marker_id )
{
this.el.gmap3({
get:{
name : "marker"
, id : marker_id
, callback : function(m){
marker_id_default=marker_id;
google.maps.event.trigger(m, 'click');
}
}
});
},
marker_click: function( m, e, c )
{
var instance= $(this);
//console.log(c);
var obj = javo_search_func;
var map = instance.gmap3( 'get' );
console.log(m.getPosition());
var postion= m.getPosition();
var ltd=postion.A;
var lng=postion.F;
console.log(ltd+','+lng);
//map.setZoom( map.getZoom()+2 );
obj.ob_ib.setContent( '<h1> This is single marker</h1>');
map.setCenter(m.getPosition());
var zoom= map.getZoom();
if(e==undefined)
{
obj.ob_ib.open(map);
}
else
{
obj.ob_ib.open(map,m);
}
// map.setCenter( m.getPosition() );
}
};
javo_search_func.init();
window.javo_search_func = javo_search_func;
} );
请帮我解决这个问题。谢谢