Ero sivun ”Javascript” versioiden välillä
(Ak: Uusi sivu: Visuaalisia kirjastoja: '''datatables''' ([http://datatables.net datatables.net]) on suosittu taulukirjasto. '''fancytree''' ([http://github.com/mar10/fancytree github.com - fancy...) |
|||
| (7 välissä olevaa versiota samalta käyttäjältä ei näytetä) | |||
| Rivi 1: | Rivi 1: | ||
| − | Visuaalisia kirjastoja | + | |
| + | == Arkkitehtuureita == | ||
| + | |||
| + | '''jQuery''' ([http://jquery.com jquery.com]) on selainriippumaton, modulaarinen (''core, ui/mobile ja 3. osapuolen pluginit'') abstraktiokirjasto joka helpottaa javascript-toteutuksen toteuttamista (dom-model, ajax, käyttöliittymän elementit - widgetit jne). Kummatkin - sekä jquery-ui, että jquery-mobile käyttävät perus jquery-kirjastoa ja tukevat ulkoasun teemoja jotka ovat sivustokohtaisesti räätälöitävissä. | ||
| + | |||
| + | Mobiiliversion on tarkoitus toimia myös työpöytäselaimilla, mutta sen toteutustapa poikkeaa merkittävästi jqueury-ui mallista teknisesti. Mobiilissa eri sivut rakennetaan samaan tiedostoon eri lohkoihin ja ladataan kerralla päätelaitteeseen ja sivunvaihdot tapahtuvat mobiilikirjaston suorittamana. Olemassaolevan sivuston muuttaminen mobiilikirjastolla toteutetuksi todennäköisesti vaatisi työlästä uudelleenorganisointia toteutustasolla edellä mainitussa lohkorakenteissa kuin sen toimintatavan eroavaisuuksissa ja siten sen toteuttamista suositellaan aloittamaan tyhjästä käyttämättä vanhaa, esimerkiksi jquery-ui sivustoa. Eroista vaadittava osaaminen vaatii myös toteuttajalta omaksumista tai kokonaan siihen perehtyneitä henkilöitä. | ||
| + | |||
| + | Mobiilikirjastolla tehdyt käyttöliittymät tuntuvat työpöydällä kärsivän mobiililaitteille tyypillisestä elemettien koko ruudun/selaimen leveydestä mikä ei toimi työpöydällä - siitäkin huolimatta, että tätä on pyritty huomioimaan kirjastossa. Ulkoasun poikkeavuudet ja edellä mainitut toteutustavan eroavaisuuksista johtuen näyttäisikin, että markkinoilla olevat saitit käyttävät mobiilikirjastoa ainoastaan mobiililaitteiden tukemiseen ja sivut ovat omassa m.example.com urlissa (''m dot site''). Lupaus yhtenäisestä teknisestä alustasta ei ole ainakaan vielä lyönyt itseään läpi. Tämä taas johtaa kahden eri järjestelmän ylläpitoon ja niiden kustannuksiin. | ||
| + | |||
| + | Mobiiliwebin vaihtoehto on toteuttaa palvelu työpöydälle optimoituna webinä ja mobiililaitteille tehdyllä mobiilisovelluksella. | ||
| + | |||
| + | * [http://demos.jquerymobile.com/ demos.jquerymobile.com] esimerkkejä mobiilin käyttöliittymäelementeistä | ||
| + | * [http://demos.jquerymobile.com/1.4.5/rwd/ demos.jquerymobile.com - RWD] responsive web design, päätelaitteisiin mukautuva toteutus | ||
| + | |||
| + | '''Dojo mobile''' [https://dojotoolkit.org/ dojotoolkit.org] | ||
| + | |||
| + | '''JQ.Mobi''' [http://jqmobi.com/ jqmobi.com] | ||
| + | |||
| + | '''Sencha Touch''' [https://sencha.com/products/touch/ sencha.com - touch] | ||
| + | |||
| + | '''AngularJS''' [https://angularjs.org/ angularjs.org]. | ||
| + | |||
| + | '''React''' [http://reactjs.com reactjs.com]. | ||
| + | |||
| + | '''MEAN''' ([http://mean.io mean.io]) | ||
| + | |||
| + | |||
| + | == Visuaalisia kirjastoja == | ||
| + | '''datatables''' ([http://datatables.net datatables.net]) on suosittu taulukirjasto. '''fancytree''' ([http://github.com/mar10/fancytree github.com - fancytree]) ja '''jstree''' ([http://jstree.com jstree.com]) esittävät hierarkian. '''d3js''' ([http://d3js.org d3js.org]) soveltuu laajojen tietomassojen visualisointiin. [http://grafana.org/ grafana.org] aikasarjojen grafiikkakirjasto. | ||
http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi, | http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi, | ||
| + | |||
| + | https://www.highcharts.com näyttäviä kuvaaji ja karttoja, kaupallinen kirjasto. | ||
| + | |||
| + | '''Grafana''' ([https://grafana.com grafana.com]) kysely, visualisointi ja hälytyksiä tukeva javascript kirjasto. Sisäänrakennettu Graphite-kyselyparseri. | ||
| + | |||
| + | '''ThreeJS''' ([https://threejs.org/ threejs.org], [https://en.wikipedia.org/wiki/Three.js en.wikipedia.org]) kirjasto animoituun 3D-visualisointiin. | ||
https://public.tableau.com/s/ | https://public.tableau.com/s/ | ||
| Rivi 10: | Rivi 44: | ||
http://arborjs.org/ verkkojen visualisointikirjasto | http://arborjs.org/ verkkojen visualisointikirjasto | ||
| − | + | https://plot.ly/ | |
| − | Vue.js | + | == PKI.js == |
| + | |||
| + | https://pkijs.org/ | ||
| + | |||
| + | == Vue.js == | ||
* https://vuejs.org/ | * https://vuejs.org/ | ||
| + | |||
| + | == Web Cryptography == | ||
| + | * http://caniuse.com/#feat=cryptography | ||
| + | * [[WebCryptoAPI]] | ||
| + | |||
| + | == Aiheesta muualla == | ||
| + | * http://selection.datavisualization.ch/ | ||
[[Luokka:Tekniikka]] | [[Luokka:Tekniikka]] | ||
Nykyinen versio 13. elokuuta 2018 kello 08.47
Sisällysluettelo
Arkkitehtuureita
jQuery (jquery.com) on selainriippumaton, modulaarinen (core, ui/mobile ja 3. osapuolen pluginit) abstraktiokirjasto joka helpottaa javascript-toteutuksen toteuttamista (dom-model, ajax, käyttöliittymän elementit - widgetit jne). Kummatkin - sekä jquery-ui, että jquery-mobile käyttävät perus jquery-kirjastoa ja tukevat ulkoasun teemoja jotka ovat sivustokohtaisesti räätälöitävissä.
Mobiiliversion on tarkoitus toimia myös työpöytäselaimilla, mutta sen toteutustapa poikkeaa merkittävästi jqueury-ui mallista teknisesti. Mobiilissa eri sivut rakennetaan samaan tiedostoon eri lohkoihin ja ladataan kerralla päätelaitteeseen ja sivunvaihdot tapahtuvat mobiilikirjaston suorittamana. Olemassaolevan sivuston muuttaminen mobiilikirjastolla toteutetuksi todennäköisesti vaatisi työlästä uudelleenorganisointia toteutustasolla edellä mainitussa lohkorakenteissa kuin sen toimintatavan eroavaisuuksissa ja siten sen toteuttamista suositellaan aloittamaan tyhjästä käyttämättä vanhaa, esimerkiksi jquery-ui sivustoa. Eroista vaadittava osaaminen vaatii myös toteuttajalta omaksumista tai kokonaan siihen perehtyneitä henkilöitä.
Mobiilikirjastolla tehdyt käyttöliittymät tuntuvat työpöydällä kärsivän mobiililaitteille tyypillisestä elemettien koko ruudun/selaimen leveydestä mikä ei toimi työpöydällä - siitäkin huolimatta, että tätä on pyritty huomioimaan kirjastossa. Ulkoasun poikkeavuudet ja edellä mainitut toteutustavan eroavaisuuksista johtuen näyttäisikin, että markkinoilla olevat saitit käyttävät mobiilikirjastoa ainoastaan mobiililaitteiden tukemiseen ja sivut ovat omassa m.example.com urlissa (m dot site). Lupaus yhtenäisestä teknisestä alustasta ei ole ainakaan vielä lyönyt itseään läpi. Tämä taas johtaa kahden eri järjestelmän ylläpitoon ja niiden kustannuksiin.
Mobiiliwebin vaihtoehto on toteuttaa palvelu työpöydälle optimoituna webinä ja mobiililaitteille tehdyllä mobiilisovelluksella.
- demos.jquerymobile.com esimerkkejä mobiilin käyttöliittymäelementeistä
- demos.jquerymobile.com - RWD responsive web design, päätelaitteisiin mukautuva toteutus
Dojo mobile dojotoolkit.org
JQ.Mobi jqmobi.com
Sencha Touch sencha.com - touch
AngularJS angularjs.org.
React reactjs.com.
MEAN (mean.io)
Visuaalisia kirjastoja
datatables (datatables.net) on suosittu taulukirjasto. fancytree (github.com - fancytree) ja jstree (jstree.com) esittävät hierarkian. d3js (d3js.org) soveltuu laajojen tietomassojen visualisointiin. grafana.org aikasarjojen grafiikkakirjasto.
http://www.chartjs.org/ kuusi erillaista kuvaajatyyppiä, HTML5, avoin lisenssi,
https://www.highcharts.com näyttäviä kuvaaji ja karttoja, kaupallinen kirjasto.
Grafana (grafana.com) kysely, visualisointi ja hälytyksiä tukeva javascript kirjasto. Sisäänrakennettu Graphite-kyselyparseri.
ThreeJS (threejs.org, en.wikipedia.org) kirjasto animoituun 3D-visualisointiin.
http://arborjs.org/ verkkojen visualisointikirjasto
