Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Perfect loading of crimes on map

  • Loading branch information...
commit acf261add2f3503c54de3ad3cce760ffa7a506ab 1 parent 244202d
@zain authored
Showing with 38 additions and 9 deletions.
  1. +3 −2 maps/crime/views.py
  2. +35 −7 maps/templates/crime.html
View
5 maps/crime/views.py
@@ -11,7 +11,7 @@ def crime_list(request):
geojson_dict = {
"type": "FeatureCollection",
- "features": [crime_to_geojson(crime) for crime in crimes[::4]]
+ "features": [crime_to_geojson(crime) for crime in crimes]
}
return HttpResponse(json.dumps(geojson_dict), content_type='application/json')
@@ -25,5 +25,6 @@ def crime_to_geojson(crime):
},
"properties": {
"description": crime.description
- }
+ },
+ "id": crime.id,
}
View
42 maps/templates/crime.html
@@ -17,17 +17,45 @@
<script src="http://leaflet.cloudmade.com/dist/leaflet.js" type="text/javascript" type="text/javascript"></script>
<script type="text/javascript">
- var styles = {
- cloudmade: "http://{s}.tile.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/997/256/{z}/{x}/{y}.png"
- };
$(document).ready(function () {
- // initialize the map on the "map" div
- var map = new L.Map('mapdiv');
+ var layers = {
+ cloudmade: new L.TileLayer("http://{s}.tile.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/997/256/{z}/{x}/{y}.png"),
+ acetate: new L.TileLayer("http://a{s}.acetate.geoiq.com/tiles/acetate/{z}/{x}/{y}.png", {subdomains: ['a1', 'a2', 'a3']})
+ };
+
+ map = new L.Map('mapdiv');
+ crime_ids = new Array();
- var cloudmade = new L.TileLayer(styles.cloudmade);
var sanfran = new L.LatLng(37.77540, -122.41941);
- map.addLayer(cloudmade).setView(sanfran, 16);
+ map.addLayer(layers.cloudmade).setView(sanfran, 16);
+
+ var crimes = new L.GeoJSON();
+ map.addLayer(crimes);
+
+ function crime_refresh(event) {
+ var url = "/crime.json?bbox=" + map.getBounds().toBBoxString();
+
+ $.getJSON(url, function(data) {
+
+ $.each(data.features, function(i, feature) {
+
+ if ($.inArray(feature.id, crime_ids) == -1) {
+ // not a duplicate, so we can add it
+ crimes.addGeoJSON(feature);
+ crime_ids.push(feature.id);
+ }
+
+ });
+
+ console.log(crime_ids.length + " dots on the screen.");
+ });
+ }
+
+ map.on('moveend', crime_refresh);
+ map.on('zoomend', crime_refresh);
+
+ crime_refresh(null); // not fired automatically
});
</script>
Please sign in to comment.
Something went wrong with that request. Please try again.