Leaflet

Leaflet on avoimen lähdekoodin JavaScript-kirjasto, jonka avulla voi rakentaa web-kartoitussovelluksia. Leaflet on tarkoituksella tehty pieneksi kirjastoksi ja sen koko on vain 42kB. Se julkaistiin vuonna 2011. Se toimii useilla mobiili- ja työpöytäalustoilla, jotka tukevat HTML5:tä sekä CSS3:a. Esimerkiksi Pinterest sekä Flickr käyttävät Leaflet-kirjastoa. &lt;br&gt;
Leafletin avulla voidaan hyödyntää GeoJSON tiedostoja ja niiden arvoja. GeoJSON tiedostojen avulla voidaan karttaan lisätä tasoja kuvaamaan eri alueita. Leafletin ominaisuuksia voidaan laajentaa useilla eri liitännäisillä joiden avulla saadaan luotua tasoja.
Leaflet tukee helppokäyttöisyyttä kuten näytönlukuohjelmia Narrator ja Orca ja näppäimistön käyttöä osottimen sijasta.
Leafletin ensimmäisen version kehittäjä on Volodymyr Agafonkin.
Ominaisuudet.
Leaflet tarjoaa laajan valikoiman eri elementtejä ja ominaisuuksia, joita voidaan lisätä osaksi Leaflet-karttaa. Leafletin omilta sivuilta. Välilehdeltä pääsee näkemään eri ominaisuuksia ja esimerkkejä niiden implementoinnista, ja sivut tarjoavat helppoja esimerkkikoodeja implementoimaan kyseinen ominaisuus karttaan. 
Leaflet-kirjastossa on mahdollista luoda kartalle haluamansa muotoisia rajoja ja alueita, joihin voidaan lisätä hyödyllistä tietoa alueista. Tämän avulla voidaan esimerkiksi lisätä Suomen kuntien rajat. Alueiden tietoihin voidaan lisätä mitä vain tietoa, kuten kunnan asukkaiden määrän ja kunnan nimi, jotka saadaan näkyviin kursorilla osoittamalla tai alueesta klikkaamalla. Nämä ominaisuudet on mahdollista implementoida GeoJSON- ja Choropleth Map-kirjastoja käyttäen. Näitä yhdistämällä voi tehdä hyvin informatiivisia karttoja, ja näiden lisäksi voidaan liittää eri avoimen datan API:tä Javascriptin avulla hakemaan dataa alueisiin.
Karttaan voi lisätä useita eri kerroksia, joissa on eri tietoja. Leafletin Leaflet-control kirjasto näyttää esimerkin kartasta, jossa on erilaisia taustakarttoja ja merkintöjä, jotka käyttäjä pystyy valitsemaan asetuksista haluamansa mukaan. Sivulta myös nähdään koodipätkät, joiden avulla kartta on luotu, ja niitä käyttäen on helppoa implementoida nämä ominaisuudet omaan Leaflet-karttaan. 
Yhdistämällä Leaflet-kirjaston eri ominaisuuksia voidaan tehdä hyvin personalisoituja karttoja, ja kartoista pystyy tekemään niin tyyliteltyjä kuin koodaaja haluaa. Leaflet-kirjastoa päivitetään jatkuvasti ja Leafletin kehittäjät lisäävät uusia ominaisuuksia. Kirjaston avoimen lähdekoodin avusta kuka vain pystyy tekemään lisäyksiä kirjastoon, ja lisäämään tarvittavia ominaisuuksia karttaelementtiin, jos niitä ei ole vielä saatavilla julkisessa versiossa.
Verrattuna muihin kirjastoihin.
Leaflet on suoraan verrattavissa OpenLayers-kirjastoon. Molemmat ovat asiakaspuoleisia (eng. "client-side") JavaScript kirjastoja, ja noudattavat täysin avoimen lähdekoodin käytäntöä. Molemmat kirjastot ovat siis ilmaisia sekä niiden lähdekoodit ovat julkisia ja kaikkien luettavissa. OpenLayers tukee Leafletin tavoin GeoJSON- sekä Web Map Service- (WMS) tietotyyppejä. Leaflet on uudempi kirjasto ja saa päivityksiä aktiivisemmin kuin OpenLayers. Leafletistä poiketen OpenLayers tukee natiivisti Web Feature Service- (WFS) sekä Google Web Mercator- (GML) tietotyyppejä. 
Leaflet on myös verrattavissa kenties tunnetuimpaan karttakirjastoon, Google Maps API:iin. Google Maps on suljetun lähdekoodin ohjelmisto ja toimii enemmän palvelinpuolella (eng. "server-side") Leafletistä poiketen, joka toimii vain asiakaspuolella. Google Maps API oli pitkään vapaasti käytettävissä, mutta kesäkuusta 2018 asti vaatii API identikaattorin (eng. "API key") käyttämistä varten. Leaflet on puolestaan kaikille käyttäjille ilmainen.
Google Maps API:sta löytyy enemmän ominaisuuksia, jotka helpottavat sen yhteistyötä Google Earthin kanssa. Suuri osa näistä ominaisuuksista toimii serveripuolella kuten geokoodaus sekä reititys. Google Maps ei kuitenkaan salli ohjemoijalle valtavasti vapauksia, sillä sitä voi käyttää vain Google Maps-palveluiden kanssa. Leaflet on näin ollen vapaamuotoisempi ja sallii luovempia lopputuloksia. Google Maps API:n DataLayer on kenties lähimpänä Leaflet:in käyttökokemusta ja sallii ulkopuolisten tietolähteiden käyttämisen. 
Käyttöönotto.
Leaflet-kirjaston voi ottaa käyttöön, joko lataamalla Leaflet omalle laitteellesi tai käyttämällä houstattua versiota. Leaflet-kirjaston voi ladata Leafletin omilta nettisivuilta . Hostatun version käyttöönotto ei vaadi Leaflet-kirjaston lataamista, mutta hostatulla versiolla saattaa olla rajoitteita esimerkiksi koodin tarkastusohjelmien kanssa.
Leaflet ladatun version käyttö.
&lt;link rel="stylesheet" href="/path/to/leaflet.css" /&gt;
&lt;script src="/path/to/leaflet.js"&gt;&lt;/script&gt;
&lt;!--Polku leaflet-tiedostoihin voisi olla esimerkiksi leaflet/leaflet.css tai 
leaflet/leaflet.js, jos html-tiedosto on samassa kansiossa kansion leaflet kanssa--&gt;
Leaflet hostatun version käyttö.
&lt;link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" 
 integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" 
 crossorigin="" /&gt;
&lt;script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" 
 integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" 
 crossorigin=""&gt;&lt;/script&gt;
Kummankin version kanssa täytyy muistaa ensin sisällyttää Leaflet CSS-tiedosto ja vasta tämän jälkeen Leaflet JavaScript-tiedosto.
Leaflet-kirjaston version valinnan jälkeen asetetaan HTML elementti, jolle annetaan haluttu id.
&lt;div id="map"&gt;&lt;/div&gt;
&lt;!--Tässä esimerkissä &lt;div&gt; elementin id on map--&gt;
Lopuksi elementille on annettava korkeus. Tämä onnistuu CSS-tiedostossa
/*Asetetaan korkeudeksi esimerkiksi 180 pikseliä kutsumalla elementtiä sen 
id:n avulla*/
Käyttöesimerkki.
 /*Asetetaan Leaflet "map" elementti HTML elementtiin kuten div, jonka id on "map". Tämän jälkeen asetetaan halutut koordinaatit sekä suurennuksen arvo.*/
 const map = L.map('map').setView([51.505, -0.09], 13);
 /*Lisätään karttaan OpenStreetMap-taso ja lisätään attribuutteihin OpenStreetMap tekijänoikeudet(https://operations.osmfoundation.org/policies/tiles/). 
 Tämän jälkeen lisätään taso kartta-elementtiin*/
 L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
 maxZoom: 19,
 attribution: '&amp;copy; &lt;a href="http://www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt;'
 }).addTo(map);
Tuetut alustat.
Työpöytätuki: Chrome, Firefox, Safari 5+, Opera 12+, IE 9-11 ja Edge.
Mobiilituki: Safari iOS 7+, Chrome mobiiliversio, Firefox mobiiliversio ja IE10+ Windows 8 tietokoneille.
Historia.
Leaflet sai alkunsa vuonna 2010 nimellä "Web Maps API", JavaScript-kirjasto CloudMade-nimiselle karttapalveluita tarjoavalle yritykselle jossa Leafleting kehittäjä Agafonkin työskenteli. Toukokuussa 2011 CloudMade julkaisi ensimmäisen version Leafletista. Ensimmäinen versio oli rakennettu täysin uudelta pohjalta mutta osia vanhasta API-koodista oli kuitenkin käytetty.
Maaliskuussa 2022 Venäjän aloittaessa hyökkäyssodan Ukrainassa Leafletin kehittäjä kehotti toimiin leafletjs-nettisivulla. Leafletiä käyttävien karttojen alareunaan lisättiin Ukrainan lippu.