Impossible to prevent auto panning to a marker when clicking on it (google maps)

问题

I use the google maps api v3, gmaps4rails and infobox and I cannot figure out how to remove the event which consist in auto panning the map on a marker as soon as it has been clicked...

The markers are sent from my controller:

Gmaps4rails.build_markers(experiences) do |experience, marker|
  marker.lat experience.latitude
  marker.lng experience.longitude
  marker.infowindow render_to_string(partial: "/trip_experiences/infowindow.html.erb", locals: {
    experience: experience,
    trip: trip
   })
  marker.title experience.name
end

And my map is built in js and markers are created by calling addMarkers on the handler:

handler = Gmaps.build('Google', { builders: { Marker: InfoBoxBuilder} }); handler.buildMap({ provider: mapOptions, internal: { id: 'map' } }, function(){ $.get(url, function(data) { handler.removeMarkers(markers); markers = handler.addMarkers(data); setCarouselOnInfowindow(); handler.bounds.extendWith(markers); callback(false) }); });

I have tried so far to diasbleAutoPan:true in the map options, to set the markers to unclickable and then add a listener on click, and done a lot of research but I did not found anything like this... So I guess I am doing something wrong but cannot find what!! Any help would be so grateful.... many tahnks

Edit : As suggested by @apneadiving, I tried to override the infowindow_binding method within the custom builder in order to remove @markers.panTo line but the map still auto center on marker when clicking on it.... Here is the code for the custom builder :

`

class @InfoBoxBuilder extends Gmaps.Google.Builders.Marker # inherit from base builder
      # override method
      create_infowindow: ->
        return null unless _.isString @args.infowindow
        boxText = document.createElement("div")
        boxText.setAttribute("class", 'infobox-container') #to customize
        boxText.innerHTML = @args.infowindow
        @infowindow = new InfoBox(@infobox(boxText))
      infobox: (boxText)->
        content: boxText
        ,disableAutoPan: true
        ,pixelOffset: new google.maps.Size(-140, -40)
        ,alignBottom: true
        ,zIndex: null
        ,disableAutoPan: true
        ,closeBoxURL: ""
        ,boxStyle: {
          width: "280px"
          ,opacity: 1
        }
        ,infoBoxClearance: new google.maps.Size(100, 1000)
        ,isHidden: false
        ,pane: "floatPane"
        ,enableEventPropagation: false
        infowindow_binding: =>
          @constructor.CURRENT_INFOWINDOW.close() if @_should_close_infowindow()
          @infowindow ?= @create_infowindow()
          return unless @infowindow?
          @infowindow.open( @getServiceObject().getMap(), @getServiceObject())
          @marker.infowindow ?= @infowindow
          @constructor.CURRENT_INFOWINDOW = @infowindow

` Any help would be great.... thank you very much

回答1:

I followed Apneadiving's suggestion as well and it worked fine for me. I put the following inside assets/javascripts/gmaps4rails-infoxbox.coffee. As you can see, all I did was pull the entire code out from the gem, then commented out the line about panning.

class @InfoBoxBuilder extends Gmaps.Google.Builders.Marker # inherit from base builder
  @CURRENT_INFOWINDOW: undefined
  @CACHE_STORE: {}

  # args:
  #   lat
  #   lng
  #   infowindow
  #   marker_title
  #   picture
  #     anchor: [x,y]
  #     url
  #     width
  #     height
  #   shadow
  #     anchor: [x,y]
  #     url
  #     width
  #     height
  # provider options:
  #   https://developers.google.com/maps/documentation/javascript/reference?hl=fr#MarkerOptions
  # internal_options
  #   singleInfowindow: true/false
  #   maxRandomDistance: null / int in meters
  constructor: (@args, @provider_options = {}, @internal_options = {})->
    @before_init()
    @create_marker()
    @create_infowindow_on_click()
    @after_init()

  build: ->
    @marker = new(@model_class())(@serviceObject)

  create_marker: ->
    @serviceObject = new(@primitives().marker)(@marker_options())

  create_infowindow: ->
    return null unless _.isString @args.infowindow
    new(@primitives().infowindow)({content: @args.infowindow })

  marker_options: ->
    coords = @_randomized_coordinates()
    base_options =
      title:    @args.marker_title
      position: new(@primitives().latLng)(coords[0], coords[1])
      icon:     @_get_picture('picture')
      shadow:   @_get_picture('shadow')
    _.extend @provider_options, base_options

  create_infowindow_on_click: ->
    @addListener 'click', @infowindow_binding

  infowindow_binding: =>
    @constructor.CURRENT_INFOWINDOW.close() if @_should_close_infowindow()
    # @marker.panTo()
    @infowindow ?= @create_infowindow()

    return unless @infowindow?

    @infowindow.open( @getServiceObject().getMap(), @getServiceObject())
    @marker.infowindow ?= @infowindow
    @constructor.CURRENT_INFOWINDOW = @infowindow

  _get_picture: (picture_name)->
    return null if !_.isObject(@args[picture_name]) || !_.isString(@args[picture_name].url)
    @_create_or_retrieve_image @_picture_args(picture_name)

  _create_or_retrieve_image: (picture_args) ->
    if @constructor.CACHE_STORE[picture_args.url] is undefined
      @constructor.CACHE_STORE[picture_args.url] = new(@primitives().markerImage)(picture_args.url, picture_args.size, picture_args.origin, picture_args.anchor , picture_args.scaledSize)

    @constructor.CACHE_STORE[picture_args.url]

  _picture_args: (picture_name)->
    {
      url:        @args[picture_name].url
      anchor:     @_createImageAnchorPosition @args[picture_name].anchor
      size:       new(@primitives().size)(@args[picture_name].width, @args[picture_name].height)
      scaledSize: null
      origin:     null
    }

  _createImageAnchorPosition : (anchorLocation) ->
    return null unless _.isArray anchorLocation
    new(@primitives().point)(anchorLocation[0], anchorLocation[1])

  _should_close_infowindow: ->
    @internal_options.singleInfowindow and @constructor.CURRENT_INFOWINDOW?

  _randomized_coordinates: ->
    return [@args.lat, @args.lng] unless _.isNumber(@internal_options.maxRandomDistance)

    #gives a value between -1 and 1
    random = -> (Math.random() * 2 - 1)
    dx  = @internal_options.maxRandomDistance * random()
    dy  = @internal_options.maxRandomDistance * random()
    Lat = parseFloat(@args.lat) + (180/Math.PI)*(dy/6378137)
    Lng = parseFloat(@args.lng) + ( 90/Math.PI)*(dx/6378137)/Math.cos(@args.lat)
    return [Lat, Lng]

来源：https://stackoverflow.com/questions/27458649/impossible-to-prevent-auto-panning-to-a-marker-when-clicking-on-it-google-maps