Commit 43e9fbe5cab186175d302b772ee3964ca881b310

arvind
Tue Jan 29 20:59:40 IST 2013

Tree SHA1: d50ac01
Parent SHA1: f5eceaa (Minor changes)
raw diff | raw patch

Added UI improvments
			- Markers have been added into a layer group and they can be hidden and shown.
			- Introduces a bug of labels not showing again when the layer is shown after being hidden.

Diff rendering mode:
inline
side by side


15	15	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
16	16	</head>
17	17	<body>
18		<div id="map" style="width: 1024px; height: 800px; margin-top:30px;"></div>
	18	<b>Reload to reset</b>
	19	<div id="map" style="width: 800x; height: 600px; margin-top:30px;"></div>
19	20	<script type="text/template" id="image-item-template">
20	21	<div id="image-wrapper">
21		<em><%= cnt %></em>
	22	<div><em><%= cnt %></em></div>
22	23	<img src="<%= src %>" style="height:200px;width:200px;">
23	24	</div>
24	25	</script>


1	1	var count = 0;
2	2	var map;
	3	var markers = new L.LayerGroup();
	4	var photos = new L.LayerGroup();
3	5	function init(){
4		map = L.map('map').setView([14.31336, 76.64973], 13);
	6	var tileLayer = L.tileLayer('http://{s}.tile.cloudmade.com/157f9082094e402f89d242e9b9144483/997/256/{z}/{x}/{y}.png', {
	7	maxZoom: 18,
	8	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://cloudmade.com">CloudMade</a>'
	9	});
	10	var overlays = {
	11	"Places" : markers,
	12	"Photos": photos
	13	};
	14	var baseLayer = {
	15	"Base Map": tileLayer
	16	};
	17	map = L.map('map', {layers:[tileLayer, markers, photos]}).setView([14.31336, 76.64973], 13);
5	18	map.minZoom = 13;
6	19	map.maxZoom = 13;
7	20	map.zoomControl = false;
8		L.tileLayer('http://{s}.tile.cloudmade.com/157f9082094e402f89d242e9b9144483/997/256/{z}/{x}/{y}.png', {
9		maxZoom: 18,
10		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://cloudmade.com">CloudMade</a>'
11		}).addTo(map);
	21	L.control.scale({position: 'bottomleft'}).addTo(map);
	22	L.control.layers(baseLayer, overlays).addTo(map);
12	23	loadWayPoints();
13	24	loadTrackPoints();
	25
14	26	}
15	27	function loadWayPoints(){
16	28	var wayPointList = ['drdoway.json', 'iiscway.json', 'iiscway2.json'];
…	…
31	31	L.geoJson(keys, {
32	32	pointToLayer: function(feature, latlng) {
33	33	if(feature.properties.name != "Picture") {
34		var m = L.marker(latlng).bindLabel(feature.properties.name, {noHide: true}).addTo(map).showLabel();
	34	var m = L.marker(latlng).bindLabel(feature.properties.name, {noHide: true}).addTo(markers);
	35	if(i == wayPointList.length){
	36	this.appendLabels(markers);
	37	}
35	38	return m;
36	39	}
37	40	else {
38	41	count++;
39		var m = L.marker(latlng).bindLabel(count.toString(), {noHide: true}).addTo(map).showLabel();
	42	var m = L.marker(latlng).bindLabel(count.toString(), {noHide: true}).addTo(photos);
40	43	var template = _.template($('#image-item-template').html());
41	44	x = $('body').append(template({cnt: count, src: feature.properties.link1_href}));
42		console.log(x);
	45	m.on('click',function(e){
	46	e.target.bindPopup("<img src='"+feature.properties.link1_href+"' style='height:200px;width:200px;'>").openPopup();
	47	});
	48	if(i == wayPointList.length-1){
	49	this.appendLabels(photos);
	50	}
43	51	return m;
44	52	}
45	53	}
…	…
55	55	},'json');
56	56	}
57	57	}
	58	function appendLabels(x){
	59	console.log("test");
	60	x.eachLayer(function(layer){
	61	layer.showLabel();
	62	});
	63	}
	64
	65
58	66	function loadTrackPoints() {
59	67	var trackPointList = ['drdo.json', 'iisctrack.json', 'kaaval.json'];
60	68	for(var i=0; i<trackPointList.length;i++) {

Commit 43e9fbe5cab186175d302b772ee3964ca881b310

Gitorious