谷歌地图API移动到远标记在每次渲染(似乎随机)

google map API moves toward far marker on every render (seems random)

本文关键字：随机 移动 API 谷歌地图      更新时间：2023-09-26

我制作了一个使用Google Maps API V3的应用程序。我设置了一个位置

myLatlng = new google.maps.LatLng(22.26, 114.19)

在香港的某个地方。这是在"渲染"中设置的(在Meteor.JS中)，所以每次你进入那个页面时，它都应该去那个位置。但问题是，我把它放到了网上，开始和我的朋友们玩这个应用。当有人在屏幕外或离初始位置(香港)很远的地方放置一个大头针时，每次人们再次渲染页面时，地图都会拉向那个遥远的大头针。有人知道为什么和如何解决这个问题吗?我现在不想做地理定位，我以后会把它作为一个按钮函数。

下面是我的代码: 
makeModal = (marker, nameObject)->
  google.maps.event.addListener marker, "click", ->
    Crater.overlay "profilepop",
      data:
        nameObject
arrayOfMarkers = []
Template.map.rendered = ->
  if !Meteor.user()
    $('#map-canvas').attr("title", "sign in to add your pin!")
  Crater.dismissOverlay('.crater-overlay')
  GoogleMaps.init
    sensor: true #optional
    key: gmapskey #optional
    # language: "de" #optional
  , ->
myLatlng = new google.maps.LatLng(22.26, 114.19)
mapOptions =
  zoom: 13
  mapTypeId: google.maps.MapTypeId.ROADMAP
  center: myLatlng
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions)

google.maps.event.addListener map, "click", (e) ->
  placeMarker e.latLng, map
  updateThis =
    "profile.lat": e.latLng.k
    "profile.long": e.latLng.B
  currentTarget = Meteor.userId()
  Meteor.call 'updateThis' ,updateThis, currentTarget, (error, result) ->
listOfUsers = Meteor.users.find().fetch()

arrayOfMarkers = []
for i in [0...listOfUsers.length]
  if listOfUsers[i].profile.lat != null
    thisLocation = new google.maps.LatLng(listOfUsers[i].profile.lat, listOfUsers[i].profile.long)
    marker = new google.maps.Marker(
      id: listOfUsers[i]._id
      title: listOfUsers[i].profile.name
      position: thisLocation
      map: map
      icon: listOfUsers[i].profile.picturesquare
    )
    mapinfo = "hi"
    name = listOfUsers[i].profile.name
    nameObject = listOfUsers[i]
    contentStr = "<div style='height:auto, width:auto'>#{name}</div>"
    infowindow = new google.maps.InfoWindow(content: contentStr)
    infowindow.open(map, marker)
    arrayOfMarkers.push(marker)
    makeModal marker, nameObject
console.log arrayOfMarkers

  placeMarker = (position, map) ->
    ##add if statement for people adding forr the first time
    if Meteor.user().profile.lat == null
    else
      oldPin = _.find(arrayOfMarkers, (x) ->
        x.id == Meteor.user()._id
      )
      oldPin.setMap(null)
      oldPin = null
      arrayOfMarkers = _.filter(arrayOfMarkers, (x) ->
        x.id != Meteor.user()._id
      )
    marker = new google.maps.Marker(
      id: Meteor.user()._id
      position: position
      map: map
      animation: google.maps.Animation.DROP
      icon: Meteor.user().profile.picturesquare
    )
    mapinfo = "hi"
    name = Meteor.user().profile.name
    picLink = Meteor.user().profile.picture
    contentStr = "<p>#{name}</p>"
    infowindow = new google.maps.InfoWindow(content : contentStr)
    infowindow.open(map, marker)
    arrayOfMarkers.push(marker)
    google.maps.event.addListener marker, "click", ->
      infowindow.open map, marker
      makeModal marker, Meteor.user()

把这个放在你的map声明之后

map.setCenter(myLatlng);

相关文章：