Subversion Repositories eFlore/Applications.cel

Rev

Rev 491 | Rev 493 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 491 Rev 492
Line 31... Line 31...
31 
		<script src="<?=$url_json?>" type="text/javascript"></script>
 31 
		<script src="<?=$url_json?>" type="text/javascript"></script>
Line 32... Line 32...
32
32
33 
		<!-- Javascript : appli carto -->
 33 
		<!-- Javascript : appli carto -->
34 
		<script type="text/javascript">
 34 
		<script type="text/javascript">
- 
 
 35 
		//<![CDATA[
- 
 
 36 
			var pointImageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png';
- 
 
 37 
			var pointImage = new google.maps.MarkerImage(pointImageUrl, new google.maps.Size(24, 32));
35 
		//<![CDATA[
 38 
			var pointsOrigine = null;
36 
			var markerClusterer = null;
 39 
			var markerClusterer = null;
37 
			var map = null;
 40 
			var map = null;
38 
			var nt = '<?=$num_taxon?>';
 41 
			var nt = '<?=$num_taxon?>';
39 
			var infoBulle = new google.maps.InfoWindow();
 42 
			var infoBulle = new google.maps.InfoWindow();
40 
			google.maps.event.addListener(infoBulle, 'domready', function() {
 43 
			google.maps.event.addListener(infoBulle, 'domready', function() {
41 
				if ($("#observations table").get() != 'undefined') {
 44 
				if ($("#observations table").get() != 'undefined') {
42 
					$("#observations table").tablesorter();
 45 
					$("#observations table").tablesorter();
43 
				}
 46 
				}
44 
			});
 - 
 
45 
			var pointImageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png';
 47 
			});
46 
			var carteCentre = new google.maps.LatLng(46.4, 3.10);
 48 
			var carteCentre = new google.maps.LatLng(46.4, 3.10);
47 
			var carteOptions = {
 49 
			var carteOptions = {
48 
				zoom: 6,
 50 
				zoom: 6,
49 
				center: carteCentre,
 51 
				center: carteCentre,
50 
				mapTypeId: google.maps.MapTypeId.ROADMAP
 52 
				mapTypeId: google.maps.MapTypeId.ROADMAP
51 
			};
 53 
			};
Line 52... Line 54...
52 
			var ctaLayer = null;
 54 
			var ctaLayer = null;
53 
 
 - 
 
54 
			function refreshMap() {
 - 
 
55 
				if (markerClusterer) {
 - 
 
56 
					markerClusterer.clearMarkers();
 - 
 
57 
				}
 55 
 
58 
 
 - 
 
59 
				var points = [];
 56 
			function refreshMap() {
60 
				var pointImage = new google.maps.MarkerImage(pointImageUrl, new google.maps.Size(24, 32));
 57 
				var points = [];
61 
				for (var i = 0; i < obs.nombre; ++i) {
 58 
				for (var i = 0; i < obs.nombre; ++i) {
62 
					var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y);
 59 
					var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y);
63 
					var point = new google.maps.Marker({
 60 
					var point = new google.maps.Marker({
Line 74... Line 71...
74 
					});
 71 
					});
Line 75... Line 72...
75
72
76 
					points.push(point);
 73 
					points.push(point);
Line -... Line 74...
- 
 
 74 
				}
- 
 
 75 
 
- 
 
 76 
				if (pointsOrigine == null) {
- 
 
 77 
					pointsOrigine = points;
- 
 
 78 
				}
- 
 
 79
- 
 
 80 
				executerMakerCulterer(points);
- 
 
 81 
			}
- 
 
 82 
 
- 
 
 83 
			function executerMakerCulterer(points) {
- 
 
 84 
				if (markerClusterer) {
77 
				}
 85 
					markerClusterer.clearMarkers();
78 
 
 86 
				}
Line 79... Line 87...
79 
				markerClusterer = new MarkerClusterer(map, points);
 87 
				markerClusterer = new MarkerClusterer(map, points);
80 
			}
 88 
			}
Line 114... Line 122...
114 
				document.getElementById('panneau-lateral').style.display = 'none';
 122 
				document.getElementById('panneau-lateral').style.display = 'none';
115 
				document.getElementById('pl-ouverture').style.display = 'block';
 123 
				document.getElementById('pl-ouverture').style.display = 'block';
116 
				google.maps.event.trigger(map, 'resize');
 124 
				google.maps.event.trigger(map, 'resize');
117 
			};
 125 
			};
Line 118... Line 126...
118 
 
 126 
 
- 
 
 127 
			function filtrerParTaxon(ntAFiltrer) {
- 
 
 128 
				$('#taxon-'+nt).removeClass('taxon-actif');
- 
 
 129 
				if (nt == ntAFiltrer) {
- 
 
 130 
					nt = '*';
- 
 
 131 
					executerMakerCulterer(pointsOrigine);
119 
			function filtrerParTaxon(num_taxon) {
 132 
				} else {
120 
				var url = '<?=$url_cel_carto?>/carte-defaut-json/<?=$utilisateur?>/<?=$projet?>/<?=$dept?>/'+num_taxon+'?formatRetour=jsonp&callback=?';
 133 
					var url = '<?=$url_cel_carto?>/carte-defaut-json/<?=$utilisateur?>/<?=$projet?>/<?=$dept?>/'+ntAFiltrer+'?formatRetour=jsonp&callback=?';
121 
				$.getJSON(url, function (observations) {
 134 
					$.getJSON(url, function (observations) {
122 
					obs = observations;
 135 
						obs = observations;
- 
 
 136 
						nt = ntAFiltrer;
123 
					nt = num_taxon;
 137 
						$('#taxon-'+nt).addClass('taxon-actif');
124 
					refreshMap();
 138 
						refreshMap();
- 
 
 139 
					});
125 
				});
 140 
				}
Line 126... Line 141...
126 
			};
 141 
			};
127
142
Line 161... Line 176...
161 
		<!-- CSS -->
 176 
		<!-- CSS -->
162 
		<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />
 177 
		<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />
163 
	</head>
 178 
	</head>
Line 164... Line 179...
164 
 
 179 
 
- 
 
 180 
	<body onload="initialize()">
165 
	<body onload="initialize()">
 181 
		<h1 id="carte-titre">Obsvertions issues des membres de Tela Botanica</h1>
- 
 
 182 
		<div id="panneau-lateral">
- 
 
 183 
			<div id="pl-ouverture" title="Ouvrir le panneau latéral"><span>Panneau >></span></div>
166 
		<div id="panneau-lateral">
 184 
			<div id="pl-fermeture" title="Fermer le panneau latéral"><span><< Fermer [x]</span></div>
167 
			<div id="pl-entete">
 185 
			<div id="pl-entete">
168 
				<div id="pl-ouverture">Panneau >></div>
 186 
				<h2>Filtre par plante</h2>
169 
				<div id="pl-fermeture"><< Fermer [x]</div>
 187 
				<p>Cliquer sur un nom de plante pour filtrer les observations sur la carte.</p>
- 
 
 188 
			</div>
170 
			</div>
 189 
			<div id="pl-corps" onMouseOver="map.setOptions({'scrollwheel':false});" onMouseOut="map.setOptions({'scrollwheel':true});">
171 
			<div id="pl-corps">
 - 
 
172 
				<ol>
 190 
				<ol id="taxons">
173 
				<? foreach ($taxons as $taxon) : ?>
 191 
				<? foreach ($taxons as $taxon) : ?>
174 
					<li>
 192 
					<li id="taxon-<?=$taxon['nt']?>">
175 
						<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);">
 193 
						<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);" title="<?=$taxon['famille']?>">
176 
							<?=$taxon['nom']?>
- 
 
177 
							<span class="famille"><?=$taxon['famille']?></span>
 194 
							<?=$taxon['nom']?>
178 
						</a>
 195 
						</a>
179 
					</li>
 196 
					</li>
180 
				<? endforeach; ?>
 197 
				<? endforeach; ?>
181 
				</ol>
 198 
				</ol>