Cytoscape.js: grafici con JavaScript

Cytoscape.js, successore di Cytoscape Web, è un'implementazione open source della "teoria dei grafi" scritta sotto forma di libreria JavaScript, creata al Donnelly Centre della University of Toronto. E' possibile utilizzate Cytoscape.js per la visualizzazione e l'analisi dei grafici, la libreria supporta sia la modalità di display dei dati che quella di manipolazione, attive anche su grafici molto ricchi di informazioni ed interattivi.

Dato che Cytoscape.js consente una doppia interazione tra utente e grafico (che si interfaccia al precedente tramite hooking sugli eventi), si integra perfettamente sia nei browser desktop, sia sui dispositivi mobile, supportando tutte le feature oggi disponibili: pinch-to-zoom, box selection, panning e cosi via.

Come anticipato, Cytoscape.js è scritta avvalendosi della teoria dei grafi, dunque offre funzionalità adeguate a questa implementazione, ed è integrabile con Node.js per la produzione di analisi di grafici sul server.

Vediamo alcune delle sue caratteristiche principali:

• è scritta in puro Vanilla Javascript, non ha dipendenze;
• è rilasciata sotto licenza MIT-style;
• è compatibile con tutti i maggiori browser odierni (richiesto il supporto a Canvas ed ECMAScript);
• è compatibile ed integrabile con una moltitudine di altri applicativi come jQuery, Common.js, AMD/Require.js, Bower, npm, Meteor/Atmosphere ed R via Cyjs;
• supporta il rendering di grafici da Node.js con Cytosnap;
• possiede una suite completa per gli unit test che può essere implementata nel browser;
• è serializzabile e de-serializzabile via JSON;
• supporta i selettori per le query ed i filtri sui grafici;
• utilizza i layout per il posizionamento automatico e manuale dei nodi;
• utilizza i fogli di stile per la separazione dei contenuti tra dati e grafica;
• supporta i pattern per il functional programming;
• supporta i touch events;
• include gli algoritmi della teoria dei grafici, da BFS a PageRank;
• è estensibile e customizzabile.

Direttamente nella pagina ufficiale del progetto, oltre ad una documentazione dettagliata su tutte le funzionalità offerte dalla libreria, troviamo anche un'ampia collezione di demo, che mostrano una moltitudine di situazioni in cui Cytoscape.js può essere implementata, come ad esempio per mostrare le linee ferroviarie di Tokyo.

Via Cytoscape.js