Dati, dati, dati!

Sfruttare le potenzialità delle XPages
con Google Chart Tools

Fabrizio Marchesano
Selesoft Consulting ...
Fabrizio Marchesano
• Senior Software Developer, Genova
• Io & Domino:
•
•
•
•
•
•

IBM Certified Associate Application De...
Nelle prossime slides...
• XPages, grafici, Google Chart Tools: i perchè di una
sessione
• Studi preparatori
• Soluzioni s...
Perchè una sessione su XPages e
grafici interattivi
• Strumenti in grado di fornire una rappresentazione visiva di una
ser...
Perchè Google Chart Tools
• PRO: gratuiti, funzionali, moderni, ben documentati, altamente
personalizzabili, interattivi, ...
Google Chart Api: un'analisi
<html>
  <head>
    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://...
Ritorno al Client
• A partire dalla versione 8.5.3 di Domino/Notes, è stata
introdotta per le XPages la funzione view.post...
Anatomia di una soluzione
• L'esigenza: elaborare in modalità grafica una mole relativamente
ristretta di dati (i.e. tale ...
DEMO 1: Gruppi e Colonne
DEMO 2: selezione dinamica
e Colonne
DEMO 3: interattività, Torte
e Colonne
DEMO 4: Mappe e Drill-down
Conclusioni
• Domino & XPages: integrare grafici funzionali e dinamici nelle
proprie applicazioni web cross-browser e cros...
Problema
• Trovare il diametro della circonferenza di centro X
sapendo che il segmento BC misura 25 cm e il segmento
AB mi...
Soluzione
• Di fatto, si chiedeva di calcolare il diametro di una circonferenza,
noto il raggio...
• ... ma è probabile ch...
Questions?
Grazie per l'attenzione!

Contatti: fabrizio.marchesano@selesoft.it
Grazie agli sponsor per aver reso possibile i
Dominopoint Days 2013!
Main Sponsor
Vad sponsor
Platinum sponsor

Gold spons...
Upcoming SlideShare
Loading in …5
×

Dati, dati, dati! - Sfruttare le potenzialità delle XPages con Google Chart Tools, #dd13

1,040 views

Published on

Un'immagine, si sa, vale più di mille parole, e a maggior ragione anche più di mille numeri: la rappresentazione visiva di una serie di cifre è la strada più rapida per identificare a colpo d'occhio le situazioni che necessitano di una più approfondita analisi di dettaglio.
Strumenti come Google Chart Tools rendono possibile l'integrazione di grafici funzionali e moderni nelle proprie applicazioni web, e quando queste ultime sono realizzate sfruttando le potenzialità di Domino e la flessibilità delle XPages si può davvero parlare di felice unione tra esperienza produttiva e dinamica per l'utente e sviluppo rapido per il programmatore.
In questa sessione analizzeremo insieme, con demo alla mano, diversi esempi pratici applicabili anche in contesto mobile, senza dimenticare l'importanza fondamentale di una selezione ragionata dei dati da elaborare.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,040
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Dati, dati, dati! - Sfruttare le potenzialità delle XPages con Google Chart Tools, #dd13

  1. 1. Dati, dati, dati! Sfruttare le potenzialità delle XPages con Google Chart Tools Fabrizio Marchesano Selesoft Consulting - Softeco Sismat
  2. 2. Fabrizio Marchesano • Senior Software Developer, Genova • Io & Domino: • • • • • • IBM Certified Associate Application Developer IBM Certified Solution Developer IBM Champion 2011/2012 Co-autore Redbooks® Wiki Relatore a Lotusphere Fiero appartenente alla comunità Dominopoint • http://www.selesoft.it/ • http://www.softeco.it/
  3. 3. Nelle prossime slides... • XPages, grafici, Google Chart Tools: i perchè di una sessione • Studi preparatori • Soluzioni su misura per le XPages • Demo, demo, demo e ancora demo • Considerazioni finali • Postilla
  4. 4. Perchè una sessione su XPages e grafici interattivi • Strumenti in grado di fornire una rappresentazione visiva di una serie di dati costituiscono una risorsa preziosa per l'analisi propedeutica ai processi decisionali • Nel mondo Web 2.0, avere a disposizione nelle proprie pagine web grafici dinamici, aggiornati in tempo reale, interattivi, accessibili anche da smartphone e tablet è un traguardo comprensibilmente ambito • Le consolidate potenzialità di Domino e la flessibilità delle XPages coniugano un'esperienza produttiva e dinamica per l'utente con lo sviluppo rapido per il programmatore... • ...e la semplicità è un valore aggiunto al conseguimento di un risultato importante!
  5. 5. Perchè Google Chart Tools • PRO: gratuiti, funzionali, moderni, ben documentati, altamente personalizzabili, interattivi, HTML5/SVG, compatibilità crossbrowser, portabilità cross-platform (Android, iPhone, iPad), semplicità di utilizzo, ampia varietà (https://developers.google.com/chart/) • CONTRO: non utilizzabili in modalità off-line (https://developers.google.com/chart/interactive/faq#offline) • Riassumendo: uno strumento agile e facilmente accessibile a tutti per uno studio delle risorse a disposizione di noi sviluppatori Domino per l'integrazione agile di grafici dinamici nelle XPages (alternative: Dojo Charting, Highcharts JS, amCharts e altri ancora)
  6. 6. Google Chart Api: un'analisi <html>   <head>     <!--Load the AJAX API-->     <script type="text/javascript" src="https://www.google.com/jsapi"></script>     <script type="text/javascript">       // Load the Visualization API and the piechart package.       google.load('visualization', '1.0', {'packages':['corechart']});       // Set a callback to run when the Google Visualization API is loaded.       google.setOnLoadCallback(drawChart); caricamento API AJAX caricamento API “Visualization” e package “corechart”       // Callback that creates and populates a data table,       // instantiates the pie chart, passes in the data and draws it.       function drawChart() { preparazione dati in formato DataTable         // Create the data table.         var data = new google.visualization.DataTable();         data.addColumn('string', 'Topping');         data.addColumn('number', 'Slices');         data.addRows([ ['Mushrooms', 3], ['Onions', 1], ['Olives', 1], ['Zucchini', 1], ['Pepperoni', 2] ]);         // Set chart options         var options = {'title':'How Much Pizza I Ate Last Night', 'width':400, 'height':300};         // Instantiate and draw our chart, passing in some options.         var chart = new google.visualization.PieChart(document.getElementById('chart_div'));         chart.draw(data, options);       }     </script>   </head>   <body>     <!--Div that will hold the pie chart-->     <div id="chart_div"></div>   </body> </html> <div> contenitore opzioni grafico selezione tipo e creazione grafico
  7. 7. Ritorno al Client • A partire dalla versione 8.5.3 di Domino/Notes, è stata introdotta per le XPages la funzione view.postScript(<client script>) , che consente di generare uno script lato client durante l'esecuzione di un evento lato server • Il parametro <client script> è una stringa di comando che viene passata al client e qui eseguita • Esempio: var myAlert="alert('PostScript test')"; view.postScript(myAlert); • In altre parole, è possibile eseguire uno script lato server per generare informazioni da passare come argomenti stringa a una funzione da eseguire sul client
  8. 8. Anatomia di una soluzione • L'esigenza: elaborare in modalità grafica una mole relativamente ristretta di dati (i.e. tale da non rendere necessario l'utilizzo di software dedicati in grado di gestire tabelle con centinaia di migliaia di righe e cubi OLAP multidimensionali) • Applicazioni Domino - prerequisiti: – viste categorizzate con totali di colonna – documenti di configurazione per parametri opzioni – librerie Javascript per chiamate a funzioni Google Chart Tools • Applicazioni Domino - XPages: – <div> di supporto – script server-side (con funzioni @DbColumn, @DbLookup, view.postScript()) – eventuali controlli per interazione dinamica utente
  9. 9. DEMO 1: Gruppi e Colonne
  10. 10. DEMO 2: selezione dinamica e Colonne
  11. 11. DEMO 3: interattività, Torte e Colonne
  12. 12. DEMO 4: Mappe e Drill-down
  13. 13. Conclusioni • Domino & XPages: integrare grafici funzionali e dinamici nelle proprie applicazioni web cross-browser e cross-platform non è mai stato così semplice • Infinite possibilità: creazione di applicazioni centralizzate per condivisione librerie Javascript o script server side - elaborazione di grafici combinando dati sorgenti da applicazioni diverse creazione controlli XPages per gestione filtri in tempo reale e drill-down multipli - opzioni personalizzate per utente • E la sicurezza dei dati? Nessun problema, è già implicita nella gestione dei diritti e livelli di accesso e ruoli di Domino • La strada per giungere a decisioni importanti partendo da un insieme di dati distinti è tracciata, ed è agevole da percorrere • Pronti a iniziare il cammino?
  14. 14. Problema • Trovare il diametro della circonferenza di centro X sapendo che il segmento BC misura 25 cm e il segmento AB misura 10 cm X B 25 cm 10 cm C A
  15. 15. Soluzione • Di fatto, si chiedeva di calcolare il diametro di una circonferenza, noto il raggio... • ... ma è probabile che il dato inutile relativo al segmento AB vi abbia inizialmente fuorviato, conducendovi per qualche istante in una strada senza uscita • Avere troppi dati può rappresentare una condizione a rischio tanto quanto non averne • Una selezione ragionata dei dati da elaborare è un prerequisito fondamentale per un corretto utilizzo di strumenti come Google Chart Tools
  16. 16. Questions?
  17. 17. Grazie per l'attenzione! Contatti: fabrizio.marchesano@selesoft.it
  18. 18. Grazie agli sponsor per aver reso possibile i Dominopoint Days 2013! Main Sponsor Vad sponsor Platinum sponsor Gold sponsor

×