Aller au contenu | Aller au menu | Aller à la recherche

eMerzh

Mot-clé - javascript

Fil des billets - Fil des commentaires

vendredi 17 juin 2011

Leaflet 0.2, la jeune bibliothèque javascript pour construire vos cartes

Environ 1 mois après l'annonce officielle , mais un peu moins d'un ans avant le 1er commit, voici la version 0.2 de Leaflet. Leaflet est, pour ceux qui n'ont pas suivi, une bibliothèque javascript permettant d'afficher des cartes glissantes comme OSM, votre WMS ou simplement des images.

Depuis l'annonce de Cloudmade (la société derrière le développement de ce joujou), Leaflet a bénéficié de nombreux retours extrêmement positifs des utilisateurs. Elle est alors décrite comme plus légère, plus simple, plus mobile-friendly mais aussi et surtout plus économe dans le chargement des imagettes (jusqu'à près de 8 fois moins dans la configuration par défaut) que les "concurrents" libre comme OpenLayers.

Bien-sûr Leaflet est Open Source (Sous licence BSD) et les sources sont disponibles sur le repository GitHub.

Les nouveautés de cette version sont, outre les nombreuses corrections de bug, le support tant attendu de WMS et de GeoJson. Un paquet de nouvelles projections sont également ajoutées out-of-the-box. Les performances ne sont pas en reste puisque l'équipe a corrigé quelques problèmes et amélioré sensiblement la vitesse des déplacements dans la carte (Panning).

Certains vont même jusqu'à dire que leaflet est plus rapide que GMap :)

Bref de quoi mettre l'eau à la bouche ...

Liste complète des changements

Site de Leaflet

dimanche 12 août 2007

Detecter le scroll dans une boite....

Voici le 1er billet d'une toute nouvelle série ici, celle du développement ... web ou non.....

J'inaugure cette rubrique avec une astuce permettant de détecter si le texte dans une boite dépasse la taille de la boîte.

En faite, je cherchais à savoir si mon texte était assez petit pour rentrer dans un "div" et sinon mettre en place une solution de pagination en Javascript.

Le principe est le suivant :

  1. s'assurer que les scrollbar son désactivées
  2. mesurer la taille de l'élement avec "element.offsetHeight"
  3. activer les scrollbar
  4. re-mesurer la taille
  5. comparer les deux mesures et remettre les scrollbar comme précédemment

Voici un petit exemple ....

 [javascript]

function isOverflown(elem)
{
	oldFlow = elem.style.overflow;
	elem.style.overflow = "hidden";
	
	//Premiere mesure
	sizeNoScroll = elem.scrollHeight;

	elem.style.overflow = "scroll";
	//Deuxième mesure
	sizeWithScroll = elem.scrollHeight;
	
	//réinitialisation
	elem.style.overflow =  oldFlow;
	return (sizeNoScroll==sizeWithScroll);
}