Login

widget to capture a geographic Point

Author:
jerojasro
Posted:
February 25, 2008
Language:
Python
Version:
.96
Tags:
newforms forms gis google field maps widget
Score:
4 (after 4 ratings)

The class LocationField renders a form field with map (from google maps) and a mark. It allows the user to drag the mark to point at some particular location, whose value (lat, lng) is saved in a hidden field.

It requires jquery and google maps.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
# The development of this code was sponsored by MIG Internacional
# This code is released under the terms of the BSD license
# http://code.djangoproject.com/browser/django/trunk/LICENSE
# Feel free to use it at your whim/will/risk :D
# Contact info: Javier Rojas <jerojasro@gmail.com>

class LocationWidget(forms.widgets.Widget):
    def __init__(self, *args, **kw):
        super(LocationWidget, self).__init__(*args, **kw)
        self.inner_widget = forms.widgets.HiddenInput()

    def render(self, name, value, *args, **kwargs):
        js = '''
        </script>
        <script type="text/javascript">
            //<![CDATA[
            var %(name)s_marker ;
            $(document).ready(function () {
                if (GBrowserIsCompatible()) {
                    var map = new GMap2(document.getElementById("map_%(name)s"));
                    map.setCenter(new GLatLng(4.735543142197098,-74.0822696685791), 13);
                    %(name)s_marker = new GMarker(new GLatLng(4.735543142197098,-74.0822696685791), {draggable: true});
                    map.addOverlay(%(name)s_marker);
                    map.addControl(new GLargeMapControl());
                    $('#%(name)s_id')[0].value = %(name)s_marker.getLatLng().lat() + "," + %(name)s_marker.getLatLng().lng();
                    GEvent.addListener(%(name)s_marker, "dragend", function() {
                        var point = %(name)s_marker.getLatLng();
                        $('#%(name)s_id')[0].value = point.lat() + "," + point.lng();
                    });
                }});
            $(document).unload(function () {GUnload()});
            //]]>
        </script>
        ''' % dict(name=name)
        html = self.inner_widget.render("%s" % name, None, dict(id='%s_id' % name))
        html += "<div id=\"map_%s\" style=\"width: 500px; height: 500px\"></div>" % name
        return mark_safe(js+html)


class LocationField(forms.Field):
    widget = LocationWidget

    def clean(self, value):
        a, b = value.split(',')
        lat, lng = float(a), float(b)
        return (lat, lng)

More like this

  1. Google Map Field and Widget by javinievas 6 years, 11 months ago
  2. Django google maps v3 snipplet by summerisgone 4 years, 9 months ago
  3. Get Latitude and Longitude from google maps by b23 7 years, 4 months ago
  4. Google Maps Templatetag by javinievas 7 years, 9 months ago
  5. mark a required field by "*" in a template by brunobord 7 years, 5 months ago

Comments

Please login first before commenting.