如何在注册表单中添加标记和中心地图 django-map-widget

Posted 2023-03-28

【中文标题】如何在注册表单中添加标记和中心地图 django-map-widget

【英文标题】：how to add markers and center map in signup form django-map-widget

【发布时间】：2018-08-05 19:15:32

【问题描述】：

使用django-map-widget 在表单中呈现地图小部件。它工作正常，但是...

我想通过两种方式触发地图（通过javascript动态）：

触发以在 x,y 上重新居中地图 触发在 x,y 上添加标记以映射

我尝试了很多方法，但我无法解决它。

你可以see and play with my form here

这是我的尝试之一：

var locationRio = lat: -22.915, lng: -43.197;
var marker = new google.maps.Marker(
  position: locationRio,
  map: $("#location-map-elem").map,
  title: 'Hello World!'
);

我 90% 确定我的错误是这部分：$("#location-map-elem").map

提前致谢:)

【参考方案1】：

您需要为此访问谷歌地图对象。访问地图对象功能尚未发布。因此，您需要直接从 master 分支安装 django-map-widgets。

pip install git+git://github.com/erdem/django-map-widgets.git@master

查看此pull-request 了解更多信息。

安装最新版本后，您将能够使用 Google Map JS API。

// re-center your marker 
var map = $('your-map-element').data(map);
var bounds = new google.maps.LatLngBounds();
bounds.extend(your_marker.getPosition());
map.fitBounds(bounds);

【讨论】：

我试过这个： var map = $('#location-map-elem').data(map); var marker = new google.maps.Marker( position: lat: 57.0230, lng: 10.087, map: map, draggable: true ); var bounds = new google.maps.LatLngBounds(); bounds.extend(marker.getPosition()); map.fitBounds(边界);我得到这些错误： InvalidValueError: setMap: not an instance of Map;而不是 StreetViewPanorama Uncaught TypeError 的实例：map.fitBounds 不是函数

那个 sn-p 代码可能是错误的，你检查谷歌地图 JS 文档是否重新居中？据我所知，在获得map JS 实例后，您应该能够重新居中地图。

@MichaelLind 我测试了代码 sn-p 并且它对我有用，请查看 Google Map 文档。

github.com/erdem/django-map-widgets/blob/… github.com/erdem/django-map-widgets/blob/… 这些方法可以作为您的示例。检查这些并使用您的map 对象而不是this.map 实现。谢谢

谢谢。但问题是地图未定义。 var map = $('your-map-element').data(map);对我来说这没有任何意义，因为句子中的地图是未定义的。也许我是盲目的或愚蠢的，抱歉，但我仍然看不到如何做到这一点。我放弃了。继续使用另一个小部件