2011-08-23 129 views
2

我想在Google Map的中心显示一些十字线。将Google地图标记拖到地图的中心位置吗?

目前我有这样的代码:

 var mapCentre = map.getCenter(); 
     reticleMarker = new google.maps.Marker({ 
      position: mapCentre, 
      map: map, 
      icon: reticleImage, 
      shape: reticleShape, 
      optimized: false, 
      zIndex: 5 
     }); 
     google.maps.event.addListener(map, 'bounds_changed', 
      function(){reticleMarker.setPosition(map.getCenter());}); 

在桌面上伟大的作品,但无法在手机上。在移动时,当用户的手指拖动地图时,十字线不会留在地图的中心。使用drag事件侦听器不能更好地工作。

任何人都可以建议如何在移动浏览器中处理这个问题吗? (仅供参考,我在Android浏览器中看到此问题。)

我在想也许我应该在CSS中显示十字线而不是地图标记?

回答

0

我想也许我应该在CSS显示十字线,而不是作为一个地图标记?

我已经使用了类似的方法来取得很好的效果。你可以在地图容器中放置任何你想要的HTML,谷歌地图不会介意。

+0

不幸的是,如果显示为图像,十字线会在地图上创建一个死角 - 它们看起来不错,但如果用户触摸到十字线覆盖的任何地方,则无法拖动地图。所以我需要一个替代解决方案... – Richard

+0

在我的情况下,我用HTML div来'绘制'边框到窗格上。画一个十字线不应该太难。如果你这样做,当你开始拖动时碰到十字线的机会很小。一个完美的解决方案将要求您让浏览器忽略十字线或将其上的所有事件转发到底层地图。这非常复杂。 – Halcyon

+0

这是一个很好的建议,但有人建议在CSS图像上使用'pointer-events:none;',并解决了这个问题:http://stackoverflow.com/questions/7178669/display-png-over-google-maps -without-creating-dead-spot - 谢谢你的帮助。 – Richard