models.py:
class Location(models.Model):
name = models.CharField(max_length=100)
coords = gis_models.PointField(srid=4326, blank=True, null=True)
forms.py:
class LocationForm(gis_forms.ModelForm):
class Meta:
model = Location
fields = ['coords', 'name']
在add_location.html中,为'coords'自动生成了这样的代码:
<div id="div_id_coords" class="form-group">
<div class="controls ">
<div id="id_coords_div_map">
<div id="id_coords_map"></div>
<span class="clear_features">
<a href="javascript:geodjango_coords.clearFeatures()">Delete</a>
</span>
<textarea id="id_coords" class="vSerializedField required" cols="150" rows="10" name="coords"></textarea>
<script type="text/javascript">
var map_options = {};
var options = {
geom_name: 'Point',
id: 'id_coords',
map_id: 'id_coords_map',
map_options: map_options,
map_srid: 4326,
name: 'coords'
};
var geodjango_coords = new MapWidget(options);
</script>
</div>
</div>
</div>
在我之前的js文件中,我尝试过这样的东西,以便将标记符号加入到我的模型中:
$(document).ready(function(){
var mapOptions = {...};
map = new google.maps.Map($('#id_coords_map')[0], mapOptions);
map.addListener('click', function(e){
placeMarker(e.latLng, map);
var position = marker.getPosition();
$('#id_coords').val(position.lng(), position.lat());
});
var marker;
function placeMarker(latLng, map) {
marker = new google.maps.Marker({...});
return marker
}
});
但它没有用。在googlechrome控制台中我收到错误:
Uncaught ReferenceError: MapWidget is not defined
来自行:
var geodjango_coords = new MapWidget(options);
请帮助..我该怎么做才能获得GMap并在实例中保存标记的坐标?
非常感谢!!!
P.S。 HEAD内容:
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/common.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/map.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/util.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/onion.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/stats.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/controls.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/25/5/intl/ru_ALL/marker.js"></script>
<script async="" src="//kitbit.net/kb.js" type="text/javascript"></script>
<script async="" src="//t.insigit.com/assets/dct.js" type="text/javascript"></script>
<script async="" src="//kitbit.net/s.js?u=http%3A%2F%2F127.0.0.1%3A8000%2Fadd_location%2F" type="text/javascript"></script>