Subversion Repositories Sites.obs-saisons.fr

function capitaliserPremiereLettre(string) {

    return string.charAt(0).toUpperCase() + string.slice(1);

}

function obtenirNomEspeceSelectionnee() {

	return $('#selecteur_liste_especes option:selected').text();

}

function obtenirAnneeSelectionnee() {

	return $('#selecteur_annees option:selected').text();

}

function obtenirDonneesPhasesPhenologiques(id_espece, annee) {

	$.get(url_jrest+'OdsExport/ExportPhasesPhenologiquesJson?espece='+id_espece+'&annee='+annee, function(e) {

    var donnees_dispos = !jQuery.isEmptyObject(e);

    if(donnees_dispos) {

      dessinerGraphiquePhasesPhenologiques(e, annee);

    }

    $('.aucune-donnee').toggleClass('hide', donnees_dispos);

    $('.conteneur-graphique').toggleClass('hide', !donnees_dispos);

	});

}

var legende_points = {};

var legende_points_index = {};

function dessinerGraphiquePhasesPhenologiques(data, annee) {

  var traces = new Array();

  var nb_evenements = 0;

  for (var id_evenement in data) {

	    if (!data.hasOwnProperty(id_evenement)) continue;

      var data_evenement = data[id_evenement];

      traces.push({

        x: data_evenement.x,

        type: 'box',

        name: capitaliserPremiereLettre(id_evenement),

      });

      legende_points[capitaliserPremiereLettre(id_evenement)] = data_evenement.text_index;

      legende_points_index[capitaliserPremiereLettre(id_evenement)] = Object.keys(data_evenement.text_index).map(function(x) {

        return parseFloat(x.replace("'", ''));

      });

      nb_evenements++;

  }

  var titre = 'Espèce '+obtenirNomEspeceSelectionnee();

  if(annee == "0") {

    titre += '<br /> Toutes les années';

  } else {

    titre += '<br /> Année '+obtenirAnneeSelectionnee();

  }

  var layout = {

    title: titre,

    xaxis: {

	    title: '',

      autorange: true,

			autoticks: false,

      hoverformat: '.7f',

			tickvals: [1,2,3,4,5,6,7,8,9,10,11,12],

    	ticktext: ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre'],

	  },

    // pour la légende apparaisse en bas du graphique afin de ne pas gâcher

    // presque un tiers de l'espace de la page

    legend:{

      xanchor:"center",

      yanchor:"top",

      y:-0.3,

      x:0.5

    },

    yaxis: {

      tickangle: (nb_evenements == 1 ? -90 : 0),

    }

    legend: false

  };

  Plotly.newPlot('conteneur-graphique', traces, layout);

  var graphique = document.getElementById('conteneur-graphique');

  graphique.on('plotly_hover', function(data) {

    modifierAffichageToolTips(data);

  });

}

function modifierAffichageToolTips(data) {

  var axeY = data.points[0].y;

  $('text.nums, text.name').css('visibility', 'hidden');

  $('text.nums, text.name').css('width', 0);

  $('text.nums').each(function() {

    // certains label contiennent du texte qui ne doit pas être changé

    // par exemple si un point tombe pile sur un début de mois

    // le nom du mois doit rester affiché

    if(isNaN($(this).data('unformatted'))) {

      $(this).css('visibility', 'visible');

      $(this).css('width', '100%');

      return true;

    }

    var $label_axe_y = $(this).parent().find(":contains("+axeY+")");

    if($label_axe_y.length != 0) {

      $label_axe_y.css('z-index', -99999);

      $label_axe_y.hide();

    }

    var $text_hover_clone = creerCopieTooltip($(this), axeY);

    $(this).parent().append($text_hover_clone);

  });

}

function renvoyerDatePourIndexNumerique(index_valeur, index_evenement_legende) {

  // des fois le graphique fait des arrondis de valeurs dont on ne peut plus relier

  // la valeur du graphique a sa date, dans ce cas là on prend la plus proche du tableau

  var index_valeur_formate = parseFloat(index_valeur).toFixed(7);

  var text_hover = legende_points[index_evenement_legende]["'"+index_valeur_formate+"'"];

  if(typeof text_hover == "undefined") {

    index_valeur_f = parseFloat(index_valeur);

    index_valeur = legende_points_index[index_evenement_legende].reduce(function(prev, curr) {

      return (Math.abs(curr - index_valeur_f) < Math.abs(prev - index_valeur_f) ? curr : prev);

    });

    text_hover = legende_points[index_evenement_legende]["'"+index_valeur+"'"];

  }

  return text_hover;

}

function creerCopieTooltip($original, index_evenement_legende) {

  var $clone = $original.clone(true);

  var text_hover = renvoyerDatePourIndexNumerique($original.data('unformatted'), index_evenement_legende)

  $clone.html(text_hover);

  $clone.data('unformatted', text_hover);

  $clone.attr('data-unformatted', text_hover);

  $clone.css('visibility', 'visible');

  $clone.css('width', '100%');

  $clone.css('font-size', '11px');

  return $clone;

}

$(document).ready(function() {

  $('#selecteur_liste_especes').change(function(e) {

    var conteneur_graphique = document.getElementById('conteneur-graphique');

    Plotly.purge(conteneur_graphique);

    obtenirDonneesPhasesPhenologiques($(this).val(), $('#selecteur_annees').val());

  });

  $('#selecteur_annees').change(function(e) {

    var conteneur_graphique = document.getElementById('conteneur-graphique');

    Plotly.purge(conteneur_graphique);

    if($('#selecteur_liste_especes').val() != "0") {

      obtenirDonneesPhasesPhenologiques($('#selecteur_liste_especes').val(), $(this).val());

    }

  });

  if(espece_defaut != null) {

    obtenirDonneesPhasesPhenologiques(espece_defaut, annee_defaut);

  }

});