Permalink
Browse files

tweak map to fit bounds of all geoids, some other JS changes

  • Loading branch information...
JoeGermuska committed Sep 3, 2011
1 parent 6bc3b04 commit a8b1ea2266625649f639acd4cf9fa4521d7f969a
Showing with 55 additions and 18 deletions.
  1. +2 −1 censusweb/api/templates/map.html
  2. +7 −2 censusweb/media/js/ire_census.js
  3. +39 −13 censusweb/media/js/map.js
  4. +7 −2 tools/js/ire_census.js
@@ -5,7 +5,8 @@
{% block content %}
<link rel="stylesheet" href="{{ MEDIA_URL }}leaflet/leaflet.css" type="text/css" charset="utf-8">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
-<script type="text/javascript" src="https://raw.github.com/datadesk/jquery-geocodify/master/jquery.geocodify.js"></script>
+{# <script type="text/javascript" src="https://raw.github.com/datadesk/jquery-geocodify/master/jquery.geocodify.js"></script> #}
+<script src="https://raw.github.com/JoeGermuska/jquery-geocodify/master/jquery.geocodify.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}leaflet/leaflet.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/map.js"></script>
<div id="legend">
@@ -85,14 +85,19 @@ var ire_census = {};
// See http://census.ire.org/docs/boundary.html for more on the API, or to see what data
// gets returned, look at http://census.ire.org/geo/1.0/boundary-set/places/1714000
// TK: examples demonstrating how to put the shape which is returned on a map.
- this.get_geojson = function (geoid,success_handler) {
+ this.do_with_geojson = function (geoid,success_handler) {
if (geoid[0] != '/') {
+ var matched = false;
for (var i=0; i < GEOGRAPHY_TYPES.length; i++) {
if (geoid.match(GEOGRAPHY_TYPES[i][0])) {
geoid = "/" + GEOGRAPHY_TYPES[i][1] + "/" + geoid;
- break
+ matched = true;
+ break;
}
}
+ if (!matched) {
+ throw "Geoid does not match any known types. Check the length."
+ }
}
if (geoid.substr(0,'/boundary-set'.length) != '/boundary-set') {
geoid = '/boundary-set' + geoid;
View
@@ -1,6 +1,9 @@
$(function(){
var geocoder = new google.maps.Geocoder();
-window.boundary_layers = {}
+window.map = null;
+window.boundary_layers = {};
+window.bounds = null;
+
function coords_to_paths(coords) {
// Construct new polygons
var paths = [];
@@ -43,21 +46,22 @@ window.parseGeoids = function() {
return geoids;
}
-function move_map_based_on_geocode(map,result) {
- var viewport = result.geometry.viewport;
+function leaflet_bounds_from_google_viewport(viewport) {
var top_left = new L.LatLng(viewport.getNorthEast().lat(), viewport.getSouthWest().lng());
var bottom_right = new L.LatLng(viewport.getSouthWest().lat(),viewport.getNorthEast().lng())
- bounds = new L.LatLngBounds(top_left, bottom_right);
- map.fitBounds(bounds);
+ return new L.LatLngBounds(top_left, bottom_right);
+}
+
+function leaflet_point_from_google_point(location) {
+ return new L.LatLng(location.lat(),location.lng());
}
+
function handle_geocode(result) {
window.geostash = result;
- lat = result.geometry.location.lat();
- lng = result.geometry.location.lng();
- window.map.panTo(new L.LatLng(lat,lng));
- move_map_based_on_geocode(window.map,result);
+ window.map.panTo(leaflet_point_from_google_point(result.geometry.location));
+ window.map.fitBounds(leaflet_bounds_from_google_viewport(result.geometry.viewport));
}
-window.map = null;
+
function init_map(lat, lng) {
if (window.map == null) {
if (lat == null || lng == null) {
@@ -85,12 +89,28 @@ function init_map(lat, lng) {
}
$("#geocoder").geocodify({
- onSelect: handle_geocode
+ onSelect: handle_geocode,
+ regionBias: 'us',
+ filterResults: function(results) {
+ var filteredResults =[];
+ $.each(results, function(i,val) {
+ for (var ac in val.address_components) {
+ for (var t in val.address_components[ac].types) {
+ if (val.address_components[ac].types[t] === 'country') {
+ if (val.address_components[ac].short_name === 'US' || val.address_components[ac].short_name === 'PR') {
+ filteredResults.push(val);
+ }
+ }
+ }
+ }
+ });
+ return filteredResults;
+ }
});
}
window.add_boundary = function(geoid) {
- ire_census.get_geojson(geoid,function(geojson) {
+ ire_census.do_with_geojson(geoid,function(geojson) {
window.stash = geojson;
var x = coords_to_paths(geojson['simple_shape']['coordinates']);
displayed_polygon = new L.Polygon(x.paths, {
@@ -104,7 +124,13 @@ window.add_boundary = function(geoid) {
map.addLayer(displayed_polygon);
window.boundary_layers[geojson.external_id] = displayed_polygon;
- map.fitBounds(x.bounds);
+ if (window.bounds == null) {
+ window.bounds = x.bounds;
+ } else {
+ window.bounds.extend(x.bounds.getNorthEast());
+ window.bounds.extend(x.bounds.getSouthWest());
+ }
+ map.fitBounds(window.bounds);
});
}
$(document).ready(init_map);
View
@@ -85,14 +85,19 @@ var ire_census = {};
// See http://census.ire.org/docs/boundary.html for more on the API, or to see what data
// gets returned, look at http://census.ire.org/geo/1.0/boundary-set/places/1714000
// TK: examples demonstrating how to put the shape which is returned on a map.
- this.get_geojson = function (geoid,success_handler) {
+ this.do_with_geojson = function (geoid,success_handler) {
if (geoid[0] != '/') {
+ var matched = false;
for (var i=0; i < GEOGRAPHY_TYPES.length; i++) {
if (geoid.match(GEOGRAPHY_TYPES[i][0])) {
geoid = "/" + GEOGRAPHY_TYPES[i][1] + "/" + geoid;
- break
+ matched = true;
+ break;
}
}
+ if (!matched) {
+ throw "Geoid does not match any known types. Check the length."
+ }
}
if (geoid.substr(0,'/boundary-set'.length) != '/boundary-set') {
geoid = '/boundary-set' + geoid;

0 comments on commit a8b1ea2

Please sign in to comment.