Team:St Andrews/Team2

From 2012.igem.org

(Difference between revisions)
Line 15: Line 15:
<script src="http://dl.dropbox.com/u/491730/iGEm/leaflet.js"></script>
<script src="http://dl.dropbox.com/u/491730/iGEm/leaflet.js"></script>
 +
 +
<script>
 +
var map = new L.Map('map');
 +
 +
var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
 +
cloudmadeAttribution = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
 +
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution});
 +
 +
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);
 +
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>
 +
</head>
</head>
Line 21: Line 70:
       <img src="http://placehold.it/720x540" alt="">
       <img src="http://placehold.it/720x540" alt="">
<br><br>
<br><br>
 +
</div>
</div>

Revision as of 12:20, 7 June 2012