Subversion Repositories eFlore/Applications.moissonnage

Compare Revisions

Ignore whitespace Rev 47 → Rev 48

/trunk/widget/modules/carto/squelettes/scripts/carto.js
1,964 → 1,960
var map = null,
optionsCoucheOSM = {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors,'
+ ' <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
maxZoom: 18
},
optionsCoucheGoogle = {
attribution: 'Map data &copy;'+new Date().getFullYear()+' <a href="http://maps.google.com">Google</a>',
maxZoom: 18
},
coucheOSM = new L.TileLayer("http://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
optionsCoucheOSM),
coucheRelief = new L.TileLayer("http://c.tile3.opencyclemap.org/landscape/{z}/{x}/{y}.png",
optionsCoucheOSM),
coucheSatellite = new L.TileLayer("http://mt1.google.com/vt/lyrs=y@218131653&hl=fr&src=app&x={x}&y={y}&z={z}",
optionsCoucheGoogle),
optionsCarte = {
center : new L.LatLng(46, 2),
zoom : 6,
minZoom : 3,
maxBounds : [[-85.051129, -180], [85.051129, 180]],
layers : [coucheOSM]
},
zoom = 6,
legende = null,
coucheDepartement = null,
infoBulle = null;
 
var coucheSites = null,
sources = new Object(),
typeSite = 'maille',
overlays = [];
 
var requeteChargementPoints = null,
timer = null,
ancienneRequete = null,
deplacement = true,
url = '';
 
 
 
 
$(document).ready(function() {
initialiserWidget();
});
 
$(window).resize(function() {
dimensionnerCarte();
});
 
function initialiserWidget() {
initialiserCarte();
chargerLimitesCommunales();
initialiserPanneauControle();
initialiserSources();
initialiserListeners();
chargerLocalisations();
}
 
function initialiserCarte() {
dimensionnerCarte();
map = L.map('map', optionsCarte);
coucheSatellite.addTo(map);
coucheRelief.addTo(map);
coucheOSM.addTo(map);
var echelle = new L.Control.Scale({
maxWidth : 50,
metric : true,
imperial : false,
updateWhenIdle : true
});
map.addControl(echelle);
zoom = map.getZoom();
}
 
function dimensionnerCarte() {
$('#map').height($(window).height());
$('#map').width($(window).width());
}
 
function initialiserListeners() {
map.on('moveend', surChangementVueCarte);
map.on('zoomend', surChangementVueCarte);
map.on('popupclose', function(e) {
masquerInfoBulle();
programmerRafraichissementCarte();
});
}
 
function initialiserPanneauControle() {
var baseMaps = {
"Satellite" : coucheSatellite,
"Relief" : coucheRelief,
"Plan" : coucheOSM
};
 
var overlayMaps = {};
for (var index = 0; index < listeSources.length; index ++) {
sources[listeSources[index]] = estValeurDansTableau(source, listeSources[index]);
overlayMaps[listeSources[index]] = new L.LayerGroup();
}
L.control.layers(baseMaps, overlayMaps).addTo(map);
coucheOSM.bringToFront();
map.removeLayer(coucheRelief);
map.removeLayer(coucheOSM);
// garder par defaut la couche plan google comme selectionnee dans le panel
var selecteursFonds = $('.leaflet-control-layers-base .leaflet-control-layers-selector');
selecteursFonds[0].checked = true;
selecteursFonds[1].checked = false;
selecteursFonds[2].checked = false;
}
 
function chargerLimitesCommunales() {
coucheDepartement = new L.KML(null, {async : true}).addTo(map);
if (urlsLimitesCommunales != null) {
coucheDepartement.addKMLFiles(urlsLimitesCommunales);
}
}
 
function initialiserSources() {
overlays = $('.leaflet-control-layers-overlays .leaflet-control-layers-selector');
$.each(overlays, function (index, input) {
input.value = listeSources[index];
input.id = 'overlay' + (index+1);
var lien = '<a href="' + liensVersSources[index] + '" target="_blank">' + nomListeSources[index] + '</a>';
$('#overlay' + (index+1) + ' ~ span').html(lien);
input.checked = sources[listeSources[index]];
input.onclick = function(event) {
changerSource(event.target.value);
}
});
}
 
function changerSource(projetClique) {
var indexProjetClique;
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].value == projetClique) {
indexProjetClique = index;
}
}
masquerInfoBulle();
sources[projetClique] = overlays[indexProjetClique].checked;
if (sources[projetClique] == true) {
programmerRafraichissementCarte(projetClique);
} else {
if (requeteEnCours()) {
stopperRequeteAjax();
}
supprimerFeaturesSource(projetClique);
}
}
 
function supprimerFeaturesSource(source) {
if (coucheSites != null) {
coucheSites.eachLayer(function(layer) {
if (layer.typeSite == 'maille') {
retirerStationsEtObservations(layer, source);
} else {
layer.supprimerSource(source, coucheSites);
if (layer._map == 'null') {
couheSites.removeLayer(layer);
}
}
});
if (typeSite == 'maille') {
var nombreMailles = calculerNombreMaillesVisibles();
if (nombreMailles == 0) {
coucheSites.clearLayers();
masquerLegende();
typeSite = 'point';
}
}
}
}
 
function retirerStationsEtObservations(maille, sourceRetrait) {
var sources = maille.properties.source;
var nombreStations = 0;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (source == sourceRetrait) {
delete maille.properties.stations[source];
delete maille.properties.observations[source];
} else if (typeof(maille.properties.stations[source]) != 'undefined') {
nombreStations += parseInt(maille.properties.stations[source]);
}
}
if (nombreStations == 0) {
coucheSites.removeLayer(maille);
} else {
colorerMaille(maille)
genererInfobulle(maille);
}
}
 
function calculerNombreMaillesVisibles() {
var nombreMailles = 0;
coucheSites.eachLayer(function(layer) {
if($(layer._path).attr('fill-opacity') != '0') {
nombreMailles ++;
}
});
return nombreMailles;
}
 
function estValeurDansTableau(tableau, valeur) {
var index;
for (index = 0; index < tableau.length && tableau[index] != valeur; index ++);
return (tableau.length > 0 && index != tableau.length);
}
 
//************************************
// requetes stations
 
function surChangementVueCarte() {
programmerRafraichissementCarte();
}
 
function programmerRafraichissementCarte(source) {
$('#tooltip').css('display', 'none');
source = (source == null || source == 'null') ? null : source;
if (timer != null) {
window.clearTimeout(timer);
}
if (requeteChargementPoints != null) {
stopperRequeteAjax();
}
var nombreSourcesVisibles = 0;
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].checked) {
nombreSourcesVisibles ++;
}
}
if (source == null) {
timer = window.setTimeout("chargerLocalisations()", 100);
} else {
timer = window.setTimeout("chargerSource('"+source+"')", 100);
}
}
 
function stopperRequeteAjax() {
requeteChargementPoints.abort();
requeteChargementPoints = null;
}
 
function chargerLocalisations() {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
afficherMessageChargement('stations');
if (!(ancienneRequete != null && ancienneRequete[1] == map.getZoom()
&& map.getBounds().intersects(ancienneRequete[0]))) {
supprimerFeatures();
deplacement = false;
}
var bboxRequete = calculerBboxRequete();
var parametres = {
"bbox" : bboxRequete,
"zoom" : map.getZoom(),
"source" : recupererSourcesActivees(),
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"dept" : dept,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
if (deplacement == true) {
parametres.format = typeSite;
}
ancienneRequete = [map.getBounds(), map.getZoom()];
url = urlBase + "stations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterDonneesStations;
executerAJAX();
}
 
function supprimerFeatures() {
if (coucheSites != null) {
coucheSites.clearLayers();
coucheSites = null;
}
}
 
function recupererSourcesActivees(sourceAIgnorer) {
sourceAIgnorer = typeof(sourceAIgnorer) == 'undefined' ? '' : sourceAIgnorer;
var sourcesActivees = [];
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].checked == true && overlays[index].value != sourceAIgnorer) {
sourcesActivees.push(overlays[index].value);
}
}
return sourcesActivees.join(',');
}
 
function chargerSource(sourceAjout) {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
afficherMessageChargement('stations');
var bboxRequete = determinerCoordonneesBordure();
var parametres = {
"bbox" : bboxRequete,
"zoom" : map.getZoom(),
"format" : typeSite,
"source" : sourceAjout,
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"dept" : dept,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
ancienneRequete = [map.getBounds(), map.getZoom()];
url = urlBase + "stations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterRetourChargementSource;
executerAJAX();
}
 
function calculerBboxRequete() {
var bordure = map.getBounds();
var bboxRequete = "";
if (ancienneRequete != null && ancienneRequete[1] == map.getZoom()
&& bordure.intersects(ancienneRequete[0])) {
bboxRequete = calculerIntersectionRectangle(ancienneRequete[0], bordure);
} else {
bboxRequete = determinerCoordonneesBordure();
}
return bboxRequete;
}
 
function calculerIntersectionRectangle(rectangle1, rectangle2) {
var bbox1 = [rectangle2.getSouthWest().lng.toFixed(6), rectangle2.getSouthWest().lat.toFixed(6),
rectangle2.getNorthEast().lng.toFixed(6), rectangle2.getNorthEast().lat.toFixed(6)];
var bbox2 = [rectangle2.getSouthWest().lng.toFixed(6), rectangle2.getSouthWest().lat.toFixed(6),
rectangle2.getNorthEast().lng.toFixed(6), rectangle2.getNorthEast().lat.toFixed(6)];
if (rectangle2.getSouthWest().lng >= rectangle1.getSouthWest().lng
&& rectangle2.getSouthWest().lng <= rectangle1.getNorthEast().lng) {
bbox2[0] = bbox1[2] = rectangle1.getNorthEast().lng.toFixed(6);
if (rectangle2.getSouthWest().lat >= rectangle1.getSouthWest().lat
&& rectangle2.getSouthWest().lat <= rectangle1.getNorthEast().lat) {
bbox1[1] = rectangle1.getNorthEast().lat.toFixed(6);
} else {
bbox1[3] = rectangle1.getSouthWest().lat.toFixed(6);
}
} else {
bbox2[0] = bbox1[2] = rectangle1.getSouthWest().lng.toFixed(6);
if (rectangle2.getSouthWest().lat >= rectangle1.getSouthWest().lat
&& rectangle2.getSouthWest().lat <= rectangle1.getNorthEast().lat) {
bbox2[1] = rectangle1.getNorthEast().lat.toFixed(6);
} else {
bbox2[3] = rectangle1.getSouthWest().lat.toFixed(6);
}
}
return bbox1.join(',')+'|'+bbox2.join(',');
}
 
function determinerCoordonneesBordure() {
var ouest = map.getBounds().getSouthWest().lng.toFixed(6),
sud = Math.max(map.getBounds().getSouthWest().lat, -85.051129).toFixed(6),
est = map.getBounds().getNorthEast().lng.toFixed(6),
nord = Math.min(map.getBounds().getNorthEast().lat, 85.051129).toFixed(6);
// appliquer les limites possibles de la projection actuellement utilisee aux coordonnees
// longitudes ouest et est de la bbox (permettra d'eviter de renvoyer des messages d'erreur)
if (ouest < -180) {
ouest += 360;
} else if (ouest > 180) {
ouest -= 360;
}
if (est < -180) {
est += 360;
} else if (est > 180) {
est -= 360;
}
return [ouest, sud, est, nord].join(',');
}
 
function afficherMessageChargement(element) {
if ($("#zone-chargement").css('display') == 'none') {
var divTmplElement = 'tpl-chargement-' + element;
$("#zone-chargement").append($("#" + divTmplElement).text());
$("#zone-chargement").css('display', 'block');
}
}
 
function masquerMessageChargement() {
$("#zone-chargement").css('display', 'none');
$("#zone-chargement").children().remove();
}
 
function executerAJAX() {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
requeteChargementPoints = $.getJSON(url).complete(function() {
fonctionCallback();
});
}
 
function requeteEnCours() {
return (requeteChargementPoints != null && requeteChargementPoints.readyState != 4);
}
 
function estStatutRequeteOK() {
return ((requeteChargementPoints.status == 200 || requeteChargementPoints.status == 304)
|| requeteChargementPoints.status == 0);
}
 
function convertirEnParametresUrl(objet) {
var parametresUrl = '';
for (attribut in objet) {
if (typeof(objet[attribut]) == 'function' || typeof(objet[attribut]) == 'undefined' ||
objet[attribut] == null || objet[attribut] == '*' || objet[attribut] == 0)
continue;
parametresUrl += (parametresUrl == '' ? '' : '&') + attribut + "=" + objet[attribut];
}
return parametresUrl;
};
 
function traiterDonneesStations() {
masquerMessageChargement();
masquerLegende();
if (deplacement == true) {
supprimerFeaturesHorsBbox();
}
deplacement = true;
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
var donneesJSON = eval("(function(){return " + texte + ";})()");
if (donneesJSON != null && donneesJSON.features.length > 0) {
ajouterStationsSurCarte(donneesJSON);
}
}
}
 
function traiterRetourChargementSource() {
masquerMessageChargement();
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
var donneesJSON = eval("(function(){return " + texte + ";})()");
if (donneesJSON != null && donneesJSON.features.length > 0) {
var formatRetourDifferent = donneesJSON.stats.formeDonnees != typeSite;
ajouterStationsSurCarte(donneesJSON);
if (formatRetourDifferent) {
var sourceAIgnorer = donneesJSON.stats.source[0];
var sourcesARecharger = recupererSourcesActivees(sourceAIgnorer);
if (sourcesARecharger.length > 0) {
rechargerSources(sourcesARecharger);
}
}
}
}
}
 
function supprimerFeaturesHorsBbox() {
var bordure = map.getBounds();
var layersRestants = 0;
if (coucheSites != null) {
coucheSites.eachLayer(function(layer) {
if (typeof(layer._latlng) != 'undefined') {
if (bordure.contains(layer.getLatLng())) {
layersRestants ++;
} else {
coucheSites.supprimerPoint(layer);
}
} else {
if (bordure.intersects(layer.getBounds())) {
layersRestants ++;
} else {
coucheSites.removeLayer(layer);
}
}
});
}
if (layersRestants == 0) {
coucheSites = null;
}
}
 
function rechargerSources(sourcesARecharger) {
var listeSourcesASupprimer = sourcesARecharger.split(',');
for (var index = 0; index < listeSourcesASupprimer.length; index ++) {
supprimerFeaturesSource(listeSourcesASupprimer[index]);
}
chargerSource(sourcesARecharger);
}
 
function ajouterStationsSurCarte(donnees) {
typeSite = donnees.stats.formeDonnees;
if (coucheSites == null) {
coucheSites = (typeSite == 'maille') ? new L.FeatureGroup() : new L.ClusterGroup();
map.addLayer(coucheSites);
}
for (var index = 0; index < donnees.features.length; index ++) {
var feature = donnees.features[index];
if (typeSite == 'maille') {
traiterMaille(feature);
} else {
ajouterPoint(feature);
}
}
if (donnees.features.length > 0) {
afficherLegende();
}
if (typeSite == 'maille') {
genererInfobulleMailles();
} else {
coucheSites.afficherClusters();
}
}
 
// =========================================
// Gestion des mailles
 
function traiterMaille(feature) {
var coordonnees = [];
for (var i = 0; i < feature.geometry.coordinates.length; i++) {
var sommet = new L.LatLng(feature.geometry.coordinates[i][0], feature.geometry.coordinates[i][1]);
coordonnees.push(sommet);
}
var maille = rechercherMailleExistante(coordonnees);
if (maille) {
mettreAJourMaille(maille, feature);
} else {
maille = ajouterMaille(feature, coordonnees);
}
colorerMaille(maille);
}
 
function rechercherMailleExistante(coordonnees) {
var mailleTrouvee = null;
coucheSites.eachLayer(function(layer) {
if ('typeSite' in layer && layer.typeSite == 'maille') {
if (sontMaillesIdentiques(coordonnees, layer._latlngs)) {
mailleTrouvee = layer;
return;
}
}
});
return mailleTrouvee;
}
 
function sontMaillesIdentiques(coordonnees1, coordonnees2) {
return (
coordonnees1[0].lat == coordonnees2[0].lat &&
coordonnees1[0].lng == coordonnees2[0].lng &&
coordonnees1[2].lat == coordonnees2[2].lat &&
coordonnees1[2].lng == coordonnees2[2].lng
);
}
 
function ajouterMaille(feature, coordonnees) {
var maille = new L.Polygon(coordonnees);
var optionsMaille = {
color: '#FFFFFF',
opacity : 0.7,
weight: 1,
fillOpacity : 0.6
};
maille.setStyle(optionsMaille);
maille.typeSite = 'maille';
maille.properties = feature.properties;
coucheSites.addLayer(maille);
return maille;
}
 
function mettreAJourMaille(maille, feature) {
var sources = feature.properties.source;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
maille.properties.stations[source] = parseInt(feature.properties.stations[source]);
maille.properties.observations[source] = parseInt(feature.properties.observations[source]);
maille.properties.source.push(source);
}
}
 
function colorerMaille(maille) {
var nombreStations = 0;
var sources = maille.properties.source;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (typeof(maille.properties.stations[source]) != 'undefined') {
nombreStations += parseInt(maille.properties.stations[source]);
}
}
if (nombreStations > 0) {
maille.on('click', surClicMaille);
maille.setStyle({fillColor : genererCouleur(nombreStations), fillOpacity: 0.45, opacity: 0.7});
} else {
maille.setStyle({fillOpacity: 0, opacity: 0});
maille.off('click');
}
}
 
function genererCouleur(nombrePoints) {
var couleur = {'bleu': 231, 'vert': 224, 'rouge': 64},
seuils = [1, 10, 50 ,100, 500, 1000, 2500],
pas = 26,
position = 0;
for (var index = 1; index < seuils.length-1 && nombrePoints >= seuils[index]; index ++) {
position ++;
}
couleur.vert -= position*pas;
return 'rgb('+couleur.bleu+','+couleur.vert+','+couleur.rouge+')';
}
 
function surClicMaille(event) {
map.fitBounds(event.layer.getBounds());
}
 
function afficherLegende() {
if (legende == null) {
legende = new L.Control({position : 'bottomright'});
legende.onAdd = function(map) {
var contenuHtml = '';
if (typeSite == 'maille') {
contenuHtml = construireContenuHtmlLegendeMailles();
} else {
contenuHtml = construireContenuHtmlLegendePoints();
}
return contenuHtml;
};
map.addControl(legende);
}
}
 
function construireContenuHtmlLegendeMailles() {
var div = L.DomUtil.create('div', 'info');
div.innerHTML = '<h4>' + titreLegende + '</h4>';
var seuils = [1, 10, 50 ,100, 500, 1000, 2500];
var labels = [];
for (var i = 0; i < seuils.length; i ++) {
div.innerHTML +=
'<div class="legend">'+
'<span class="couleur-maille" style="background:' + genererCouleur(seuils[i] + 1) + '">'+
'</span>'+seuils[i]+ (i + 1 < seuils.length ? '&ndash;' + seuils[i + 1] : '+')+
'</div>';
}
return div;
}
 
function masquerLegende() {
if (legende != null) {
map.removeControl(legende);
legende = null;
}
}
 
function genererInfobulleMailles() {
coucheSites.eachLayer(function(layer) {
if (layer.typeSite == 'maille') {
genererInfobulle(layer);
}
});
}
 
function genererInfobulle(maille) {
var sources = maille.properties.source;
var textes = new Array();
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (typeof(maille.properties.stations[source]) != 'undefined') {
textes.push(source+" : "+maille.properties.stations[source]+" stations, "
+maille.properties.observations[source]+" observations");
}
}
var contenu = textes.join('<br />');
maille.on('mouseover', function() {
afficherTooltip(contenu, map.latLngToContainerPoint(maille.getBounds().getSouthWest()));
});
maille.on('mouseout', function() {
$("#tooltip").css('display', 'none');
});
}
 
function afficherTooltip(texte, point) {
$("#tooltip").html(texte);
if ($("#tooltip").css('display') == 'none') {
var x = point.x - 15;
var y = point.y + (typeSite == 'maille' ? 1 : 10);
$("#tooltip").css('display', 'block');
$("#tooltip").css('left', x + 'px');
$("#tooltip").css('top', y + 'px');
}
}
 
 
 
 
// ====================================================================
// Gestion des points
 
function ajouterPoint(feature) {
var point = new L.LatLng(feature.geometry.coordinates[0], feature.geometry.coordinates[1]);
feature.properties.typeSite = feature.properties.typeSite.toLowerCase();
coucheSites.ajouterPoint(point, feature.properties);
}
 
function creerMarqueur(point, properties) {
var iconePoint = new L.Icon({ iconUrl : pointImageUrl, iconSize : [16, 16] });
var iconeCommune = new L.Icon({ iconUrl : communeImageUrl, iconSize : [24, 32] });
var icone = (properties.typeSite == 'station') ? iconePoint : iconeCommune;
var marker = new L.Cluster(point, properties, {
icon : icone,
titre : properties.nom
});
console.log(marker);
marker.on('click', surClicMarqueur);
marker.on('mouseover', function() {
afficherTooltip(marker.options.titre, map.latLngToContainerPoint(marker.getLatLng()));
});
marker.on('mouseout', function() {
$("#tooltip").css('display', 'none');
});
return marker;
}
 
function construireContenuHtmlLegendePoints() {
var div = L.DomUtil.create('div', 'info');
div.innerHTML =
'<h4>Stations</h4>'+
'<div class="legend"><table>'+
'<tr>'+
'<td class="image-station"><img src="'+communeImageUrl+'" width="24" height="32" /></td>'+
'<td class="label-station">Commune</td>'+
'</tr>'+
'<tr>'+
'<td class="image-station"><img src="'+pointImageUrl+'" /></td>'+
'<td class="label-station">Lieu précis</td>'+
'</tr>'+
'<tr>'+
'<td class="image-station"><img src="'+clusterImageUrl+'" width="20" height="20" /></td>'+
'<td class="label-station">Groupe de stations proches</td>'+
'</tr>'+
'</table></div>';
return div;
}
 
 
function surClicMarqueur(event) {
var nombreMarkers = event.target.obtenirNombrePoints();
if (nombreMarkers == 1 || map.getZoom() == map.getMaxZoom()) {
recupererObservations(event.target);
} else {
map.setView(event.target.getLatLng(), Math.min(map.getZoom()+2, map.getMaxZoom()));
}
}
 
function recupererObservations(cluster) {
pointClique = cluster;
var latlng = cluster.getLatLng();
afficherMessageChargement('observations');
var parametres = {
"source" : recupererSourcesCluster(cluster),
"stations" : construireListeStationsCluster(cluster),
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
url = urlBase + "observations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterDonneesObservations;
executerAJAX();
}
 
function recupererSourcesCluster(cluster) {
var markers = cluster.recupererPoints();
var sourcesCluster = [];
for (var index = 0; index < markers.length; index ++) {
if (sourcesCluster.indexOf(markers[index].source) == -1) {
sourcesCluster.push(markers[index].source);
}
}
return sourcesCluster.join(',');
}
 
function construireListeStationsCluster(cluster) {
var markers = cluster.recupererMarkers();
var listePoints = [];
for (var index = 0; index < markers.length; index ++) {
var latlng = markers[index].getLatLng();
listePoints.push(markers[index].source+":"+markers[index].typeSite+":"+latlng.lng+","+latlng.lat);
}
return listePoints.join('|');
}
 
function traiterDonneesObservations() {
masquerMessageChargement();
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
obsJSON = eval("(function(){return " + texte + ";})()");
if (obsJSON != null) {
viderListeObservations();
if (obsJSON.total > 0) {
doitRafraichirCarte = false;
map.setView(new L.LatLng(pointClique.getLatLng().lat, pointClique.getLatLng().lng), map.getZoom());
afficherInfoBulle();
} else if (infoBulle != null) {
masquerInfoBulle();
}
}
}
}
 
 
 
 
// ====================================================================
// Gestion de l'infobulle
 
var obsJSON = null,
pointClique = null,
obsStation = [],
pagineur = {'limite':100, 'start':0, 'total':0, 'stationId':null, 'format':'tableau'};
 
function afficherInfoBulle() {
var latitude = pointClique.getLatLng().lat;
var longitude = pointClique.getLatLng().lng;
infoBulle = new L.Popup({maxWidth : definirLargeurInfoBulle(), maxHeight : 380});
infoBulle.setLatLng(new L.LatLng(latitude, longitude));
infoBulle.setContent($("#tpl-obs").html());
infoBulle.openOn(map);
remplirContenuPopup();
$('#info-bulle').css('width', '99%');
$('#observations').css('height', '250px');
$('#observations').css('overflow', 'auto');
$('.leaflet-popup-scrolled').css('overflow', 'visible');
}
 
function viderListeObservations() {
obsStation = new Array();
}
 
function definirLargeurInfoBulle() {
var largeurViewPort = $(window).width();
var lageurInfoBulle = null;
if (largeurViewPort < 800) {
largeurInfoBulle = 400;
} else if (largeurViewPort >= 800 && largeurViewPort < 1200) {
largeurInfoBulle = 500;
} else if (largeurViewPort >= 1200) {
largeurInfoBulle = 600;
}
return largeurInfoBulle;
}
 
function redimensionnerPopup() {
$('.leaflet-popup-content*').css('width', definirLargeurInfoBulle());
$('#info-bulle').css('width', '99%');
}
 
function remplirContenuPopup() {
ajouterTableauTriable("#obs-tableau");
ajouterTitre();
afficherTableau();
afficherTexteStationId();
}
 
function masquerInfoBulle() {
if (infoBulle != null && map.hasLayer(infoBulle)) {
map.removeLayer(infoBulle);
}
infoBulle = null;
}
 
function ajouterTitre() {
var texteStationTitre = obsJSON.total + ' observation' + (obsJSON.total > 1 ? 's' : '')
+ ' sur ' + (pointClique.typeSite=='station' ? 'la station : ' : 'la commune : ')
+ pointClique.options.title;
$('#obs-station-titre').text(texteStationTitre);
}
 
function afficherTableau() {
construireListeObservations();
afficherPagination();
afficherObservationsDansHTML();
}
 
function construireListeObservations() {
if (obsStation.length==0) {
// premiere execution de la fonction : faire une copie des objets JSON decrivant les observations
for (var index = 0; index < obsJSON.observations.length; index ++) {
obsStation.push(obsJSON.observations[index]);
}
}
pagineur.total = obsStation.length;
}
 
function afficherPagination() {
$(".navigation").pagination(pagineur.total, {
items_per_page:pagineur.limite,
callback:afficherObservationsDansHTML,
next_text:'Suivant',
prev_text:'Précédent',
prev_show_always:false,
num_edge_entries:1,
num_display_entries:4,
load_first_page:true
});
}
 
function afficherObservationsDansHTML(indexPage) {
$("#obs-tableau-lignes").empty();
if (typeof(indexPage) == 'undefined') {
indexPage = 0;
}
var depart = indexPage * pagineur.limite;
var obsPage = [];
for (var index = depart; index < depart + pagineur.limite; index ++) {
obsPage.push(obsStation[index]);
}
$("#tpl-obs-tableau").tmpl(obsPage).appendTo("#obs-tableau-lignes");
mettreAJourTableauTriable();
}
 
function ajouterTableauTriable() {
$.tablesorter.addParser({
id: 'date_cel',
is: function(s) {
// doit retourner false si le parseur n'est pas autodétecté
return /^\s*\d{2}[\/-]\d{2}[\/-]\d{4}\s*$/.test(s);
},
format: function(date) {
// Transformation date jj/mm/aaaa en aaaa/mm/jj
date = date.replace(/^\s*(\d{2})[\/-](\d{2})[\/-](\d{4})\s*$/, "$3-$2-$1");
// Remplace la date par un nombre de millisecondes pour trier numériquement
return $.tablesorter.formatFloat(new Date(date).getTime());
},
type: 'numeric'
});
$("#obs-tableau").tablesorter({
headers: {
1: {
sorter:'date_cel'
}
}
});
}
 
function mettreAJourTableauTriable() {
$("#obs-tableau").trigger('update');
}
 
function afficherTexteStationId() {
var latitude = pointClique.getLatLng().lat.toFixed(5);
var longitude = pointClique.getLatLng().lng.toFixed(5);
var texteStationId = pointClique.typeSite.toUpperCase() + ':'
+ latitude + '|' + longitude + ', SOURCE:' + pointClique.source;
$('#obs-station-id').text(texteStationId);
}
var map = null,
optionsCoucheOSM = {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors,'
+ ' <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
maxZoom: 18
},
optionsCoucheGoogle = {
attribution: 'Map data &copy;'+new Date().getFullYear()+' <a href="http://maps.google.com">Google</a>',
maxZoom: 18
},
coucheOSM = new L.TileLayer("http://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
optionsCoucheOSM),
coucheRelief = new L.TileLayer("http://c.tile3.opencyclemap.org/landscape/{z}/{x}/{y}.png",
optionsCoucheOSM),
coucheSatellite = new L.TileLayer("http://mt1.google.com/vt/lyrs=y@218131653&hl=fr&src=app&x={x}&y={y}&z={z}",
optionsCoucheGoogle),
optionsCarte = {
center : new L.LatLng(46, 2),
zoom : 6,
minZoom : 3,
maxBounds : [[-85.051129, -180], [85.051129, 180]],
layers : [coucheOSM]
},
zoom = 6,
legende = null,
coucheDepartement = null,
infoBulle = null;
 
var coucheSites = null,
sources = new Object(),
typeSite = 'maille',
overlays = [];
 
var requeteChargementPoints = null,
timer = null,
ancienneRequete = null,
deplacement = true,
url = '';
 
 
 
 
$(document).ready(function() {
initialiserWidget();
});
 
$(window).resize(function() {
dimensionnerCarte();
});
 
function initialiserWidget() {
initialiserCarte();
chargerLimitesCommunales();
initialiserPanneauControle();
initialiserSources();
initialiserListeners();
chargerLocalisations();
}
 
function initialiserCarte() {
dimensionnerCarte();
map = L.map('map', optionsCarte);
coucheSatellite.addTo(map);
coucheRelief.addTo(map);
coucheOSM.addTo(map);
var echelle = new L.Control.Scale({
maxWidth : 50,
metric : true,
imperial : false,
updateWhenIdle : true
});
map.addControl(echelle);
zoom = map.getZoom();
}
 
function dimensionnerCarte() {
$('#map').height($(window).height());
$('#map').width($(window).width());
}
 
function initialiserListeners() {
map.on('moveend', surChangementVueCarte);
map.on('zoomend', surChangementVueCarte);
map.on('popupclose', function(e) {
masquerInfoBulle();
programmerRafraichissementCarte();
});
}
 
function initialiserPanneauControle() {
var baseMaps = {
"Satellite" : coucheSatellite,
"Relief" : coucheRelief,
"Plan" : coucheOSM
};
 
var overlayMaps = {};
for (var index = 0; index < listeSources.length; index ++) {
sources[listeSources[index]] = estValeurDansTableau(source, listeSources[index]);
overlayMaps[listeSources[index]] = new L.LayerGroup();
}
L.control.layers(baseMaps, overlayMaps).addTo(map);
coucheOSM.bringToFront();
map.removeLayer(coucheRelief);
map.removeLayer(coucheOSM);
// garder par defaut la couche plan google comme selectionnee dans le panel
var selecteursFonds = $('.leaflet-control-layers-base .leaflet-control-layers-selector');
selecteursFonds[0].checked = true;
selecteursFonds[1].checked = false;
selecteursFonds[2].checked = false;
}
 
function chargerLimitesCommunales() {
coucheDepartement = new L.KML(null, {async : true}).addTo(map);
if (urlsLimitesCommunales != null) {
coucheDepartement.addKMLFiles(urlsLimitesCommunales);
}
}
 
function initialiserSources() {
overlays = $('.leaflet-control-layers-overlays .leaflet-control-layers-selector');
$.each(overlays, function (index, input) {
input.value = listeSources[index];
input.id = 'overlay' + (index+1);
var lien = '<a href="' + liensVersSources[index] + '" target="_blank">' + nomListeSources[index] + '</a>';
$('#overlay' + (index+1) + ' ~ span').html(lien);
input.checked = sources[listeSources[index]];
input.onclick = function(event) {
changerSource(event.target.value);
}
});
}
 
function changerSource(projetClique) {
var indexProjetClique;
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].value == projetClique) {
indexProjetClique = index;
}
}
masquerInfoBulle();
sources[projetClique] = overlays[indexProjetClique].checked;
if (sources[projetClique] == true) {
programmerRafraichissementCarte(projetClique);
} else {
if (requeteEnCours()) {
stopperRequeteAjax();
}
supprimerFeaturesSource(projetClique);
}
}
 
function supprimerFeaturesSource(source) {
if (coucheSites != null) {
coucheSites.eachLayer(function(layer) {
if (layer.typeSite == 'maille') {
retirerStationsEtObservations(layer, source);
} else {
layer.supprimerSource(source, coucheSites);
if (layer._map == 'null') {
couheSites.removeLayer(layer);
}
}
});
if (typeSite == 'maille') {
var nombreMailles = calculerNombreMaillesVisibles();
if (nombreMailles == 0) {
coucheSites.clearLayers();
masquerLegende();
typeSite = 'point';
}
}
}
}
 
function retirerStationsEtObservations(maille, sourceRetrait) {
var sources = maille.properties.source;
var nombreStations = 0;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (source == sourceRetrait) {
delete maille.properties.stations[source];
delete maille.properties.observations[source];
} else if (typeof(maille.properties.stations[source]) != 'undefined') {
nombreStations += parseInt(maille.properties.stations[source]);
}
}
if (nombreStations == 0) {
coucheSites.removeLayer(maille);
} else {
colorerMaille(maille)
genererInfobulle(maille);
}
}
 
function calculerNombreMaillesVisibles() {
var nombreMailles = 0;
coucheSites.eachLayer(function(layer) {
if($(layer._path).attr('fill-opacity') != '0') {
nombreMailles ++;
}
});
return nombreMailles;
}
 
function estValeurDansTableau(tableau, valeur) {
var index;
for (index = 0; index < tableau.length && tableau[index] != valeur; index ++);
return (tableau.length > 0 && index != tableau.length);
}
 
//************************************
// requetes stations
 
function surChangementVueCarte() {
programmerRafraichissementCarte();
}
 
function programmerRafraichissementCarte(source) {
$('#tooltip').css('display', 'none');
source = (source == null || source == 'null') ? null : source;
if (timer != null) {
window.clearTimeout(timer);
}
if (requeteChargementPoints != null) {
stopperRequeteAjax();
}
var nombreSourcesVisibles = 0;
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].checked) {
nombreSourcesVisibles ++;
}
}
if (source == null) {
timer = window.setTimeout("chargerLocalisations()", 100);
} else {
timer = window.setTimeout("chargerSource('"+source+"')", 100);
}
}
 
function stopperRequeteAjax() {
requeteChargementPoints.abort();
requeteChargementPoints = null;
}
 
function chargerLocalisations() {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
afficherMessageChargement('stations');
if (!(ancienneRequete != null && ancienneRequete[1] == map.getZoom()
&& map.getBounds().intersects(ancienneRequete[0]))) {
supprimerFeatures();
deplacement = false;
}
var bboxRequete = calculerBboxRequete();
var parametres = {
"bbox" : bboxRequete,
"zoom" : map.getZoom(),
"source" : recupererSourcesActivees(),
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"dept" : dept,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
if (deplacement == true) {
parametres.format = typeSite;
}
ancienneRequete = [map.getBounds(), map.getZoom()];
url = urlBase + "stations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterDonneesStations;
executerAJAX();
}
 
function supprimerFeatures() {
if (coucheSites != null) {
coucheSites.clearLayers();
coucheSites = null;
}
}
 
function recupererSourcesActivees(sourceAIgnorer) {
sourceAIgnorer = typeof(sourceAIgnorer) == 'undefined' ? '' : sourceAIgnorer;
var sourcesActivees = [];
for (var index = 0; index < overlays.length; index ++) {
if (overlays[index].checked == true && overlays[index].value != sourceAIgnorer) {
sourcesActivees.push(overlays[index].value);
}
}
return sourcesActivees.join(',');
}
 
function chargerSource(sourceAjout) {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
afficherMessageChargement('stations');
var bboxRequete = determinerCoordonneesBordure();
var parametres = {
"bbox" : bboxRequete,
"zoom" : map.getZoom(),
"format" : typeSite,
"source" : sourceAjout,
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"dept" : dept,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
ancienneRequete = [map.getBounds(), map.getZoom()];
url = urlBase + "stations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterRetourChargementSource;
executerAJAX();
}
 
function calculerBboxRequete() {
var bordure = map.getBounds();
var bboxRequete = "";
if (ancienneRequete != null && ancienneRequete[1] == map.getZoom()
&& bordure.intersects(ancienneRequete[0])) {
bboxRequete = calculerIntersectionRectangle(ancienneRequete[0], bordure);
} else {
bboxRequete = determinerCoordonneesBordure();
}
return bboxRequete;
}
 
function calculerIntersectionRectangle(rectangle1, rectangle2) {
var bbox1 = [rectangle2.getSouthWest().lng.toFixed(6), rectangle2.getSouthWest().lat.toFixed(6),
rectangle2.getNorthEast().lng.toFixed(6), rectangle2.getNorthEast().lat.toFixed(6)];
var bbox2 = [rectangle2.getSouthWest().lng.toFixed(6), rectangle2.getSouthWest().lat.toFixed(6),
rectangle2.getNorthEast().lng.toFixed(6), rectangle2.getNorthEast().lat.toFixed(6)];
if (rectangle2.getSouthWest().lng >= rectangle1.getSouthWest().lng
&& rectangle2.getSouthWest().lng <= rectangle1.getNorthEast().lng) {
bbox2[0] = bbox1[2] = rectangle1.getNorthEast().lng.toFixed(6);
if (rectangle2.getSouthWest().lat >= rectangle1.getSouthWest().lat
&& rectangle2.getSouthWest().lat <= rectangle1.getNorthEast().lat) {
bbox1[1] = rectangle1.getNorthEast().lat.toFixed(6);
} else {
bbox1[3] = rectangle1.getSouthWest().lat.toFixed(6);
}
} else {
bbox2[0] = bbox1[2] = rectangle1.getSouthWest().lng.toFixed(6);
if (rectangle2.getSouthWest().lat >= rectangle1.getSouthWest().lat
&& rectangle2.getSouthWest().lat <= rectangle1.getNorthEast().lat) {
bbox2[1] = rectangle1.getNorthEast().lat.toFixed(6);
} else {
bbox2[3] = rectangle1.getSouthWest().lat.toFixed(6);
}
}
return bbox1.join(',')+'|'+bbox2.join(',');
}
 
function determinerCoordonneesBordure() {
var ouest = map.getBounds().getSouthWest().lng.toFixed(6),
sud = Math.max(map.getBounds().getSouthWest().lat, -85.051129).toFixed(6),
est = map.getBounds().getNorthEast().lng.toFixed(6),
nord = Math.min(map.getBounds().getNorthEast().lat, 85.051129).toFixed(6);
// appliquer les limites possibles de la projection actuellement utilisee aux coordonnees
// longitudes ouest et est de la bbox (permettra d'eviter de renvoyer des messages d'erreur)
if (ouest < -180) {
ouest += 360;
} else if (ouest > 180) {
ouest -= 360;
}
if (est < -180) {
est += 360;
} else if (est > 180) {
est -= 360;
}
return [ouest, sud, est, nord].join(',');
}
 
function afficherMessageChargement(element) {
if ($("#zone-chargement").css('display') == 'none') {
var divTmplElement = 'tpl-chargement-' + element;
$("#zone-chargement").append($("#" + divTmplElement).text());
$("#zone-chargement").css('display', 'block');
}
}
 
function masquerMessageChargement() {
$("#zone-chargement").css('display', 'none');
$("#zone-chargement").children().remove();
}
 
function executerAJAX() {
if (requeteEnCours()) {
requeteChargementPoints.abort();
}
requeteChargementPoints = $.getJSON(url).complete(function() {
fonctionCallback();
});
}
 
function requeteEnCours() {
return (requeteChargementPoints != null && requeteChargementPoints.readyState != 4);
}
 
function estStatutRequeteOK() {
return ((requeteChargementPoints.status == 200 || requeteChargementPoints.status == 304)
|| requeteChargementPoints.status == 0);
}
 
function convertirEnParametresUrl(objet) {
var parametresUrl = '';
for (attribut in objet) {
if (typeof(objet[attribut]) == 'function' || typeof(objet[attribut]) == 'undefined' ||
objet[attribut] == null || objet[attribut] == '*' || objet[attribut] == 0)
continue;
parametresUrl += (parametresUrl == '' ? '' : '&') + attribut + "=" + objet[attribut];
}
return parametresUrl;
};
 
function traiterDonneesStations() {
masquerMessageChargement();
masquerLegende();
if (deplacement == true) {
supprimerFeaturesHorsBbox();
}
deplacement = true;
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
var donneesJSON = eval("(function(){return " + texte + ";})()");
if (donneesJSON != null && donneesJSON.features.length > 0) {
ajouterStationsSurCarte(donneesJSON);
}
}
}
 
function traiterRetourChargementSource() {
masquerMessageChargement();
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
var donneesJSON = eval("(function(){return " + texte + ";})()");
if (donneesJSON != null && donneesJSON.features.length > 0) {
var formatRetourDifferent = donneesJSON.stats.formeDonnees != typeSite;
ajouterStationsSurCarte(donneesJSON);
if (formatRetourDifferent) {
var sourceAIgnorer = donneesJSON.stats.source[0];
var sourcesARecharger = recupererSourcesActivees(sourceAIgnorer);
if (sourcesARecharger.length > 0) {
rechargerSources(sourcesARecharger);
}
}
}
}
}
 
function supprimerFeaturesHorsBbox() {
var bordure = map.getBounds();
var layersRestants = 0;
if (coucheSites != null) {
coucheSites.eachLayer(function(layer) {
if (typeof(layer._latlng) != 'undefined') {
if (bordure.contains(layer.getLatLng())) {
layersRestants ++;
} else {
coucheSites.supprimerPoint(layer);
}
} else {
if (bordure.intersects(layer.getBounds())) {
layersRestants ++;
} else {
coucheSites.removeLayer(layer);
}
}
});
}
if (layersRestants == 0) {
coucheSites = null;
}
}
 
function rechargerSources(sourcesARecharger) {
var listeSourcesASupprimer = sourcesARecharger.split(',');
for (var index = 0; index < listeSourcesASupprimer.length; index ++) {
supprimerFeaturesSource(listeSourcesASupprimer[index]);
}
chargerSource(sourcesARecharger);
}
 
function ajouterStationsSurCarte(donnees) {
typeSite = donnees.stats.formeDonnees;
if (coucheSites == null) {
coucheSites = (typeSite == 'maille') ? new L.FeatureGroup() : new L.ClusterGroup();
map.addLayer(coucheSites);
}
for (var index = 0; index < donnees.features.length; index ++) {
var feature = donnees.features[index];
if (typeSite == 'maille') {
traiterMaille(feature);
} else {
ajouterPoint(feature);
}
}
if (donnees.features.length > 0) {
afficherLegende();
}
if (typeSite == 'maille') {
genererInfobulleMailles();
} else {
coucheSites.afficherClusters();
}
}
 
// =========================================
// Gestion des mailles
 
function traiterMaille(feature) {
var coordonnees = [];
for (var i = 0; i < feature.geometry.coordinates.length; i++) {
var sommet = new L.LatLng(feature.geometry.coordinates[i][0], feature.geometry.coordinates[i][1]);
coordonnees.push(sommet);
}
var maille = rechercherMailleExistante(coordonnees);
if (maille) {
mettreAJourMaille(maille, feature);
} else {
maille = ajouterMaille(feature, coordonnees);
}
colorerMaille(maille);
}
 
function rechercherMailleExistante(coordonnees) {
var mailleTrouvee = null;
coucheSites.eachLayer(function(layer) {
if ('typeSite' in layer && layer.typeSite == 'maille') {
if (sontMaillesIdentiques(coordonnees, layer._latlngs)) {
mailleTrouvee = layer;
return;
}
}
});
return mailleTrouvee;
}
 
function sontMaillesIdentiques(coordonnees1, coordonnees2) {
return (
coordonnees1[0].lat == coordonnees2[0].lat &&
coordonnees1[0].lng == coordonnees2[0].lng &&
coordonnees1[2].lat == coordonnees2[2].lat &&
coordonnees1[2].lng == coordonnees2[2].lng
);
}
 
function ajouterMaille(feature, coordonnees) {
var maille = new L.Polygon(coordonnees);
var optionsMaille = {
color: '#FFFFFF',
opacity : 0.7,
weight: 1,
fillOpacity : 0.6
};
maille.setStyle(optionsMaille);
maille.typeSite = 'maille';
maille.properties = feature.properties;
coucheSites.addLayer(maille);
return maille;
}
 
function mettreAJourMaille(maille, feature) {
var sources = feature.properties.source;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
maille.properties.stations[source] = parseInt(feature.properties.stations[source]);
maille.properties.observations[source] = parseInt(feature.properties.observations[source]);
maille.properties.source.push(source);
}
}
 
function colorerMaille(maille) {
var nombreStations = 0;
var sources = maille.properties.source;
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (typeof(maille.properties.stations[source]) != 'undefined') {
nombreStations += parseInt(maille.properties.stations[source]);
}
}
if (nombreStations > 0) {
maille.on('click', surClicMaille);
maille.setStyle({fillColor : genererCouleur(nombreStations), fillOpacity: 0.45, opacity: 0.7});
} else {
maille.setStyle({fillOpacity: 0, opacity: 0});
maille.off('click');
}
}
 
function genererCouleur(nombrePoints) {
var couleur = {'bleu': 231, 'vert': 224, 'rouge': 64},
seuils = [1, 10, 50 ,100, 500, 1000, 2500],
pas = 26,
position = 0;
for (var index = 1; index < seuils.length-1 && nombrePoints >= seuils[index]; index ++) {
position ++;
}
couleur.vert -= position*pas;
return 'rgb('+couleur.bleu+','+couleur.vert+','+couleur.rouge+')';
}
 
function surClicMaille(event) {
map.fitBounds(event.layer.getBounds());
}
 
function afficherLegende() {
if (legende == null) {
legende = new L.Control({position : 'bottomright'});
legende.onAdd = function(map) {
var contenuHtml = '';
if (typeSite == 'maille') {
contenuHtml = construireContenuHtmlLegendeMailles();
} else {
contenuHtml = construireContenuHtmlLegendePoints();
}
return contenuHtml;
};
map.addControl(legende);
}
}
 
function construireContenuHtmlLegendeMailles() {
var div = L.DomUtil.create('div', 'info');
div.innerHTML = '<h4>' + titreLegende + '</h4>';
var seuils = [1, 10, 50 ,100, 500, 1000, 2500];
var labels = [];
for (var i = 0; i < seuils.length; i ++) {
div.innerHTML +=
'<div class="legend">'+
'<span class="couleur-maille" style="background:' + genererCouleur(seuils[i] + 1) + '">'+
'</span>'+seuils[i]+ (i + 1 < seuils.length ? '&ndash;' + seuils[i + 1] : '+')+
'</div>';
}
return div;
}
 
function masquerLegende() {
if (legende != null) {
map.removeControl(legende);
legende = null;
}
}
 
function genererInfobulleMailles() {
coucheSites.eachLayer(function(layer) {
if (layer.typeSite == 'maille') {
genererInfobulle(layer);
}
});
}
 
function genererInfobulle(maille) {
var sources = maille.properties.source;
var textes = new Array();
for (var index = 0; index < sources.length; index ++) {
var source = sources[index];
if (typeof(maille.properties.stations[source]) != 'undefined') {
textes.push(source+" : "+maille.properties.stations[source]+" stations, "
+maille.properties.observations[source]+" observations");
}
}
var contenu = textes.join('<br />');
maille.on('mouseover', function() {
afficherTooltip(contenu, map.latLngToContainerPoint(maille.getBounds().getSouthWest()));
});
maille.on('mouseout', function() {
$("#tooltip").css('display', 'none');
});
}
 
function afficherTooltip(texte, point) {
$("#tooltip").html(texte);
if ($("#tooltip").css('display') == 'none') {
var x = point.x - 15;
var y = point.y + (typeSite == 'maille' ? 1 : 10);
$("#tooltip").css('display', 'block');
$("#tooltip").css('left', x + 'px');
$("#tooltip").css('top', y + 'px');
}
}
 
 
 
 
// ====================================================================
// Gestion des points
 
function ajouterPoint(feature) {
var iconePoint = new L.Icon({ iconUrl : pointImageUrl, iconSize : [16, 16] }),
iconeCommune = new L.Icon({ iconUrl : communeImageUrl, iconSize : [24, 32] }),
icone = (feature.properties.typeSite == 'STATION') ? iconePoint : iconeCommune,
point = new L.LatLng(feature.geometry.coordinates[0], feature.geometry.coordinates[1]);
var marker = new L.Cluster(point, {
icon : icone,
titre : feature.properties.nom
});
marker.typeSite = feature.properties.typeSite.toLowerCase();
marker.source = feature.properties.source;
marker.on('click', surClicMarqueur);
marker.on('mouseover', function() {
afficherTooltip(marker.options.titre, map.latLngToContainerPoint(marker.getLatLng()));
});
marker.on('mouseout', function() {
$("#tooltip").css('display', 'none');
});
coucheSites.ajouterPoint(marker);
}
 
function construireContenuHtmlLegendePoints() {
var div = L.DomUtil.create('div', 'info');
div.innerHTML =
'<h4>Stations</h4>'+
'<div class="legend"><table>'+
'<tr>'+
'<td class="image-station"><img src="'+communeImageUrl+'" width="24" height="32" /></td>'+
'<td class="label-station">Commune</td>'+
'</tr>'+
'<tr>'+
'<td class="image-station"><img src="'+pointImageUrl+'" /></td>'+
'<td class="label-station">Lieu précis</td>'+
'</tr>'+
'<tr>'+
'<td class="image-station"><img src="'+clusterImageUrl+'" width="20" height="20" /></td>'+
'<td class="label-station">Groupe de stations proches</td>'+
'</tr>'+
'</table></div>';
return div;
}
 
 
function surClicMarqueur(event) {
var nombreMarkers = event.target.recupererMarkers().length;
if (nombreMarkers == 1 || map.getZoom() == map.getMaxZoom()) {
recupererObservations(event.target);
} else {
map.setView(event.target.getLatLng(), Math.min(map.getZoom()+2, map.getMaxZoom()));
}
}
 
function recupererObservations(cluster) {
pointClique = cluster;
var latlng = cluster.getLatLng();
afficherMessageChargement('observations');
var parametres = {
"source" : recupererSourcesCluster(cluster),
"stations" : construireListeStationsCluster(cluster),
"num_taxon" : numTaxon,
"nn" : nn,
"referentiel" : referentiel,
"auteur" : auteur,
"date_debut" : dateDebut,
"date_fin" : dateFin,
"nb_jours" : nbJours
};
url = urlBase + "observations?" + convertirEnParametresUrl(parametres);
fonctionCallback = traiterDonneesObservations;
executerAJAX();
}
 
function recupererSourcesCluster(cluster) {
var markers = cluster.recupererMarkers();
var sourcesCluster = [];
for (var index = 0; index < markers.length; index ++) {
if (sourcesCluster.indexOf(markers[index].source) == -1) {
sourcesCluster.push(markers[index].source);
}
}
return sourcesCluster.join(',');
}
 
function construireListeStationsCluster(cluster) {
var markers = cluster.recupererMarkers();
var listePoints = [];
for (var index = 0; index < markers.length; index ++) {
var latlng = markers[index].getLatLng();
listePoints.push(markers[index].source+":"+markers[index].typeSite+":"+latlng.lng+","+latlng.lat);
}
return listePoints.join('|');
}
 
function traiterDonneesObservations() {
masquerMessageChargement();
var texte = requeteChargementPoints.responseText;
if (!estStatutRequeteOK()) {
alert(texte);
} else {
obsJSON = eval("(function(){return " + texte + ";})()");
if (obsJSON != null) {
viderListeObservations();
if (obsJSON.total > 0) {
doitRafraichirCarte = false;
map.setView(new L.LatLng(pointClique.getLatLng().lat, pointClique.getLatLng().lng), map.getZoom());
afficherInfoBulle();
} else if (infoBulle != null) {
masquerInfoBulle();
}
}
}
}
 
 
 
 
// ====================================================================
// Gestion de l'infobulle
 
var obsJSON = null,
pointClique = null,
obsStation = [],
pagineur = {'limite':100, 'start':0, 'total':0, 'stationId':null, 'format':'tableau'};
 
function afficherInfoBulle() {
var latitude = pointClique.getLatLng().lat;
var longitude = pointClique.getLatLng().lng;
infoBulle = new L.Popup({maxWidth : definirLargeurInfoBulle(), maxHeight : 380});
infoBulle.setLatLng(new L.LatLng(latitude, longitude));
infoBulle.setContent($("#tpl-obs").html());
infoBulle.openOn(map);
remplirContenuPopup();
$('#info-bulle').css('width', '99%');
$('#observations').css('height', '250px');
$('#observations').css('overflow', 'auto');
$('.leaflet-popup-scrolled').css('overflow', 'visible');
}
 
function viderListeObservations() {
obsStation = new Array();
}
 
function definirLargeurInfoBulle() {
var largeurViewPort = $(window).width();
var lageurInfoBulle = null;
if (largeurViewPort < 800) {
largeurInfoBulle = 400;
} else if (largeurViewPort >= 800 && largeurViewPort < 1200) {
largeurInfoBulle = 500;
} else if (largeurViewPort >= 1200) {
largeurInfoBulle = 600;
}
return largeurInfoBulle;
}
 
function redimensionnerPopup() {
$('.leaflet-popup-content*').css('width', definirLargeurInfoBulle());
$('#info-bulle').css('width', '99%');
}
 
function remplirContenuPopup() {
ajouterTableauTriable("#obs-tableau");
ajouterTitre();
afficherTableau();
afficherTexteStationId();
}
 
function masquerInfoBulle() {
if (infoBulle != null && map.hasLayer(infoBulle)) {
map.removeLayer(infoBulle);
}
infoBulle = null;
}
 
function ajouterTitre() {
var texteStationTitre = obsJSON.total + ' observation' + (obsJSON.total > 1 ? 's' : '')
+ ' sur ' + (pointClique.typeSite=='station' ? 'la station : ' : 'la commune : ')
+ pointClique.options.title;
$('#obs-station-titre').text(texteStationTitre);
}
 
function afficherTableau() {
construireListeObservations();
afficherPagination();
afficherObservationsDansHTML();
}
 
function construireListeObservations() {
if (obsStation.length==0) {
// premiere execution de la fonction : faire une copie des objets JSON decrivant les observations
for (var index = 0; index < obsJSON.observations.length; index ++) {
obsStation.push(obsJSON.observations[index]);
}
}
pagineur.total = obsStation.length;
}
 
function afficherPagination() {
$(".navigation").pagination(pagineur.total, {
items_per_page:pagineur.limite,
callback:afficherObservationsDansHTML,
next_text:'Suivant',
prev_text:'Précédent',
prev_show_always:false,
num_edge_entries:1,
num_display_entries:4,
load_first_page:true
});
}
 
function afficherObservationsDansHTML(indexPage) {
$("#obs-tableau-lignes").empty();
if (typeof(indexPage) == 'undefined') {
indexPage = 0;
}
var depart = indexPage * pagineur.limite;
var obsPage = [];
for (var index = depart; index < depart + pagineur.limite; index ++) {
obsPage.push(obsStation[index]);
}
$("#tpl-obs-tableau").tmpl(obsPage).appendTo("#obs-tableau-lignes");
mettreAJourTableauTriable();
}
 
function ajouterTableauTriable() {
$.tablesorter.addParser({
id: 'date_cel',
is: function(s) {
// doit retourner false si le parseur n'est pas autodétecté
return /^\s*\d{2}[\/-]\d{2}[\/-]\d{4}\s*$/.test(s);
},
format: function(date) {
// Transformation date jj/mm/aaaa en aaaa/mm/jj
date = date.replace(/^\s*(\d{2})[\/-](\d{2})[\/-](\d{4})\s*$/, "$3-$2-$1");
// Remplace la date par un nombre de millisecondes pour trier numériquement
return $.tablesorter.formatFloat(new Date(date).getTime());
},
type: 'numeric'
});
$("#obs-tableau").tablesorter({
headers: {
1: {
sorter:'date_cel'
}
}
});
}
 
function mettreAJourTableauTriable() {
$("#obs-tableau").trigger('update');
}
 
function afficherTexteStationId() {
var latitude = pointClique.getLatLng().lat.toFixed(5);
var longitude = pointClique.getLatLng().lng.toFixed(5);
var texteStationId = pointClique.typeSite.toUpperCase() + ':'
+ latitude + '|' + longitude + ', SOURCE:' + pointClique.source;
$('#obs-station-id').text(texteStationId);
}