Untitled

{% load leaflet_tags %}
<html>
<head>
    {% leaflet_js %}
    {% leaflet_css %}
    <!--  <script src="OpenLayers.js" type="text/javascript"></script> -->

<style>
header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}
nav {
    line-height:30px;
    background-color:#eeeeee;
    height:503px;
    width:240px;
    float:left;
    padding:5px;
}
section {
    width:579px;
    float:left;
    padding:10px;
    height:494px;
}
footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;
}
</style>
</head>
    <body>
    {% leaflet_map "main" callback="main_map_init" %}
    <header>
    <h2>Plant Functional Types</h2>
    </header>
<nav>
<a href="{% url 'geojson_provinces'%}"><button type="button" onclick=>Actual plant functional type</button>
<button type="button" >Potential plant functional type</button>
<button type="button" > Plant functional types likely to change</button>
<a href="{% url 'add_multiple_accounts' %}"><button type="button" > Upload species data</button></a>
</nav>

<div id="map" class="map" style="width:1080px; height:512px;float:right;" ></div>
<script type="text/javascript">
     function main_map_init (map, options) {

    var dataurl = '{% url "data" %}';
    // Download GeoJSON via Ajax
    $.getJSON(dataurl, function (data) {
        // Add GeoJSON layer
        L.geoJson(data).addTo(map);
    });

}

</script>
<footer>
</footer>
       </body>
</html>

def geojson_provinces(request):
    conn = psycopg2.connect(dbname="geodjango",host='localhost',user='postgres', password='postgres', port=5433)
    dict_cur = conn.cursor(cursor_factory=psycopg2.extras.DictCursor)
    cur=conn.cursor()
    res = dict_cur.execute("SELECT ST_AsGeoJson(geom) AS json FROM pft_pft LIMIT 10;")

    points=dict_cur.fetchall()
    print (points)
    json_res  = []
    for row in points:
        json_obj  = row['json']
        print (json_obj)
        json_res.append(json_obj)
        print(json_res)
    #json = simplejson.dumps(data)

    dict_cur.close()
    data = {'geojson':  mark_safe(json_res)}
    return render(request, 'map.html', data)

url(r'^data/$', GeoJSONLayerView.as_view(model=PFT), name='data'),

class PFT(models.Model):
    species=models.CharField(max_length=50)
    # GeoDjango-specific: a geometry field (MultiPolygonField)
    geom = models.PointField(srid=4326)
    objects=models.GeoManager()
    # Returns the string representation of the model.
    def __str__(self):              # __unicode__ on Python 2
        return '%s %s %s' % (self.species, self.geom.x, self.geom.y)