Permalink
Browse files

Shows distances to all parks

  • Loading branch information...
1 parent 7fc6bfb commit c2699ce1d5515a5c4b41eba0740be04a093bf93f @mollietaylor committed Mar 5, 2014
Showing with 29 additions and 9 deletions.
  1. +29 −9 index.html
View
@@ -17,12 +17,16 @@
#map {
height: 500px;
}
+
+ #distances {
+ text-align: left;
+ }
</style>
</head>
<body>
<h1>Atlanta Hikes</h1>
-<div id="map"></div>
+<div id="map"></div><div id="distances"></div>
<div id="links">
Map icons provided by <a href="http://mapicons.nicolasmollet.com/">Nicolas Mollet</a>.<br>
</div>
@@ -47,6 +51,29 @@
return R * c; // distance in km
}
+ // make array at beginning of function
+ var distances = [];
+ // returns distances to all parks in km:
+ function getAllDistances(obj, userLat, userLon) {
+ // loop
+ for (var i in obj.features) {
+ parkName = obj.features[i].properties.name;
+ parkLat = obj.features[i].geometry.coordinates[1];
+ parkLon = obj.features[i].geometry.coordinates[0];
+ distance = getDistance(parkLat, parkLon, userLat, userLon);
+ distances.push([parkName, distance]);
+ }
+ // return array
+ return distances;
+ }
+
+ function formatDistances(arr) {
+ for (var i in arr) {
+ dist = "<tr><td width=200>" + arr[i][1] + "</td><td width=50>km to</td><td>" + arr[i][0] + "</td></tr><br>";
+ $('#distances').append(dist);
+ }
+ }
+
var hikingIcon = L.icon({
iconUrl: 'hiking.png',
iconSize: [32, 37],
@@ -69,7 +96,7 @@
var marker = L.marker([e.latitude, e.longitude], {icon: hereIcon})
.bindPopup('You are here');
map.addLayer(marker);
- // console.log(getDistance(33.75, -84.38, e.latitude, e.longitude) + ' km'); // substitute first pair with location of a point
+ formatDistances(getAllDistances(parksList, e.latitude, e.longitude));
})
.on('locationerror', function(e){
console.log(e);
@@ -86,13 +113,6 @@
// console.log(getDistance(feature.geometry.coordinates[1],feature.geometry.coordinates[0], 33.75, -84.38) + ' km'); // substitute second pair with current location
};
- // var photos = L.geoJson(photoList, {
- // onEachFeature: onPhoto,
- // pointToLayer: function(feature, latlng) {
- // return L.marker(latlng, {icon: photoIcon});
- // }
- // });
-
var hikeLayer = L.geoJson(parksList, {
onEachFeature: onEachHike,
pointToLayer: function(feature, latlng) {

0 comments on commit c2699ce

Please sign in to comment.