Created
April 9, 2014 22:01
-
-
Save amyleew/10322760 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
} | |
#forecasts h2 { | |
font-size: 14px; | |
text-transform:uppercase; | |
margin-top: 45px; | |
} | |
#forecasts h3 { | |
font-size: 12px; | |
text-transform:uppercase; | |
} | |
#forecasts h3.time { | |
text-transform:lowercase; | |
} | |
#forecasts img, #forecasts h3 { | |
display: none; } | |
#forecasts .forecast-0 h3, #forecasts .forecast-0 img { | |
display: inline; } | |
#map { <!-- my map --> | |
width: 100%; | |
height: 1000px; | |
; | |
} | |
.map { <!-- emma's map --> | |
width: 100%; | |
height: 1000px; | |
; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> | |
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> | |
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> | |
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<title>Lat / Long Mapping</title> | |
<meta name="description" content=""> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<!-- Place favicon.ico and apple-touch-icon.png in the root directory --> | |
<link rel="stylesheet" href="css/normalize.css"> | |
<link rel="stylesheet" href="css/main.css"> | |
<!-- Leaflet js code for Mapbox --> | |
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" /> | |
<script src="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js"></script> | |
<!-- End Leaflet --> | |
<!-- script code for combining JS --> | |
<script src="http://jashkenas.github.io/underscore/underscore-min.js"></script> | |
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> | |
<!-- end script code for JS combos --> | |
<script src="js/vendor/modernizr-2.6.2.min.js"></script> | |
</head> | |
<body> | |
<!--[if lt IE 7]> | |
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> | |
<![endif]--> | |
<!-- Add your site or application content here --> | |
<div id="map"></div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var map = L.map('map').setView([37.77, -122.46], 13, {zoomControl: false}); | |
// disable zoom handlers | |
map.touchZoom.disable(); | |
map.doubleClickZoom.disable(); | |
map.scrollWheelZoom.disable(); | |
// disable tap handler, if present. | |
if (map.tap) map.tap.disable(); | |
// mapbox design | |
L.tileLayer('http://{s}.tiles.mapbox.com/v3/mslee.hke585p2/{z}/{x}/{y}.png', { | |
maxZoom: 18, | |
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>' | |
}).addTo(map); | |
// pull in location API data | |
var req = $.ajax({ | |
url: 'http://api.wunderground.com/api/419ec08f527a6f9b/geolookup/conditions/q/CA/San_Francisco.json', | |
dataType: 'jsonp', | |
type: "GET" | |
}).done(function(l1) { | |
var stations = l1.location.nearby_weather_stations.pws.station; | |
for (var i=0; i < stations.length; i++) { | |
// hard populate neighborhood names | |
var hood = ['',"SOMA", "Upper Mission", "Mission Bay", "The Castro"], | |
id = stations[i].id, | |
// var ids = ["KCASANFR58", "KCASANFR259", "KCASANFR53", "KPCASANF2"] | |
// var titles = ["SOMA", "Upper Mission", "Mission Bay", "The Castro"] | |
lat = stations[i].lat, | |
lon = stations[i].lon; | |
//console.log(lat+" and "+lon); | |
// add data to right neighborhood on map | |
switch (id) { | |
case "KCASANFR58": | |
//console.log("We are looking "+hood[1]+", which is ID "+id); | |
//console.log("lat "+lat+", lon "+lon); | |
L.marker([lat, lon]).addTo(map).bindPopup(hood[1]); | |
break; | |
case "KCASANFR259": | |
//console.log("We are looking "+hood[2]+", which is ID "+id); | |
L.marker([lat, lon]).addTo(map).bindPopup(hood[2]); | |
break; | |
case "KCASANFR53": | |
//console.log("We are looking "+hood[3]+", which is ID "+id); | |
L.marker([lat, lon]).addTo(map).bindPopup(hood[3]).openPopup(); | |
break; | |
case "KPCASANF2": | |
//console.log("We are looking "+hood[4]+", which is ID "+id); | |
L.marker([lat, lon]).addTo(map).bindPopup(hood[4]); | |
break; | |
//default: | |
//document.write("Sorry, not sure what's the problem."); | |
} | |
// document.write("Is there anything else you'd like?<br>"); | |
} | |
}); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment