Team:St Andrews/Team2

From 2012.igem.org

(Difference between revisions)
Line 79: Line 79:
<script>
<script>
-
var map = new L.Map('map');
+
var layer = new L.StamenTileLayer("toner");
-
 
+
var map = new L.Map("element_id", {
-
var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
+
    center: new L.LatLng(37.7, -122.4),
-
cloudmadeAttribution = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
+
    zoom: 12
-
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution});
+
});
-
 
+
map.addLayer(layer);
-
map.setView(new L.LatLng(51.505, -0.09), 13).addLayer(cloudmade);
+
-
 
+
-
 
+
-
var markerLocation = new L.LatLng(51.5, -0.09),
+
-
marker = new L.Marker(markerLocation);
+
-
 
+
-
map.addLayer(marker);
+
-
                map.addLayer(new L.StamenTileLayer("toner"));
+
-
 
+
-
marker.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();
+
-
 
+
-
 
+
-
var circleLocation = new L.LatLng(51.508, -0.11),
+
-
circleOptions = {color: '#f03', opacity: 0.7},
+
-
circle = new L.Circle(circleLocation, 500, circleOptions);
+
-
 
+
-
circle.bindPopup("I am a circle.");
+
-
map.addLayer(circle);
+
-
 
+
-
 
+
-
 
+
-
var p1 = new L.LatLng(51.509, -0.08),
+
-
p2 = new L.LatLng(51.503, -0.06),
+
-
p3 = new L.LatLng(51.51, -0.047),
+
-
polygonPoints = [p1, p2, p3],
+
-
polygon = new L.Polygon(polygonPoints);
+
-
 
+
-
polygon.bindPopup("I am a polygon.");
+
-
map.addLayer(polygon);
+
-
 
+
-
 
+
-
map.on('click', onMapClick);
+
-
 
+
-
var popup = new L.Popup();
+
-
 
+
-
function onMapClick(e) {
+
-
var latlngStr = '(' + e.latlng.lat.toFixed(3) + ', ' + e.latlng.lng.toFixed(3) + ')';
+
-
 
+
-
popup.setLatLng(e.latlng);
+
-
popup.setContent("You clicked the map at " + latlngStr);
+
-
map.openPopup(popup);
+
-
}
+
</script>
</script>
</body>
</body>
</html>
</html>

Revision as of 12:46, 7 June 2012

St Andrews iGEM '12



Retrieved from "http://2012.igem.org/Team:St_Andrews/Team2"