APLICACI ´
ON WEB Y ESTUDIO DE
SISTEMAS DE VISUALIZACI ´
ON PARA UN
SISTEMA DE PREDICCI ´
ON DE CRISIS EN
EL TRASTORNO DE BIPOLARIDAD
Da id Pe˜nas G´omez
DOBLE GRADO EN INGENIER´
IA INFORM´
ATICA - MATEM´
ATICAS
FACULTAD DE INFORM´
ATICA
UNIVERSIDAD COMPLUTENSE DE MADRID
TRABAJO DE FIN DE GRADO
Cu so 2015/2016
Di ec o : Ma ´ıa Vic o ia L´opez L´opez
Codi ec o : Guadalupe Mi˜nana Rope o
APLICACI ´
ON WEB Y ESTUDIO DE
SISTEMAS DE VISUALIZACI ´
ON PARA UN
SISTEMA DE PREDICCI ´
ON DE CRISIS EN
EL TRASTORNO DE BIPOLARIDAD
Da id Pe˜nas G´omez
Depa amen o de A qui ec u a de Compu ado es y Au om´a ica
Facul ad de In o m´a ica
Uni e sidad Complu ense de Mad id
´
Indice gene al
Resumen ......................................... V
Abs ac ......................................... VII
1. In oducci´on ..................................... 1
1.1. bip4cas ..................................... 2
1.1.1. La p edicci´on .............................. 3
1.2. Requisi os .................................... 4
1.3. E apas de desa ollo y plan de abajo .................... 6
1.4. O ganizaci´on de la memo ia .......................... 8
2. Es ado del a e .................................... 9
2.1. Visualizaci´on de da os en medicina y biolog´ıa ................ 9
2.1.1. D3.js ................................... 9
2.1.2. Tableau ................................. 11
2.1.3. Ca oDB ................................ 11
2.1.4. La isualizaci´on de da os en R .................... 11
2.2. A qui ec u as h´ıb idas ba ch-p ocessing s eaming ............. 12
2.2.1. A qui ec u a-λ............................. 13
2.2.2. A qui ec u a-κ............................. 16
3. Se icio web ..................................... 19
3.1. Obje i o ..................................... 19
3.2. Tecnolog´ıas del lado del se ido usadas ................... 20
3.2.1. Node.js ................................. 21
3.2.2. Exp ess.js ................................ 21
3.2.3. MongoDB ................................ 22
3.2.4. Handleba s ............................... 22
3.3. Tecnolog´ıas del lado del clien e usadas .................... 23
3.3.1. jQue y .................................. 23
3.3.2. Boo s ap ................................ 24
3.3.3. Dimple.js ................................ 24
3.4. La aplicaci´on .................................. 24
3.4.1. Al a de pacien es ............................ 25
3.4.2. Resul ados de la b´usqueda ....................... 27
3.4.3. El pe il del pacien e .......................... 28
3.4.4. Visualizaci´on .............................. 35
i

´
Indice gene al
4. Implemen aci´on ................................... 37
4.1. A qui ec u a .................................. 37
4.2. El se ido ................................... 37
4.2.1. La API ................................. 40
4.2.2. ools.js .................................. 41
4.3. La base de da os ................................ 42
4.3.1. Colecci´on pheno ypes ......................... 42
4.3.2. Colecci´on commen s .......................... 43
4.3.3. Colecci´on eco ds ........................... 43
4.4. Las plan illas Handleba s ........................... 44
4.5. En el lado del clien e .............................. 44
4.5.1. Los sc ip s en las is as ........................ 45
4.5.2. He amien as auxilia es ........................ 47
5. Resul ados de isualizaci´on ............................. 49
5.1. Dis ibuci´on ................................... 49
5.2. His og amas ................................... 51
5.3. Mapa de calo .................................. 52
5.4. Gene ando da os ................................ 53
5.5. Gene aci´on de n´ume os alea o ios ....................... 56
5.5.1. M´e odo de Box-Mulle ......................... 57
5.5.2. M´e odo de Ma saglia .......................... 57
6. Conclusiones y abajo u u o ........................... 59
Glosa io .......................................... 63
Bibliog a ´ıa ........................................ 65
ii
´
Indice de igu as
1.1. Esquema de la a qui ec u a de la pla a o ma. ................ 3
1.2. Imagenes del p o o ipo. ............................ 7
2.1. Ejemplo de diag ama ealizado con D3.js. .................. 10
2.2. Diag ama de la a qui ec u a lambda. ..................... 15
2.3. Esquema de la a qui ec u a kappa. ...................... 17
3.1. P oceso de ende izado de HTML con Handleba s. ............. 23
3.2. Dise˜no esponsi e de la aplicaci´on. ...................... 25
3.3. Vis a p incipal del dashboa d. ......................... 26
3.4. Vis a del al a de pacien e - 1. ......................... 26
3.5. Vis a del al a de pacien e - 2. ......................... 27
3.6. Resul ados pa a la b´usqueda “jai”. ...................... 28
3.7. Ven ana p incipal del pacien e. ........................ 29
3.8. Modal desplegado pa a edi a un pacien e. .................. 29
3.9. Mensaje de con i maci´on as edi a los da os del pacien e. ......... 30
3.10. Modal pa a la eliminaci´on del pacien e. .................... 30
3.11. Vis a de la pan alla de ece as. ........................ 31
3.12. Modal pa a edi a la in o maci´on de una ece a. ............... 32
3.13. Vis a de la pan alla de comunicaciones. ................... 33
3.14. Vis a p incipal de la en ana de es . ..................... 33
3.15. La ayuda apa ece en la pa e de echa de la pan alla. ............ 34
3.16. Modal pa a la b´usqueda de pacien es. .................... 35
4.1. ´
A bol de di ec o ios del p oyec o. ....................... 38
4.2. A qui ec u a de la aplicaci´on web bip4cas .................. 39
5.1. Vis a p incipal de la isualizaci´on. ...................... 50
5.2. Subg ´a ica ob enida median e in e acci´on. .................. 50
5.3. Da os del p ime pacien e. ........................... 51
5.4. His og ama co espondien e a los ansiol´ı icos. ................ 52
5.5. Mapa de calo de an idep esi os. ....................... 52
5.6. G ´a ica Dis ibuci´on usando da os gene ados alea o iamen e. ....... 55
5.7. Mapa de calo pa a ansiol´ı icos usando da os gene ados alea o iamen e. . 55
5.8. His og ama pa a ansiol´ı icos gene ado alea o iamen e. ........... 56
iii
Resumen
Las ecnolog´ıas elacionadas con el an´alisis de da os masi os es ´an empezando a e-
oluciona nues a o ma de i i , nos demos cuen a de ello o no. Desde las g andes
compa˜n´ıas, que u ilizan big da a pa a la mejo a de sus esul ados, has a nues os el´e o-
nos, que lo usan pa a medi nues a ac i idad ´ısica. La medicina no es ajena a es a
ecnolog´ıa, que puede u iliza la pa a mejo a los diagn´os icos y es ablece planes de
seguimien o pe sonalizados a los pacien es.
En pa icula , el as o no bipola equie e de a enci´on cons an e po pa e de los p o-
esionales m´edicos. Con el obje i o de con ibui a es a labo , se p esen a una pla a o ma,
denominada bip4cas , que p e ende p edeci con an elaci´on las c isis de es os en e mos.
Uno de sus componen es es una aplicaci´on web c eada pa a ealiza el seguimien o a los
pacien es y ep en a g ´a icamen e los da os de que se dispone con el obje i o de que el
m´edico sea capaz de e alua el es ado del pacien e, analizando el iesgo de eca´ıda.
Adem´as, se es udian las di e en es isualizaciones implemen adas en la aplicaci´on con
el obje i o de comp oba si se adap an co ec amen e a los obje i os que se p enden-
den alcanza con ellas. Pa a ello, gene a emos da os alea o ios y ep esen a emos es os
g ´a icamen e, examinando las posibles conclusiones que de ellos pudie an ex ae se.
Palab as cla e: big da a, isualizaci´on de da os, as o no bipola , aplicaci´on web,
ja asc ip , node.js, D3.js.
1 In oducci´on
con la aplicaci´on m´o il, aunque ambi´en pod ´ıan a˜nadi se o os da os ecogidos del
el´e ono m´o il que indiquen ac i idad ´ısica o agi aci´on, como pueden se consumo de
da os m´o iles, minu os de con e saci´on, ac i idad en edes sociales, e c. O os aspec os
a conside a de ca a a adap a lo mejo posible el modelo a cada pacien e son:
A ance y e oceso de la ase de sue˜no.
Al e aciones en el anscu so del sue˜no.
Sies as y iempo o al de sue˜no.
Ac i idad en momen os cla e: despe a es p ecoces, ac i idad noc u na y ma inal,
e c.
1.2. Requisi os
Pa a el dise˜no de la pla a o ma, hemos es ado aseso ados en el e eno m´edico po el
D . Diego U gel´es, m´edico psiquia a del Hospi al Nues a Se˜no a de la Paz de la O den
Hospi ala ia San Juan de Dios. Adem´as de como aseso m´edico, ha eje cido el cl´asico
ol del clien e de un p oyec o ´ıpico de desa ollo de so wa e, es ableciendo equisi os y
uncionalidades que la pla a o ma debe posee .
El obje i o de la pla a o ma es p edeci c isis en en e mos con as o no bipola . Pa a
ello es imp escindible con ola a ios aspec os del a amien o del pacien e, que ac ´uan
como a iables de un modelo p edic i o.
Los da os eno ´ıpicos
Los da os eno ´ıpicos son los da os que cons i uyen la base pa a la p edicci´on de
las a iables deseadas y que no cambian demasiado a lo la go del iempo (pe o que es
imp escindible conoce ). Nos e e imos m´as conc e amen e a:
Da os pe sonales Nomb e comple o, echa de nacimien o y sexo.
Co eo elec ´onico
Con i encia Indica con qui´en eside el pacien e de o ma habi ual. Puede se una de las
siguien es opciones
Solo.
Pa eja.
Pa eja e hijos.
Familia de o igen, es deci , pad es, he manos, e c.
O os.
Diagn´os ico Especi ica el diagn´os ico del pacien e siguiendo la clasi icaci´on CIE-10.
Edad de inicio de los s´ın omas
Sensibilidades Indica si el pacien e es sensible o al´e gico a li io, alp oa o o ca bamace-
pina.
4

1.2 Requisi os
Es acionalidad Indica si el pacien e posee es acionalidad, es deci , su e c isis en ´epocas
conc e as del a˜no de o ma ecuen e o pe i´odica.
S´ın omas psic´o icos Indica si el pacien e su e de s´ın omas psic´o icos.
Media de c isis Especi ica el n´ume o medio de c isis man´ıacas o mix as po a˜no. Se
oma como e e encia el a˜no comple o an e io .
Pe ´ıodo lib e N´ume o de meses que el pacien e es ´a lib e de s´ın omas al a˜no.
O os Se deja un campo pa a que el m´edico pueda inco po a o a in o maci´on que
conside a e ele an e deja plasmada.
Las ece as
Las ece as modi ican el compo amien o del pacien e y son enidas en cuen a en el
modelo p edic i o. Una ece a en la aplicaci´on web bip4cas cons a de:
Nomb e Nomb e del medicamen o, o p incipio ac i o.
Tipo Tipolog´ıa del medicamen o. Puede se uno de los siguien es:
Li io.
An iepil´ep icos.
An ipsic´o icos.
Ansiol´ı icos/hipn´o icos.
An idep esi os.
O os.
Dosis En milig amos.
Ho a Ho a de oma.
Comienzo y inal Fechas de comienzo y inal de la ece a. Es posible deja una ece a
sin inal (po ejemplo pa a medicaci´on habi ual).
T´ı ulo y ex o Desc ipci´on (b e e y m´as amplia, espec i amen e) de la oma. Puede
con ene , po ejemplo, ins ucciones o indicaciones a ene en cuen a an es de
consumi el ´a maco.
Los mensajes
La pla a o ma bip4cas ambi´en incluye un sis ema de comunicaci´on con el pacien e.
El m´edico puede esc ibi mensajes di ec amen e a la aplicaci´on m´o il del pacien e a
a ´es de es a pes a˜na. Es os mensajes son gua dados en la base de da os desde donde
pueden se consul ados po el pacien e.
Tienen una es uc u a simila a las ece as:
Comienzo y inal Fechas de comienzo y inal del mensaje, si se desea que ´es e se en ´ıe
de o ma pe i´odica en el pe iodo de iempo indicado. En caso con a io, el mensaje
se en ia ´a el d´ıa seleccionado.
Ho a Ho a a la que el mensaje se desea en ia . Puede escoge se la opci´on de en ia a la
ho a ac ual.
5
1 In oducci´on
Tex o Cue po del mensaje.
Los es
T adicionalmen e el es ado del pacien e se conoce con uno de los m´e odos m´as usuales
de la psiquia ´ıa, los es . En nues o caso no abandonamos el uso de los mismos, sino
que los u ilizamos pa a alimen a el modelo de p edicci´on, y adem´as, es el esul ado de
es os es lo que se p e ende p edeci con el uso de bip4cas .
Dada la impo ancia de es os es den o del p oyec o, con iene explica muy b e e-
men e en qu´e consis e cada uno de ellos.
Escala de E aluaci´on de la Ac i idad Global (EEAG) . Escala num´e ica (0-100) u ili-
zada pa a alo a subje i amen e el desempe˜no social, labo al y psicol´ogico. Es a
alo aci´on es independien e de al e aciones ´ısicas o ambien ales [Wikipedia con-
ibu o s,2016a].
Hamil on Dep ession Ra ing Scale (HDRS) . Cues iona io m´ul iple u ilizado pa a a-
lo a aspec os de los es ados dep esi os [Wikipedia con ibu o s,2016b], como
puede se es ado an´ımico, sen imien o de culpabilidad, pensamien os suicidas, in-
somnio, agi aci´on, ansiedad o p´e dida de peso.
Young Mania Ra ing Scale (YMRS) . Escala de 11 ´ı ems des inada a la medici´on de
la in ensidad de los s´ın omas man´ıacos, basada en una en e is a co a que al igual
que la HDRS iene en cuen a los comen a ios subje i os del en e is ado adem´as de
la obse aci´on del e aluado [To en ,2011]. Se a a de alo a aspec os in luyen es
en los es ados man´ıacos como la eu o ia o la hipe ac i idad, el deseo sexual, la
i i abilidad, la exp esi´on e bal o las conduc as ag esi as.
Posi i e and Nega i e Synd ome Scale (PANSS) . Escala m´edica usada pa a medi
la se e idad de los s´ın omas de pacien es con esquizo enia, basada en en e is-
as de al ededo de 45 minu os [Wikipedia con ibu o s,2016c]. El nomb e hace
e e encia a las escalas u ilizadas: la posi i a, que aba ca excesos de las unciones
no males (alucinaciones, hipe ac i idad); la nega i a, que aba ca de iciencias de las
unciones no males (di icul ad de pensamien o abs ac o, al a de espon aneidad)
y la gene al, que se ocupa de cues iones que no ienen que e con las an e io es
(dep esi´on, ansiedad, al a de a enci´on, deso ien aci´on).
Los es siemp e se ealizan en una echa de e minada, aunque no odos ienen po
qu´e ealiza se el mismo d´ıa.
1.3. E apas de desa ollo y plan de abajo
Como in eg an e del p oyec o pa a el desa ollo de bip4cas me ue asignada la a ea
del desa ollo de la aplicaci´on web y la isualizaci´on, obje o de la p esen e memo ia.
Debo deci que no en´ıa ning´un ipo de expe iencia p e ia con el desa ollo de aplica-
ciones web. M´as a´un, desconoc´ıa po comple o HTML y CSS (b´asico pa a hace p´aginas
es ´a icas) y po suspues o las ecnolog´ıas an o del lado de se ido que si en desde
6
1.3 E apas de desa ollo y plan de abajo
Figu a 1.2: Imagenes del p o o ipo.
pa a cap a da os de o mula ios como las del lado del clien e u ilizadas, po ejemplo,
pa a ealiza animaciones. Po lo an o el come ido de desa olla una aplicaci´on web e a
pa a m´ı un e o impo an e, pues o que no en´ıa con ac o con ninguna de las ecnolog´ıas
inalmen e u ilizadas pa a el desa ollo de es a aplicaci´on.
La p ime a ase de mi abajo consis i´o en de ini los equisi os que la aplicaci´on
deb´ıa implemen a . A con inuaci´on, elabo ´e un pa de p o o ipos con la he amien a
Jus inmind muy b´asicos con el obje i o de que el D . U gel´es los alidase, adem´as de
pa a es ablece una idea del ipo de aplicaci´on que dese´abamos. La Figu a 1.2 mues a
uno de esos p o o ipos.
Una ez ce ada la e apa de p o o ipado, pas´e a una e apa de o maci´on au odidac a
en Web y las ecnolog´ıas elacionadas. Segu´ı el cu so de la W3School1en HTML y
CSS pa a inicializa me en el desa ollo de p´aginas web. A con inuaci´on ocaba decidi
qu´e a qui ec u a implemen a . Op ´e inalmen e po u iliza Node.js jun o con Exp ess.js,
1h p://www.w3schools.com/
7
1 In oducci´on
adem´as de usa MongoDB pa a la capa de pe sis encia. Las azones de es a decisi´on
pueden en on a se en el Cap´ı ulo 3. Decididas las ecnolog´ıas a emplea , e a ho a de
ap ende a maneja las. Pa a ello esul ´o i al el lib o de E han B own Web De elopmen
wi h Node and Exp ess [B own,2014], adem´as de mucha o a documen aci´on disponible
en in e ne y en o os especializados.
Pa a la isualizaci´on me decan ´e po el cu so Da a Visualiza ion and D3.js [Udaci y,
2014] de la web de cu sos masi os online Udaci y. Ap end´ı algunos de los p incipios
subyacen es en el dise˜no de buenas isualizaciones, as´ı como lo undamen al pa a usa
la lib e ´ıa dimple.js con la que se ha elabo ado la isualizaci´on de da os de la aplicaci´on.
1.4. O ganizaci´on de la memo ia
La p esen e memo ia p e ende explica y expone el desa ollo de unla he amien a web
de la pla a o ma, de allando las ecnolog´ıas u ilizadas y el p oceso de implemen aci´on
seguido. El p oyec o comple o es ´a disponible en Gi Hub bajo licencia GPL 3.
Pa a comenza p esen an una se ie de ecnolog´ıas pun e as en es e momen o pa a la
isualizaci´on de da os que cub e g an a iedad de pla a o mas, como na egado es web,
que se ejecu an de o ma na i a en el sis ema. Se hace especial hincapi´e en las he amien-
as que el so wa e de an´alisis es ad´ıs ico Rp opo ciona, po a a se de una he amien a
de c´odigo abie o. A con inuaci´on se analizan las a qui ec u as h´ıb idas ba ch-p ocessing
s eaming en sis emas big da a, p es ando especial a enci´on a las a qui ec u as lambda
y kappa.
El Cap´ı ulo 3 p esen a la a qui ec u a del se icio web, y adem´as desc ibe las ecno-
log´ıas empleadas pa a su desa ollo. Finaliza con un eco ido po la aplicaci´on, expli-
cando y de allando sus uncionalidades. El cua o cap´ı ulo en a en de alles de imple-
men aci´on del se icio, y se analizan cada uno de los componen es u ilizados (lib e ´ıas,
m´odulos, sc ip s, e c.) an o en el se ido como en el clien e. Adem´as, se de alla la
a qui ec u a de la base de da os.
Finalmen e, se dedica un cap´ı ulo especial a la isualizaci´on de da os en la aplicaci´on
web, p esen ando las dis in as g ´a icas implemen adas. Igualmen e, se es udia la idonei-
dad de dichas ep esen aciones a a ´es de da os gene ados alea o iamen e. Una secci´on
especial abo da la eo ´ıa de ´as de la gene aci´on de n´ume os alea o ios, elacionada con
la simulaci´on es ad´ıs ica. La memo ia concluye con las conclusiones y el abajo u u o.
8
2 Es ado del a e
En e los obje i os del big da a se encuen a se i de ayuda a la oma de decisiones
en nume osos campos: la emp esa, la de ensa, la medicina, e c. La g an can idad de
da os que se ienen y que se analizan de poco si en si los esul ados que se ob ienen no
pueden in e p e a se adecuadamen e. A es o se une que en ocasiones, los esponsables
de la oma de decisiones son comple amen e ajenos al an´alisis de da os (especialmen e
de g andes ol´umenes de ellos). Po odo ello, la isualizaci´on se cons i uye en el e ce
g an pila sob e el que descansa el big da a: una buena isualizaci´on de los da os y los
esul ados ob enidos pe mi e abs ae a los esponsables de la oma de decisiones del
ipo de da os y la me odolog´ıa empleada pa a su ob enci´on y an´alsis, y adem´as o ece
es os esul ados de o ma amena y amigable.
Pa a el p ocesamien o de g andes can idades de da os con inalidades es ad´ıs icas
se han empleado adicionalmen e de o ma mayo i a ia SAS ySPSS, especialmen e
u ilizados en ciencias sociales, es udios de me cado y business in elligence. F en e a
es as dos he amien as, de ca ´ac e p i a i o, se encuen a R, de so wa e lib e que se
dis ibuye bajo licencia GNU GPL.
P opo ciona un amplio abanico de he amien as pa a el an´alsis es ´adis ico (modelos
lineales y no lineales, an´alisis de se ies empo ales, e c.) y pa a la ep esen aci´on g ´a ica
(his og amas, ep esen aci´on de secuencias de ADN,...). Adem´as, sus uncionalidades
pueden amplia se median e paque es y cuen a con una impo an e comunidad de usua ios
y desa ollado es que ga an izan la con inuidad y sopo e al p oyec o.
2.1. Visualizaci´on de da os en medicina y biolog´ıa
La g an can idad de in o maci´on que puede ansmi i se de o ma isual, jun o con el
desa ollo de in e ne en los ´ul imos a˜nos ha p opiciado que la demanda de aplicaciones
o se icios pa a ep esen a da os haya aumen ado de o ma exponencial. Es el caso del
llamado pe iodismo de da os. Ac ualmen e es a o encon a no icias en dia ios online o
publicaciones especilizadas que no ayan acompa˜nados de una in og a ´ıa, po ejemplo.
De hecho, los g upos edi o iales y los pe i´odicos son los p incipales clien es de es os
se icios, algunos de los cuales de allamos a con inuaci´on.
2.1.1. D3.js
D3 se e ie e a Da a D i en Documen s y seg´un [Zhu,2013]
9

2 Es ado del a e
Figu a 2.1: Ejemplo de diag ama ealizado con D3.js.
“D3.js es una lib e ´ıa de Ja aSc ip pa a manipula documen os basados en
da os. D3 ayuda a da ida a los da os usando HTML, Scalable Vec o G ap-
hics (SVG) yCascading S yle Shee s (CSS). El ´en asis de D3 en es ´anda es
web o ece al usua io exp imi odas las capacidades de los na egado es mo-
de nos sin necesidad de usa un amewo k p opie a io, pe mi iendo as´ı c ea
ep esen aciones g ´a icas de g an calidad de da os usando una ap oximaci´on
simple (documen os).”
En la ac ualidad, es uno de los m´e odos de ep esen aci´on m´as u ilizados debido a
los esul ados is osos y sob e odo in e ac i os que o ece. Adem´as, es a basado en
Ja aSc ip p opo ciona a D3.js una g an lexibilidad, a lo que hay que suma una e icien e
ges i´on de los da os en lo que se basan las ep esen aciones g ´a icas. De es a o ma, D3
es ex emadamen e ´apido, sopo a bien g andes conjun os de da os, compo amien os
din´amicos y animaci´on a los esul ados.
La p ensa es uno de los p incipales usua ios de D3.js, especialmen e la no eame icana,
donde los a ´ıculos de pe iodismo de da os es ´an acompa˜nados de diag amas in e ac i os
que in i an al usua io a p o undiza m´as en la no icia. En la Figu a 2.1 se mues a el
diag ama de cue da inspi ado en el acompa˜naba un a ´ıculo del New Yo k Times sob e
la c isis eu opea del eu o e ilus a la elaci´on en e la deuda sobe ana de algunos pa´ıses.
La API de D3 con iene cen ena es de unciones ag upadas en las siguien es unidades
l´ogicas
Selecciones
T ansiciones
A ays
Ma em´a icas
Colo
Escalas
SVG
Tiempo
Capas
Geog a ´ıa
Geome ´ıa
Compo amien os
10
2.1 Visualizaci´on de da os en medicina y biolog´ıa
2.1.2. Tableau
Tableau es una compa˜n´ıa ame icana con sede en Sea le que o ece una amilia de p o-
duc os de isualizaci´on g ´a ica especialmen e o ien ado a business in elligence. Ac ual-
men e desa ollan su mo o g ´a ico pa a a ios sopo es: esc i o io, pla a o mas m´o iles
y la nube. Es adem´as uno de los l´ıde es del sec o , siendo usado po compa˜n´ıas de p ime
ni el como Deloi e, P ize , Toyo a o SpaceX en e o as.
Pe mi e la c eaci´on de isualizaciones de al o ni el con an s´olo a as a los da os
y obse a cambios en iempo eal mien as nue os da os se inco po an al da ase que
es amos ep esen ando. Su uso in ui i o y sencillo lo hace ideal pa a se empleado en
en o nos ajenos al an´alisis de da os.
2.1.3. Ca oDB
Ca oDB es una pla a o ma So wa e as a Se ice especializada en la ep esen aci´on
de da os geog ´a icos sob e mapas in e ac i os. Nacida en Espa˜na, ha ob enido g an e-
pe cu si´on in e nacional y ha cosechado g an ´exi o en di e sas ondas de inanciaci´on,
llegando a cap a m´as de 30 millones de dol´a es. En e sus clien es se encuen an la Na-
ional Ae onau ics and Space Adminis a ion (NASA),Banco Bilbao Vizcaya A gen a ia
(BBVA) o Twi e .
Cuen a adem´as con una comunidad de desa ollado es y usua ios de so wa e que
despliega sus p opias ins ancias del so wa e g acias a que buena pa e de las APIs son
p´ublicas.
2.1.4. La isualizaci´on de da os en R
R es un lenguaje y en o no de p og amaci´on pa a an´alisis es ad´ıs ico y g ´a ico de c´odi-
go lib e. La isualizaci´on de da os en Res bas an e ex ensa. La ep esen aci´on puede
hace se de nume osas o mas en unci´on del ipo de da os a ep esen a . Dispone de pa-
que es pa a ep esen a da os mul i a ian es, da os ca eg´o icos, binning, ep esen aci´on
idimensional e in e ac i a, e c [Ha igsen, G egg,2014]. No s´olo es o, sino que, po
ejemplo, ambi´en se o ecen he amien as espec´ı icas pa a la ep esen aci´on de g andes
conjun os de da os (que conlle a ´ıa mucho iempo debido a la al a ca ga compu acio-
nal que supone) o pa a la c eaci´on de ´a boles que pueden se usados pa a ep esen a
dend og amas de i ados de los p ocesos de clus e ing. Me ece especial menci´on po su
amplio uso den o de la comunidad R ggplo 2, un paque e c eado po Hadley Wickham,
que apoy´andose en los paque es b´asicos (especialmen e la ice yg aphics) a a de
mejo a sus posibilidades, a endiendo especialmen e a muchos de los de alles inc´omodos
como puede se la gene aci´on de las leyendas. Apoy´andose en la g amma o g aphics,
es ´a compues a de una se ie de componen es independien es que pueden combina se de
di e en es mane as, de o ma que no son necesa ios g andes conocimien os pa a gene a
g ´a icos de g an calidad.
La in e ope abilidad de R pe mi e que la ep esen aci´on de da os pueda ealiza se con
11
2 Es ado del a e
o as he amien as dis in as de las que la p opia dis ibuci´on o ece, po ejemplo Pos S-
c ip , Po able Documen Fo ma (PDF) oSVG. O a opci´on es expo a la isualizaci´on
de da os a peque˜nas aplicaciones web que po egla gene al suelen se in e ac i as. Las
he amien as m´as popula es que u ilizan R pa a la isualizaci´on de da os son:
shiny F amewo k desa ollado po la comunidad de R [Cheng e al.,2015]. Simpli ica
eno memen e la c eaci´on de aplicaciones web in e ac i as con R. Seg´un la p opia
web del p oyec o, hace posible “cons ui boni as, sensibles y po en es aplicaciones
con un m´ınimo es ue zo”.
plo ly Es una aplicaci´on web in e ac i a desa ollada sob e la lib e ´ıa D3.js que ges iona
la ep esen aci´on g ´a ica de da os. Tiene APIs pa a abaja con R, Phy on, Ma lab
y ggplo 2 en e o os.
Ac ualmen e Rp opo ciona, a a ´es de nume osos paque es (lis ados odos ellos en
el CRAN Task View Medicine Image), sopo e pa a da os e im´agenes e e idos a isua-
lizaci´on m´edica. Po ejemplo
Im´agenes po esonancia magn´e ica.
Posi on Emission Tomog aphy (PET).
Elec oence alog a ´ıa.
lo cual pe mi e u iliza R pa a el an´alisis de la imagen m´edica. Fue a de es e campo
conc e o de la medicina, la mayo pa e de los da os m´edicos con que se abaja son
da os cuan i a i os en e al iempo, es o es, son en esencia se ies empo ales.
2.2. A qui ec u as h´ıb idas ba ch-p ocessing s eaming
Jun o con la isualizaci´on, el p ocesamien o de da os cons i uye o o de los pila es
undamen ales del big da a. El p ocesamien o debe i en ocado siemp e a sa is ace las
consul as de los da os en el meno iempo posible, pe o debido al g an olumen de da os
que se maneja es o a eces no es posible. Adem´as, o o de los obje i os p incipales de las
ecnolog´ıas big da a es el p ocesamien o de ingen es can idades de da os que se ecogen
en iempo eal. De es a o ma, exis en a ios pa adigmas pa a el p ocesamien o de da os:
P ocesamien o ba ch El p ocesamien o secuencial de da os po lo es ha sido la o ma
adicional de p ocesa da os, y las ecnolog´ıas big da a la han he edado, adap a-
da, y si e pe ec amen e al p oblema del olumen de da os a analiza . Po o o
lado, es una ecnolog´ıa madu a ´acilmen e escalable. P esen a a ios incon enien-
es: se cen a en el p ocesamien o de da os es ´a icos y iene una al a la encia. La
he amien a es ella del p ocesamien o dis ibuido es Hadoop, pues o que engloba
an o el almacenamien o de da os dis ibuido como su p ocesamien o u ilizando
MapReduce. A pa i de ´el se han ido desa ollado amewo ks que abajan sob e
´el, como pueden se Pig, Cascading. Po o o lado, se encuen a Spa k, que no u i-
liza MapReduce pa a el p ocesamien o de da os aunque s´ı ealiza p ocesamien o
ba ch.
12
2.2 A qui ec u as h´ıb idas ba ch-p ocessing s eaming
P ocesamien o en s eaming El p ocesamien o de da os en iempo eal es id´oneo pa a
un p ocesamien o ´apido de lujos de da os ilimi ados y con inuos (a di e encia
de los p ocesamien os ba ch que es aban especializados en da os es ´a icos). Se
p opo ciona de es a mane a una baja la encia y una al a ole ancia a allos, pe o po
con aposici´on la escalabilidad a´un no es ´a lo su icien emen e asegu ada. Ejemplos
de implemen aci´on de es as ecnolog´ıas los encon amos en S o m, Flume, T iden
y Spa k s eaming (la e si´on de Spa k pa a p ocesamien o en s eaming).
F en e a es as dos al e na i as, se alza una e ce a, uni´on de ambas. Son las llamadas
a qui ec u as h´ıb idas [Ma z and Wa en,2015], que combinan una pa e de p ocesa-
mien o ba ch y o a de p ocesamien o en s eaming, de o ma que pueden analiza se
da os es ´a icos (po ejemplo, da os his ´o icos) como da os nue os en iempo eal (da os
nue os adqui idos). Es impo an e hace no a que es as ecnolog´ıas h´ıb idas no combi-
nan ambas ecnolog´ıas en el sen ido li e al de la palab a, s´olo las “encapsulan”. Es o se
debe a lo adicalmen e dis in os que son los dos pa adigmas de p ocesamien o, lo que
hace imposible su combinaci´on.
La a qui ec u a de es as ecnolog´ıas esponde al siguien e pa ´on:
Capa ba ch Es a capa es ´a compues a po el conjun o de odos los da os (da ase p in-
cipal) y una ecnolog´ıa de p ocesamien o ba ch. Los nue os da os se inco po an al
da ase p incipal a medida que an llegando pa a su almacenamien o.
Capa s eaming El lujo de da os nue os ambi´en llega a es a capa, comple ada po una
ecnolog´ıa s eaming pa a su p ocesamien o.
Capa de combinaci´on Los esul ados de sendas capas se combinan aqu´ı y se o ecen al
usua io.
2.2.1. A qui ec u a-λ
La a qui ec u a lambda es un ipo de a qui ec u a h´ıb ida ideada po Na han Ma z
[Ma z and Wa en,2015]. La idea b´asica es es uc u a el p ocesamien o en es capas,
como se expon´ıa en la secci´on an e io . Puede e se un diag ama de la a qui ec u a en
la Figu a 2.2.
Capa ba ch
Cuando se quie e ejecu a una consul a sob e odos los da os, la can idad de iem-
po que puede demo a se esa consul a es al a. La capa ba ch se enca ga de p ep ocesa
(median e indexaci´on) los da os con enidos en el da ase p incipal. Es os da os p e-
compu ados son las denominadas is as ba ch. Son es as las que se analizan cuando se
quie e hace una consul a sob e el da ase . Las lec u as sob e las is as ba ch pueden
se alea o ias.
De es a o ma, la capa ba ch es ´a o mada po las is as ba ch c eadas y el da a-
se p incipal. Es e ipo de p ocesamien o es ideal pa a sis emas ba ch como puede se
Hadoop. Es a capa es ´a cons an emen e compu ando is as ba ch desde ce o. Adem´as,
13
3 Se icio web
es ´anda es web po pa e de los desa ollado es de na egado es web, es sumamen e
´acil desa olla pa a nume osas pla a o mas ( an o m´o iles como de sob emesa)
sin necesidad de que el desa ollado a ienda las pa icula idades de cada una de
ellas.
La madu ez de las ecnolog´ıas u ilizadas La Web de hoy en d´ıa nada iene que e
con la de hace unos a˜nos. Exis en nume osas ecnolog´ıas que pe mi en hace casi
cualquie cosa con un na egado web. En pa icula nos e e imos a:
Los mo o es Ja aSc ip : El lenguaje de sc ip ing web m´as u ilizado es sin duda
uno de los g andes esponsables del auge de las aplicaciones web. Hace que
las webs sean din´amicas y espondan an e la in e acci´on del usua io. Has a la
echa, el uso de Ja aSc ip se ha hecho mayo i a iamen e en el lado del clien e,
pe o ´ul imamen e se ha expe imen ado un auge de las implemen aciones de
Ja aSc ip en el lado del se ido .
La u ilizaci´on sencilla de amewo ks de dise˜no. La in e ope abilidad de las
aplicaciones m´o iles puede se ambi´en una de sus g andes debilidades. La
ipolog´ıa an a iada de disposi i os en los que las webs se isualizan (en
especial los di e en es ama˜nos de pan alla de dichos disposi i os) puede e-
sul a un au ´en ico queb ade o de cabeza pa a los desa ollado es, que deben
comp oba que las p´aginas web se isualizan co ec amen e en cada ipo de
disposi i o. El uso de Boo s ap hace muy sencilla la aplicaci´on de los p inci-
pios del dise˜no web adap able a las webs.
La capacidad pa a cons ui un sis ema al amen e escalable: Aunque el p o-
yec o bip4cas es ´a en una ase muy inicial, su p e ensi´on es se un sis ema
ampliamen e u ilizado. Es o equie e que la pla o ma sea ´acilmen e escalable
y es o no es sencillo con las ecnolog´ıas web adicionales (debido a p oble-
mas elacionados con la concu encia y la ges i´on de pe iciones). Po ello
se ha empleado como ecnolog´ıa subyecen e en el lado del se ido node.js,
acompa˜nado de exp ess.js pa a la ges i´on del ´a ico HTTP.
3.2. Tecnolog´ıas del lado del se ido usadas
A con inuaci´on habla emos con m´as de alle de cada una de las ecnolog´ıas u ilizadas.
Las ag upa emos en unci´on de si se emplean del lado del se ido o del lado del clien e.
T adicionalmen e se ha u ilizado el webs ack LAMP (Linux + Apache + MySQL +
PHP) como conjun o de he amien as so wa e pa a la c eaci´on de si ios y aplicaciones
web. ´
Ul imamen e se comienza a oma cie o auge MEAN (MongoDB + Exp ess.js +
Angula .js + Node.js) o alguna de sus a ian es (hay una que sus i uye Angula .js po
Embe .js como amewo k pa a las is as). Es o cons i uye una a qui ec u a Ja aSc ip
end- o-end (es deci , en odo el sis ema). En nues o caso hemos op ado po u iliza
un mo o de ende izado dis in o, Handleba s, m´as sencillo que es os dos ´ul imos y que
de allamos m´as adelan e.
20

3.2 Tecnolog´ıas del lado del se ido usadas
3.2.1. Node.js
Node.js (o simplemen e Node) es un en o no de ejecuci´on basado en e en os, con
base Ja aSc ip , en el lado del se ido , u ilizado undamen almen e en el desa ollo de
aplicaciones web. No es un amewo k Ja aSc ip o un con enedo web. Tampoco es
un se ido de aplicaciones como puede se lo JBoss o GlassFish. Las uncionalidades
de node.js pueden se expandidas a a ´es de m´odulos (m´odulos Ja aSc ip ). Pa a la
ges i´on de es os m´odulos (ins alaci´on, desins alaci´on, ac ualizaci´on, e c) node dispone
de un ges o in eg ado, npm, que en palab as de los p opios au o es [npm documen a ion,
2016]
“Es una o ma de eu iliza c´odigo de o os desa ollado es, adem´as de una
o ma de compa i u c´odigo con ellos y hace ´acil ges iona las di e en es
e siones del c´odigo.”
¿Po qu´e con Node.js es m´as sencillo c ea aplicaciones en ed escalables? Con los
sis emas adicionales, cada conexi´on se ges iona en un nue o hilo, al que el sis ema
asigna ecu sos. Pues o que los ecu sos son limi ados, a medida que c ece el n´ume o
de conexiones son necesa ios m´as ecu sos o m´as maquinas pa a a ende odas es as
pe iciones (lo que llamamos escalado ho izon al) [Abe ne hy,2011]. Node esuel e es e
p oblema de la siguien e o ma: cada conexi´on, en luga de gene a un nue o hilo, gene a
una ejecuci´on de e en o den o de Node. Es deci , s´olo exis e un ´unico hilo y adem´as el
sis ema no se bloquea pa a ope aciones de en ada/salida, que son as´ınc onas (lo cual
e i a deadlocks).
3.2.2. Exp ess.js
Exp ess.js es un amewo k web u ilizado pa a el desa ollo de aplicaciones web y
APIs, conside ado el es ´anda de ac o pa a la capa de se ido de Node.js. Se desc ibe
como [B own,2014] [Yaapa,2013]
“Un amewo k lexible y minimal pa a Node.js que p o ee de un conjun o
obus o de ca ac e ´ıs icas pa a consu ui aplicaciones web de p´agina simple
y/o mul ip´agina-h´ıb idas.”
¿Qu´e quie e deci odo es o?
Flexibilidad La lexibilidad de Exp ess iene po su buena in eg aci´on con los paque es
de node.js que comen ´abamos an e io men e adem´as de po la posibilidad de usa
middlewa es: m´e odos que se ejecu an cuando se ealizan las pe iciones.
Minimal Exp ess, eci´en desplegado, p opo ciona el conjun o b´asico de he amien as
pa a la ges i´on de pe iciones, al con a io que o os, que inco po an una g an
can idad de uncionalidad muchas eces inu ilizadas.
Aplicaciones web de p´agina simple Exp ess p opo ciona sopo e pa a la c eaci´on de
es e ipo de aplicaciones web, en las que oda la aplicaci´on se desca ga en el na e-
gado del clien e ganando as´ı elocidad en la na egaci´on pues o que as la desca ga
incial apenas exis e comunicaci´on con el se ido .
21
3 Se icio web
Aplicaciones web mul ip´agina e h´ıb idas Las aplicaciones web mul ip´agina se ace can
bas an e al concep o adicional de si io web, en el que cada p´agina se ob iene po
una pe ici´on independien e del clien e al se ido . Las aplicaciones web h´ıb idas
combinan es a ap oximaci´on como la de la aplicaci´on de p´agina simple.
3.2.3. MongoDB
MongoDB es un sis ema de base de da os NoSQL o ien ado a documen os, es deci ,
que en luga de gua da los da os en ablas (como se hace de o ma adicional) se
gua dan es uc u as simila es a JSON (m´as conc e amen e, una implemen aci´on p opia
llamada BSON).
En e sus ca ac e ´ıs icas p incipales se encue an:
De p op´osi o gene al Casi an ´apido como las bases de da os NoSQL de ipo cla e-
alo y con casi odas las uncionalidades de las elacionales.
Balanceo de ca ga Mongo se puede escala de o ma ho izon al, de o ma que el desa-
ollado de e mina c´omo se ´an dis ibuidos los da os de una colecci´on. Adem´as,
MongoDB iene la capacidad de ejecu a se en m´ul iples se ido es de o ma que
puede balancea se la ca ga y/o eplica se los da os pa a man ene el sis ema en
uncionamien o en caso de allo.
Segu idad Implemen a sis emas de au en icaci´on y au o izaci´on, as´ı como ges i´on de
usua ios (cada uno de los cuales iene dis in os pe misos).
Ejecuci´on de Ja aSc ip del lado del se ido Mongo posee la capacidad pa a ealiza
consul as usando Ja aSc ip , haciendo que es as sean en iadas di ec amen e a la
base de da os pa a se ejecu adas.
MapReduce Pe mi e u iliza MapReduce pa a el p ocesado de la in o maci´on a a ´es
de unciones Ja aSc ip que se ejecu an en los se ido es.
3.2.4. Handleba s
Handleba s es un mo o de plan illas web (web empla ing sys em). Basado en Mous-
ache (o o mo o de plan illas web), a˜nade algunas uncionalidades l´ogicas (ope ado es
i ,each,...) que pe mi en i e a sob e los da os ecibidos pa a la composici´on del do-
cumen o HTML. Muy sencillo de u iliza pues o que, a di e encia de o os mo o es de
ende izado (como Jade), man iene la sin axis o iginal HTML.
En el caso de es a aplicaci´on, se u iliza mayo i a iamen e del lado del se ido , pues o
que exp ess.js in oca al mo o de ende izado con el con ex o adecuado y ´es e en ´ıa al
na egado web clien e el documen o HTML inal.
¿C´omo unciona? Pa a ende iza comple amen e un documen o HTML, Handleba s
necesi a dos iche os: la is a y el layou . Ambos son dos iche os de ex ensi´on .handleba s
que con ienen p´aginas web o agmen os de ´es as. Con ienen “huecos” o di ec i as que
deben ellena se (con in o maci´on de un pacien e, po ejemplo). Po o o lado necesi a
22
3.3 Tecnolog´ıas del lado del clien e usadas
Figu a 3.1: P oceso de ende izado de HTML con Handleba s.
el denominado con ex o, es deci , la in o maci´on con la que Handleba s ellena esos
huecos p esen es en las plan illas o is as. P ime o el mo o ende iza las is as, (es
deci , ellena esos huecos con lo da os del con ex o que enga disponibles) y despu´es se
ende iza el layou con el esul ado de la e apa an e io , ob eni´endose as´ı un documen o
HTML comple o. En el esquema que se mues a en la Figu a 3.1 puede e se el p oceso
comple o.
3.3. Tecnolog´ıas del lado del clien e usadas
3.3.1. jQue y
jQue y es una biblio eca de Ja aSc ip que pe mi e in e ac ua y manipula documen-
os HTML a a ´es de la in e acci´on con el DOM, maneja e en os y esponde as´ı a la
in e acci´on del usua io con un si io web.
Pues o que cualquie na egado mode no ( an o de sob emesa como m´o il) es capaz
de ejecu a Ja aSc ip , jQue y unciona en cualquie pla a o ma. Adem´as, es ´a especial-
men e dise˜nado pa a supe a las di e encias en e los mo o es Ja aSc ip de los dis in os
na egado es.
23
3 Se icio web
3.3.2. Boo s ap
Boo s ap es un amewo k pa a el dise˜no de aplicaciones y si ios web, especialmen e
en ocado en dise˜no web adap able. Es ampliamen e u ilizado en nume osas p´aginas web
debido a su sencillez, la comunidad que es ´a as su desa ollo, la g an can idad de
ecu sos que hay disponibles de o ma abie a (plan illas, sc ip s,...) y sus esul ados de
apa iencia p o esional y llama i a. Sigue una iloso ´ıa de dise˜no mobile- i s , p imando el
dise˜no pa a es as pla a o mas (y desde ese dise˜no, pasa de o ma au om´a ica a dise˜nos
pa a disposi i os con mayo es esoluciones).
Incluye adem´as g an can idad de componen es lis os pa a se usados: bo ones, desple-
gables, paneles de na egaci´on, ba as de p og eso, elemen os de paginaci´on... As´ı como
elemen os din´amicos, como pueden se en anas eme gen es (llamadas modals), mensajes
de ale a, ca useles,...
3.3.3. Dimple.js
Dimple.js es un API pa a D3.js pa a la ealizaci´on de g ´a icos. El obje i o es simpli ica
la ealizaci´on de g ´a icos, e i ando la cu a de ap endizaje de D3 pa a dibuja g ´a icos
con muy poco es ue zo. Independien emen e de eso, no ocul a la implemen aci´on de
D3, de o ma que ´es e puede segui us´andose pa a complemen a posibles ca encias de
dimple.js o pa a la ealizaci´on de g ´a icos complejos que dimple.js no con empla.
Es capaz de dibuja g ´a icas de los siguien es ipos:
G ´a icos de ba as y de l´ıneas
G ´a icos a a y de anillo
Diag amas de dispe si´on y de bu buja
G ´a icos de ´a ea
Cada da ase puede se encapsulado en una se ie de dimple y cada se ie puede ep e-
sen a se g ´a icamen e de una o ma dis in a, dando luga a combinaciones en e a ios
o ma os de g ´a icos (en bip4cas se han combinado g ´a icos de ´a ea y de l´ıneas, po
ejemplo). No se limi a ´unicamen e a dibuja las g ´a icas, sino que ambi´en inco po a ele-
men os pa a anima las cuando se pin an o pa a c ea animaciones de o ma au om´a ica
(las llamadas s o yboa ds).
3.4. La aplicaci´on
La aplicaci´on se basa en el concep o de dashboa d o panel de con ol. La in e az, basa-
da en la plan illa hom´onima de Boo s ap, p o ee una in e az de dise˜no web adap able
adem´as de un dise˜no cla o, mode no y e icaz. En la Figu a 3.2 se mues a c´omo se e la
aplicaci´on en una able y un sma phone.
Cada acci´on di e enciada de la aplicaci´on es ´a ep esen ada en una is a dis in a (da
de al a pacien es, con ola la medicaci´on, isualiza los da os). Si cada acci´on di e en-
24
3.4 La aplicaci´on
Figu a 3.2: Dise˜no esponsi e de la aplicaci´on.
ciada con iene o as acciones asociadas, como po ejemplo en el caso del con ol de la
medicaci´on puede se a˜nadi o modi ica una ece a, ´es a se hace a a ´es de los modals:
peque˜nas en anas eme gen es animadas. Se ha a ado de ap o echa los ecu sos de
Boo s ap al m´aximo en a as de asegu a la mayo consis encia a la aplicaci´on, adem´as
pa a consegui un esul ado p o esional. As´ı, los mensajes de e o , ´exi o, ad e encia
o in o maci´on se ealizan a a ´es de los ale s o los iconos pe enecen a la lib e ´ıa de
glyphicons.
Las e e encias espaciales que hagamos a medida que se desc iba la aplicaci´on se
ha ´an bajo el supues o de que el disposi i o con el que se abaja iene una esoluci´on
de esc i o io (mayo de 1024 po 768 p´ıxeles).
La pan alla p incipal de la aplicaci´on es el dashboa d. Po el momen o es una p´agina
es ´a ica, pe o queda p epa ada pa a que en u u as e isiones de la aplicaci´on con enga
in o maci´on ele an e que deba se mos ada cada ez que el p o esional acceda a la
aplicaci´on.
La Figu a 3.3 mues a el dashboa d. Podemos e en la pa e supe io la ba a de
na egaci´on que se ´a isible en odo momen o, compues a de, de izquieda a de echa: el
nomb e de la aplicaci´on, enlaces al dashboa d, a la is a de isualizaci´on y a la de al a
de nue o pacien e, la ba a de b´usqueda de pacien es y el men´u de ayuda.
3.4.1. Al a de pacien es
La e ce a opci´on del men´u p incipal es el o mula io de al a de pacien es. A a ´es
de es e o mula io nue os pacien es se dan de al a en la aplicaci´on y a pa i de ese
momen o pueden empeza a se seguidos po el sis ema. Puede e se en la Figu a 3.4 y
en la Figu a 3.5 el o mula io comple o.
Los da os aqu´ı ecogidos son los denominados eno ´ıpicos (que se desc ibie on en Sec-
25

3 Se icio web
Figu a 3.3: Vis a p incipal del dashboa d.
Figu a 3.4: Vis a del al a de pacien e - 1.
26
3.4 La aplicaci´on
Figu a 3.5: Vis a del al a de pacien e - 2.
ci´on 1.2) que incluyen da os pe sonales, como edad o sexo, adem´as de aspec os ela i os
a la en e medad como la edad de inicio de los s´ın omas o el n´ume o de c isis al a˜no,
as´ı como aspec os a macol´ogicos como posibles ale gias a la medicaci´on adicional (li-
io, ca bamacepina y alp oa o).
Pa a conclui , el bo ´on pa a inaliza el p oceso de al a se habili a cuando el m´edico
a i ma que el pacien e ha dado su consen imien o esc i o pa a pa icipa en el p og ama.
Una ez que el al a se comple a, se asigna al nue o pacien e un iden i icado ´unico y sus
da os se ´an ag egados a la base de da os MongoDB.
3.4.2. Resul ados de la b´usqueda
En la ba a de na egaci´on apa ece una ba a de b´usqueda pa a los pacien es. La cadena
de ex o in oducida se i ´a pa a localiza a los pacien es po nomb e. La b´usqueda se
ealiza sob e el campo nomb e comple o del pacien e, de o ma que es capaz de localiza
nomb es que con engan o al o pa cialmen e la cadena in oducida.
Los esul ados de la b´usqueda se mues an en una nue a pan alla. Si no se han encon-
ado esul ados, un mensaje de in o maci´on lo no i ica. En la Figu a 3.6 puede e se la
is a gene ada al busca “jai” en la ba a supe io .
Jun o a los esul ados y a ´ı ulo in o ma i o, apa ecen la echa de nacimien o del
pacien e y su sexo. El nomb e del pacien e es un hipe ´ınculo al pe il m´edico que sob e
´el gua da la aplicaci´on.
27
3 Se icio web
Figu a 3.6: Resul ados pa a la b´usqueda “jai”.
3.4.3. El pe il del pacien e
Pincha en el nomb e del pacien e nos edi ige a la en ana p incipal de su pe il. A
la izquie da apa ece un nue o men´u, s´olo ac i o cuando se isi an las dis in as is as
que componen el pe il del pacien e pa a la na egaci´on en e ellas. Es e men´u la e al se
compone de: p incipal, medicaci´on, es y comunicaci´on.
P incipal
La en ana p incipal, como puede obse a se en la Figu a 3.7, mues a los da os pe -
sonales y eno ´ıpicos del pacien e, los mismos que se desc ibie on en la Subsecci´on 3.4.1.
A la de echa apa ecen sendos bo ones pa a modi ica los da os del pacien e o bien pa a
elimina los.
Si se pulsa el bo ´on “Edi a pacien e”, se despliega un modal (Figu a 3.8) que mues a
un o mula io simila al de Al a de pacien es, con los da os ac ualmen e gua dados
ellenos en cada campo. Cuando el usua io e mine de hace las modi icaciones deseadas,
puede alida los cambios. Un mensaje de con i maci´on in o ma ´a de las modi icaciones
ealizadas (Figu a 3.9).
Algo simila ocu e cuando se pulsa en el bo ´on “Elimina pacien e” (Figu a 3.10).
Es a es la o ma de da de baja un pacien e del sis ema y elimina con ´el odos los da os
que el sis ema posee (incluidos mensajes, ece as, esul ados de es ,...). Pues o que los
cambios son i e e sibles, se pide con i maci´on pa a p ocede a la eliminaci´on de ini i a.
28
3.4 La aplicaci´on
Figu a 3.7: Ven ana p incipal del pacien e.
Figu a 3.8: Modal desplegado pa a edi a un pacien e.
29

4 Implemen aci´on
Habiendo hecho un epaso gene alizado de la a qui ec u a de la pla a o ma y en lo
e e en e a las ecnolog´ıas u ilizadas pa a la cons ucci´on del se icio web, amos a
comen a en el p esen e cap´ı ulo de alles de la implemen aci´on an o en el lado del
se ido como en el lado del clien e.
La aplicaci´on web es ´a compues a de nume osos iche os y di ec o ios. El ´a bol de
di ec o ios que se p esen a en la Figu a 4.1 co esponde con la es uc u a “p´ublica” de
la aplicaci´on ( al y como se mues a en el eposi o io p´ublico de Gi Hub). Se han omi ido
algunas ca pe as i ele an es al obje o del p esen e cap´ı ulo, como el di ec o io donde se
gua dan los m´odulos de node o los logs del se icio.
4.1. A qui ec u a
Pa a el desa ollo de es a aplicaci´on web se ha op ado po una a qui ec u a basada
en es capas ( h ee- ie ):
Capa de p esen aci´on Cons i uida po el na egado web clien e. En es e caso compues a
po las dis in as is as HTML y las lib e ´ıas Ja aSc ip u ilizadas desde el p opio
na egado .
Capa de p oceso La capa de p oceso la compone el en o no de ejecuci´on Node.js acom-
pa˜nado del amewo k Exp ess.js pa a la ges i´on de las pe iciones HTTP. Adem´as,
in eg a odos los m´odulos de Node.js necesa ios. Toda la l´ogica de la aplicaci´on
es ´a con enida en es a capa.
Capa de da os La cons i uye b´asicamen e una base de da os MongoDB di idida en es
colecciones. Es a base de da os es compa ida en e el se icio web y la aplicaci´on
And oid de la pla a o ma. Pues o que el acceso eque ido po la aplicaci´on web se
educe ´unicamen e a es de las colecciones con enidas en esa base de da os, pa a
simpli ica asumi emos que la base de da os es ´a compues a ´unicamen e de las es
colecciones, a las que nos e e i emos m´as adelan e.
La Figu a 4.2 mues a un esquema de la a qui ec u a dise˜nada pa a es a aplicaci´on.
4.2. El se ido
El se ido es un se icio Node.js, al y como se dijo en la Secci´on 3.2. Sob e ´el, hay
ins alados di e sos m´odulos, siendo el m´as impo an e Exp ess. En e ec o, es la pieza
37
4 Implemen aci´on
bip4cas
lib
ools.js
models
commen s.js
pheno ype.js
eco ds.js
public
boo s ap
images
s yleshee s
empla es
pa ien selec o .handleba s
bip4cas .js
empla e.js
dimpleCha .js
iews
layou
main.handleba s
po ions
addpa ien modal.handleba s
pa ien s
main.handleba s
p esc ip ions.handleba s
eco ds.handleba s
new eco ds.handleba s
communica ion.handleba s
sea ch- esul s
pa ien -sea ch.handleba s
index.handleba s
egis e .handleba s
isualiza ion.handleba s
404.handleba s
500.handleba s
app.js
c eden ials.js
package.json
use .sysadmin
LICENSE
README.md
Figu a 4.1: ´
A bol de di ec o ios del p oyec o.
38
4.2 El se ido
Figu a 4.2: A qui ec u a de la aplicaci´on web bip4cas .
m´as impo an e del se icio pues o que es el enca gado de la ges i´on de las u as URL
(es deci , es el esponsable de ges iona el ´a ico HTTP). Cada una de las posibles
URL den o de se icio son a endidas po una unci´on den o del iche o p incipal de la
aplicaci´on, app.js, donde se ealiza una implemen aci´on de la a enci´on de la pe ici´on
median e una unci´on an´onima. De la misma o ma, el p ocesamien o de los o mula ios,
´ıa POST, se ealiza ambi´en den o de es e iche o Ja aSc ip .
Exp ess.js no es el ´unico m´odulo ins alado. Tambi´en se dispone de los siguien es, de
los que i emos de allando su come ido:
pa h Incluido en la dis ibuci´on de Node. Pe mi e ope aciones de acceso a a chi os y
di ec o ios.
se e- a icon Peque˜no middlewa e1pa a p opo ciona un a icon.
cookie-pa se O o middlewa e, en es e caso, pa a accede y pa sea cookies.
body-pa se Middlewa e pa a pa sea el cue po de una pe ici´on (obje o eq que eciben
odas las unciones que a an pe iciones). De es a o ma, cuando el manejado
de la pe ici´on HTTP se ejecu a, pueden accede se a los a ibu os de la pe ici´on
([B own,2014, pp. 57-60]). Es o es muy ´u il, po ejemplo, pa a lee los campos y
sus alo es al p ocesa un o mula io.
1Peque˜no p og ama auxilia de Node.js
39
4 Implemen aci´on
clien -sessions Pe mi e ges iona las sesiones. Las sesiones se u ilizan po el momen o
pa a el en ´ıo de mensajes al na egado clien e (po ejemplo, pa a con i ma que
una ope aci´on de edi a una ece a se ha ealizado sa is ac o iamen e).
connec Connec es el amewo k enca gado de ges iona los middlewa e que p ocesan
cada pe ici´on ( eques ) an es que el manejado de esa solici ud ac ´ue. En pa icula
se u iliza jun o con el m´odulo connec - es .
connec - es Middlewa e pa a connec pa a la implemen aci´on de una API REST. En
el caso de bip4cas u ilizado pa a la ob enci´on de da os de medicaci´on y es pa a
ep esen a en las g ´a icas de isualizaci´on.
sc ibe-js F amewo k que implemen a un sis ema de logging al que puede accede se ´ıa
web. Gua da egis os en iche os JSON, o ganizados po d´ıas y po ca ego ´ıas
indicadas po colo es seg´un el ni el de impo ancia del mensaje.
h p-au h Paque e pa a la ges i´on de au en icaci´on ´ıa HTTP. U ilizado pa a accede
al panel de con ol de los egis os de log de Sc ibe.js.
exp ess-handleba s Mo o de ende izado de Handleba s dise˜nado espec´ı icamen e pa a
Exp ess.js.
exp ess M´odulo de Exp ess.
mongoose Lib e ´ıa que p opo ciona conexi´on y acceso a una base de da os MongoDB.
M´as conc e amen e es un Objec Da a Mapping (ODM), es deci , su come ido
es hace la aducci´on de cada colecci´on a un obje o Ja aSc ip . De es a o ma,
podemos a a las dis in as colecciones de la base de da os como obje os, lo cual
simpli ica eno memen e su in e acci´on con ellas.
El iche o comienza con la ca ga de los m´odulos lis ados m´as a iba y la inicializaci´on
del sis ema de logge y de Exp ess. Despu´es se enlazan los dis in os m´odulos con la
ins ancia de Exp ess lanzada, se con igu an los di ec o ios de obje os es ´a icos (hojas de
es ilos, sc ip s, e c.). Se c ean las sesiones y se conec a a la base de da os, c e´andose
los obje os pheno ype, eco ds ycommen s, de i ados de los Schemas de moongose.
A pa i de es e momen o puede in e ac ua se con cada una de es as colecciones ´ıa
Ja aSc ip .
El siguien e bloque co esponde con la ges i´on de cada una de las u as den o de la
aplicaci´on, es deci , se implemen an las unciones que manejan cada URL solici ada al
se ido , as´ı como el p ocesamien o de los o mula ios. Despu´es, las dos unciones de la
API de ob enci´on de da os pa a dibuja las g ´a icas del apa ado de isualizaci´on. Y po
´ul imo, los colec o es (ca che s) de e o es 404 y 505.
4.2.1. La API
Se ha implemen ado una peque˜na API pa a se i da os de pacien es. Se u ilizan pa a
ob ene los da os que isualiza en las g ´a icas, pe o en un u u o pod ´ıan se i pa a
o ma con odos los da os de que se dispongan un eposi o io open da a p´ublico. De es a
o ma, cualquie a pod ´ıa ob ene los da os con enien emen e anonimizados y cons ui
40
4.2 El se ido
he amien as p opias con ellos, en iqueciendo el ecosis ema bip4cas .
Se ha u ilizado el middlewa e connec - es pa a con igu a las u as de es a API. A
modo de ejemplo, se mues a en el C´odigo 4.1 la impleme aci´on de la unci´on de la API
que si e da os de medicaci´on.
1 es .pos (’/ p esc ip ions /: pa _id ’, unc ion( eq ,
2con en , cb){ // ob ain pa _id om u l
3 a pa _id = eq.pa ams.pa _id;
4 a beginda e = ools . oDa e ( con en . beginDa e );
5 a endda e = ools . oDa e ( con en . endDa e );
6// sea ch da a in da abase
7commen s . ind ({ use _id : pa _id , p esc ip ion : ue}, unc ion(e ,
esul s){
8i (e ) e u n cb ({ e o : ’ In e nal se e e o . ’}) ;
9i ( esul s . leng h === 0)
10 cb(null , esul s);
11 else{
12 a da a = esul s . map( unc ion(p){
13 e u n{
14 beginDa e : p. da eS a ,
15 endDa e : p. da eEnd ,
16 ype : p. ype
17 }
18 });
19 // send esul s
20 cb(null , ools . c ea eP esc ip ionsJSON (da a , beginda e , endda e ));
21 }
22 });
23 });
C´odigo 4.1: Implemen aci´on de la unci´on pa a ob ene da os de medicaci´on de la API.
4.2.2. ools.js
Es e iche o auxilia con iene g an can idad de unciones u ilizadas en oda la aplica-
ci´on. Se a a en su mayo pa e de unciones pa a p ocesa los da os de los o mula ios
o pa a o ma ea da os que p o ienen de la base de da os an es de se en iados a la
plan illa.
M´as conc e amen e, p ocesa da os en gene al como pueden se echas (con i iendo
el o ma o Da e y s ings en cas ellano y ice e sa) y ho as; da os de pacien e como la
con i encia con la amilia o g´ene o; ela i os a los es como el p ocesamien o de ´es os
cuando se ag egan nue os o ice e sa (al se mos ados en pan alla pa a su consul a) y
pa a la c eaci´on de obje os JSON a pa i de los da os almacenados que se si en al API
cuando se solici an da os pa a las g ´a icas.
41

4 Implemen aci´on
4.3. La base de da os
Todos los da os que maneja la aplicaci´on web bip4cas es ´an almacenados en una base
de da os MongoDB.
La base es ´a di idida en es colecciones: pheno ype,commen s y eco ds.
4.3.1. Colecci´on pheno ypes
Es a colecci´on con iene los da os pe sonales y eno ´ıpicos de cada pacien e, as´ı co-
mo su iden i icado ( e Subsecci´on 3.4.1). Cada documen o de es a colecci´on iene los
siguien es a ibu os:
name De ipo S ing. Nomb e comple o del pacien e.
email De ipo S ing. Una di ecci´on de co eo elec ´onico ´alida.
bi hDa e De ipo Da e. Fecha de nacimien o del pacien e.
gende De ipo Boolean. Sexo del pacien e: alse si masculino, ue si emenino.
pin De ipo Numbe . Es el PIN asignado al pacien e pa a usa lo en la aplicaci´on m´o il.
cohabi a ion De ipo Numbe . Indica con qui´en i e el pacien e. Puede oma uno de
los siguien es alo es: 0 si i e solo, 1 si lo hace en pa eja, 2 si lo hace con pa eja
e hijos, 3 si lo hace con su amilia de o igen y 4 si no es ninguna de las an e io es
(o os casos).
diagnosis De ipo S ing. Di´agnos ico del pacien e en o ma o CIE-10.
diagnosisAge De ipo Numbe . Edad de inicio de los s´ın omas.
senLi De ipo Boolean. Indica si el pacien e es sensible o al´e gico al li io.
senVal De ipo Boolean. Indica si el pacien e es sensible o al´e gico al alp oa o.
senCa De ipo Boolean. Indica si el pacien e es sensible o al´e gico a la ca bamacepina.
seasonali y De ipo Boolean. Indica si el pacien e su e de es acionalidad en sus c isis.
psycSymp De ipo Boolean. Indica si el pacien e padece s´ın omas psic´o icos.
maniaC ises De ipo Numbe . Media de c isis man´ıacas al a˜no.
mixedC ises De ipo Numbe . Media de c isis m´ıx as al a˜no.
eePe iod De ipo Numbe . N´ume o de meses que el pacien e es ´a lib e de s´ın omas al
a˜no.
o he s De ipo S ing. Puede albe ga obse aciones u o a in o maci´on ele an e del
pacien e.
El a ibu o id que iden i ica al documen o (y que MongoDB gene a y asigna po de-
ec o a cada elemen o con enido en una colecci´on) se i ´a como iden i icado de pacien e
en la aplicaci´on.
42
4.3 La base de da os
4.3.2. Colecci´on commen s
Es a colecci´on iene una doble unci´on: almacena las ece as y los mensajes. Ya hemos
comen ado an e io men e que las ece as y los mensajes compa en cie a es uc u a, y
con el obje i o de e i a duplicidades y mejo a el almacenamien o, se ha decidido que
an o las ece as como los mensajes compa an colecci´on.
Los a ibu os comunes an o a ece as como a mensajes son:
use id De ipo S ing. Iden i icado de usua io al que pe enece es e documen o.
p esc ip ion De ipo Boolean. Si es ue, es e documen o es una ece a m´edica, en caso
con a io, se a a de un mensaje.
da eS a De ipo Da e. Fecha de inicio del elemen o.
da eEnd De ipo Da e. Fecha de inal del elemen o.
ime De ipo Numbe . La ho a del elemen o, ep esen ada como los minu os anscu i-
dos desde las 00:00 (po ejemplo, 901 hace e e encia a las 15:01).
ex De ipo S ing. Cue po del mensaje u obse aciones de la oma del medicamen o
en el o o caso.
Los campos p opios de las ece as son los siguien es:
name De ipo S ing. Nomb e del medicamen o o p incipio ac i o.
ype De ipo Numbe . Indica el ipo de medicamen o: 0 si es li io, 1 si es un an i-
epil´ep ico, 2 si es an ipsic´o ico, 3 si es un ansiol´ı ioco o un hipn´o ico, 4 si es un
an idep esi o o 5 si es de o a ca ego ´ıa.
dose De ipo Numbe . Dosis en milig amos del medicamen o p esc i o.
i le De ipo S ing. B e e esumen o desc ipci´on de la oma.
Puede habe ece as que no engan una echa inal, sino que es ´an p esc i as po el
m´edico has a que ´es e ealice nue os cambios. In e namen e, es as ece as end ´an po
echa inal (a ibu o da eEnd) el alo null.
De o ma simila , los mensajes pueden en ia se de o ma pe i´odica (como si uesen e-
co da o ios p og amados) en un in e alo de iempo conc e o o a una ho a de e minada.
M´as conc e amen e, si el la echa de inal es nula ( alo null) se en iende que el mensaje
se en ia ´a una ez en la echa indicada ( echa de inicio).
4.3.3. Colecci´on eco ds
Es a colecci´on almacena los esul ados de los es que el p o esional m´edico ealiza a
cada pacien e. Los a ibu os de los documen os de es a colecci´on son:
use id De ipo S ing. Iden i icado del usua io al que pe enece el es .
da e De ipo Da e. Fecha en que se ealiz´o el es .
eeag De ipo Numbe . Valo del esul ado del es EEAG.
hd s De ipo Documen . Gua da de o ma indi idualizada los esul ados de cada p e-
43
4 Implemen aci´on
gun a. Todos los campos son de ipo Numbe .
ym s De ipo Documen . Igual que el an e io , con iene los alo es de cada una de las
p egun as que o man pa e del es . Todos los campos son de ipo Numbe .
panss De ipo Documen . Con iene o os es documen os, co espondien es a cada uno
de los escalas del PANSS. Igual que los an e io es, gua da las espues as de las
p egun as de cada es . Todos los campos de cada documen o son de ipo Numbe .
La conexi´on con la base de da os y las dis in as ansacciones se ealizan a a ´es de
mongoose. Pa a ello, se dispone de es iche os, den o del di ec o io models, que con ienen
los Schemas que es ablecen la co espondencia en e la colecci´on y un obje o Ja aSc ip
con el que maneja la. Es os iche os c ean el Schema, lo asocian a su co espondien e
colecci´on de MongoDB y expo an un obje o que se ´a u ilizado en app.js, el a chi o
p incipal de la aplicaci´on.
4.4. Las plan illas Handleba s
Todas las plan illas es ´an almacenadas den o del di ec o io iews.
Las plan illas p incipales se encuen an en el p opio di ec o io. Hablamos de la de la
p´agina p incipal (index.handleba s), la de al a de pacien es ( egis e .handleba s), la de
isualizaci´on ( isualiza ion.handleba s) y las que mues an los e o es (404.handleba s y
505.handleba s espec i amen e).
Po o o lado, den o del di ec o io pa ien s se encuen an las plan illas de cada una de
las opciones del pe il de pacien e: la en ana p incipal (main.handleba s), la del con ol de
la medicaci´on (p esc ip ion.handleba s), los mensajes (comunica ion.handleba s) y los es
( eco ds.handleba s), adem´as de la is a pa a a˜nadi nue os es (new eco d.handleba s).
El di ec o io layou con iene el iche o main.handleba s, que es el layou p incipal. Es a
es la plan illa com´un a odas las is as se idas, y es donde los agmen os HTML
del es o de plan illas se inc us an. Como al, es el iche o que m´as se pa ece a un
HTML inal, po lo que incluye la decla aci´on HTML y el encabezado de la misma y los
dis in os sc ip s (D3.js, jQue y,...) y iche os CSS necesa ios. Den o del ag body es ´an
los elemen os isibles de las is as, como la ba a de na egaci´on y el men´u de pe il de
pacien e (cuando es e apa ece), adem´as del con aine que incluye la pa e p incipal de
cada is a. Se incluye en la pa e inal un helpe pa a que cada plan illa pueda inclui
un bloque de sc ip s si es necesa io.
4.5. En el lado del clien e
El abajo de implemen aci´on en el lado del clien e descansa undamen almen e en: la
c eaci´on de las plan illas pa a cada una de las is as, que ya hemos comen ado an e io -
men e y el sc ip ing con Ja aSc ip y jQue y pa a ag ega uncionalidad y dinamismo a
cada una de las is as.
44
4.5 En el lado del clien e
4.5.1. Los sc ip s en las is as
Todas las is as aen ca gadas consigo jQue y, que es la p incipal o ma de in e ac-
ci´on con el DOM que hemos u ilizado. Se ha ap o echado el helpe dejado en el layou
p incipal pa a ubica esas l´ıneas de c´odigo.
Uno de los usos m´as ´ıpicos del sc ip ing en el lado del clien e es pa a la alidaci´on
de o mula ios an es de que ´es os sean en iados al se ido pa a su p ocesamien o. Es e
se ´a uno de los usos m´as ex endidos del sc ip ing en oda la aplicaci´on debido a la g an
in e acci´on a a ´es de o mula ios que el m´edico end ´a con el sis ema.
Se ha u ilizado un plugin jQue y llamado inpu mask pa a pone m´asca as en los campos
de exs o que equie en un o ma o especial, como las echas. Es e plugin educe el
p oceso de alidaci´on de cada una de las is as.
isualiza ion.handleba s
Es a es sin duda la is a que m´as abajo po pa e del mo o Ja aSc ip del na egado
clien e equie e. No es de ex a˜na dado el papel que iene dado su ca ´ac e m´as din´amico
y isual. En es e caso se ag egan adem´as las lib e ´ıas de dimple.js, D3.js (necesa io pa a
´es a ´ul ima) y Handleba s.
La p ime a pa e cons a de peque˜nas unciones pa a do a de uncionalidad a la is a,
como po ejemplo pa a a˜nadi nue os pacien es al panel a pa i de los esul ados de
b´usqueda del modal, o la unci´on pa a al e na en e los dis in os da ase a ep esen a
g ´a icamen e, que incluye las llamadas AJAX a la API pa a ob ene nue os da os a
dibuja as´ı como elimina los p e iamen e ep esen ados.
dimpleCha .js
Es el sc ip enca gado de la ep esen aci´on g ´a ica. El cue po p incipal del sc ip
es ´a cons i uido po la decla aci´on de las a iables necesa ias pa a dibuja : el obje o
myCha ep esen a la abla y es a a ´es del cual se in e ac ´ua. A myCha se le ag egan
las dis in as se ies de da os que con ienen cada uno de los da ase a ep esen a (uno
po cada es , has a 6 en o al; y o o po la medicaci´on), adem´as de con igu aci´on de
los ejes y la leyenda.
Exis en 3 ipos dis in os de g ´a icas: la llamada “Dis ibuci´on”, que ep esen a an o
las omas de medicamen os como los esul ados de los es , his og amas y mapas de calo .
Pa a las dos ´ul imas, se isualiza uno po cada ipo de medicamen o. Las dos p ime as
se han implemen ado en dimple.js, mien as que el mapa de calo lo ha sido di ec amen e
en D3.js. Es o hace que el mapa de calo enga un a o lige amen e di e enciado en e
a las o as dos ep esen aciones.
Cada ez que se desea cambia el usua io cuya in o maci´on desea isualiza se o la
g ´a ica a ep esen a se des uye la abla y las se ies y uel en a inicializa se ac´ıos. Es e
es el p op´osi o de las unciones ini Dis ibu ionCha (),ini His og amCha () ydele eCha
() espec i amen e.
45
5 Resul ados de isualizaci´on
Figu a 5.4: His og ama co espondien e a los ansiol´ı icos.
Figu a 5.5: Mapa de calo de an idep esi os.
deci , du an e casi 110 d´ıas hubo una oma de an iepil´ep icos, y du an e 2, dos omas.
Se ´ıa in e esan e conoce en qu´e dos d´ıas se inc emen a on las omas de an iepil´ep icos
y qu´e elaci´on hay en e ellos pa a saca conclusiones sob e el consumo de es e medica-
men o. Pa a eso pueden u iliza se cualquie a de las o as dos g ´a icas de la aplicaci´on,
ya que con ienen in o maci´on p ecisa de las echas de las omas.
5.3. Mapa de calo
Los mapas de calo (hea maps) consi uyen una he amien a isual muy p opicia pa a
medi indicado es o can idades absolu as. En nues o caso hemos op ado po ep esen a
el a˜no na u al, asignando a cada d´ıa del a˜no una celda. De es a o ma y como hicimos
con los his og amas, seleccionado un ipo de medicamen o, podemos e la can idad de
dicho ipo que el pacien e omaba en el in e alo de iempo seleccionado. Los colo es m´as
´ıos se asocian a can idades m´as bajas de medicamen o, mien as que los m´as c´alidos
signi ican can idades m´as al as.
52

5.4 Gene ando da os
Pa a la imagen de la igu a, se ha op ado po ep esen a el mapa de calo de los
an idep esi os del e ce pacien e de nues a mues a. Como se mues a en la Figu a 5.5,
el pacien e consume g an can idad de es os medicamen os en los dos ´ul imos meses del
a˜no, sob e odo hacia inales del a˜no. Po o o lado, du an e el e ano, pese a que las
can idades son m´as bajas que du an e el in ie no, du an e los d´ıas cen ales del mes de
agos o p esen a un pico en el consumo. Las echas, signi ica i as po se pe iodos del
a˜no muy conc e os pod ´ıan suge i que el pacien e su e de cie a es acionalidad o bien
endencia a la dep esi´on du an e los d´ıas de ecaciones.
5.4. Gene ando da os
Como dec´ıamos al p incipio de es e cap´ı ulo, se ha abajado con da ase s sin ´e icos
pa a p oba las dis in as g ´a icas implemen adas en la aplicaci´on. Cuando su uso alcance
la masa c ´ı ica de usua ios se dispond ´a de da os su icien es pa a ealiza a eas de
in e encia sob e los da os. Ya hemos comen ado con an e io idad que no exis ´ıa un pa ´on
que odos los pacien es siguie an. A´un as´ı, se ´ıa de g an u ilidad conoce si, po ejemplo,
la medicaci´on de un pacien e o los e ec os que es a p o oca sigue cie a dis ibuci´on de
p obabilidad. Algo simila pod ´ıamos deci de los pa ones de sue˜no, que se c ee que
ienen mucha in luencia en la apa ici´on de c isis.
El obje i o de las isualizaciones es que se puedan ealiza ´apidamen e an´alisis de
g andes can idades de da os, ex ae conclusiones y ac ua en consecuencia. Po ello,
es impo an e escoge qu´e isualizaciones deben implemen a se pa a alcanza es os ob-
je i os de o ma e ec i a. Has a que el momen o de masa c ´ı ica de usua ios llegue,
podemos u iliza una se ie de da os simulados pa a comp oba que las isualizaciones
son co ec as. Pa a comenza , podemos supone no malidad en las a iables alea o ias
(una po cada ipo de medicaci´on). Si llegado el momen o de abaja con da os eales
es a hip´o esis no uese co ec a, se pod ´ıan ealiza los ajus es con enien es pa a adap a
la isualizaci´on a la dis ibuci´on in e ida.
Pa a ello se han implemen ado sendas unciones que gene an da os de medicaci´on en
un in e alo de iempo dado siguiendo cie a dis ibuci´on de p obabilidad. El esquema
gene al de es e algo i mo de gene aci´on es:
1. Decidi alea o iamen e el n´ume o de p esc ipciones que an a ealiza se en ese
in e alo.
2. Escoge alea o iamen e la longi ud de esas p esc ipciones (en d´ıas).
3. Asigna alea o iamen e qu´e ipo de medicaci´on se oma ´a en cada p esc ipci´on
gene ada.
Todos los da os gene ados alea o iamen e en el algo i mo an e io siguen la misma dis-
ibuci´on.
El iche o andomDa a.js implemen a las unciones Ja aSc ip necesa ias pa a gene a
da os siguiendo una dis ibuci´on no mal N(µ, σ) (siendo es os dos a gumen os pa ame-
izables po el usua io). Se implemen a ambi´en una unci´on pa a la chi cuad ado χ2
n
53
5 Resul ados de isualizaci´on
con ng ados de libe ad, aunque es a con obje i os de es de hip´o esis y no con inalidad
de ep esen aci´on. Es o ´ul imo queda ue a del ´ambi o del p esen e abajo.
Pa a la implemen aci´on de la co espondien e a la dis ibuci´on no mal, se ha seguido
el m´e odo pola de Ma saglia:
1 unc ion gaussian ( mean , s de ) {
2 a y2;
3 a use_las = alse ;
4 e u n unc ion () {
5 a y1;
6i ( use_las ) {
7y1 = y2;
8use_las = alse ;
9}
10 else {
11 a x1 , x2 , w;
12 do {
13 x1 = 2.0 * Ma h . andom () - 1.0;
14 x2 = 2.0 * Ma h . andom () - 1.0;
15 w = x1 * x1 + x2 * x2;
16 }while ( w >= 1.0);
17 w = Ma h . sq (( -2.0 * Ma h .log (w))/w);
18 y1 = x1 * w;
19 y2 = x2 * w;
20 use_las = ue;
21 }
22
23 a e al = mean + s de * y1;
24 i ( e al > 0)
25 e u n e al;
26 e u n - e al;
27 }
28 }
C´odigo 5.1: Implemen aci´on del m´e odo de Ma saglia en Ja aSc ip .
Ap o echando es a implemen aci´on, y bas´andonos en la de inici´on de la a iable χ2
n
(χ2
n=Z2+n
· · · +Z2) donde Z∼N(0,1), hemos ob enido una unci´on pa a es a dis i-
buci´on:
1 unc ion chiSqua e ( eedDeg ){
2 e u n unc ion () {
3i ( eedDeg === unde ined ) {
4 eedDeg = 1;
5}
6 a i, z, sum = 0.0;
7 o (i = 0; i < eedDeg ; i ++) {
8z = gaussian (0 ,1) () ;
9sum += z * z;
10 }
11 e u n sum ;
12 }
13 }
54
5.4 Gene ando da os
Figu a 5.6: G ´a ica Dis ibuci´on usando da os gene ados alea o iamen e.
Figu a 5.7: Mapa de calo pa a ansiol´ı icos usando da os gene ados alea o iamen e.
La undamen aci´on del m´e odo de Ma saglia se explica en de alle en la Secci´on 5.5.
Pa a cada una de es as unciones exis e o a que de uel e los alo es de la dis ibuci´on
pe o con i i´endolos a en e os (pa a su uso en las unciones de gene aci´on de da ase s)
den o de un in e alo dado.
Vamos a ealiza p uebas de isualizaciones implemen adas gene ando un da ase .
Ac uando bajo la hip´o esis de no malidad an es mencionada, el da ase sigue una dis i-
buci´on N(15,5). Es a hip´o esis no esul a descabellada debido a que los pacien es siguen
a amien os a macol´ogicos es ic os pa a a a de e i a las c isis, y las omas pueden
llega a inc emen a se conside ablemen e cuando ´es as se ma e ializan.
En la Figu a 5.6 puede e se el diag ama de dis ibuci´on pa a el da ase . Se obse a con
cla idad que la dis ibuci´on que siguen los medicamen os es una no mal po el aspec o
que p esen a la g ´a ica. El alo m´as ecuen e es el de colo ojo, que se co esponde con
los ansiol´ı icos y los hipn´o icos. Si ep esen amos el mismo da ase en o ma de mapa de
calo , ob enemos el que se mues a en la Figu a 5.7. R´apidamen e se ap ecia, es a ez
m´as en de alle que en el g ´a ico an e io , el pico de omas los d´ıas 9 y 10 de ma zo. Los
colo es azules nos dicen que la can idad de li io consumida ue a de los d´ıas cen ales del
mes de ma zo es baja. Como des en aja, es m´as complicado iden i ica la dis ibuci´on
no mal de los da os debido a que se ep esen a la ag upaci´on de da os con in ensidades
de colo , en luga de con ba as o l´ıneas.
55
5 Resul ados de isualizaci´on
Figu a 5.8: His og ama pa a ansiol´ı icos gene ado alea o iamen e.
Po o o lado, ep esen ando el his og ama pa a el mismo ipo de medicamen os se
ob iene el de la Figu a 5.8. De aqu´ı podemos deduci que los ansiol´ı icos e hipn´o icos
es ´an p esen es siemp e du an e el pe iodo de iempo ep esen ado, llegando incluso
has a las seis omas dia ias (aunque sea ´unicamen e en dos d´ıas). Po o a pa e, se
ap ecia que se ece a on es e ipo de medicamen os du an e 34 d´ıas du an e el in e alo
bajo es udio.
En de ini i a, el g ´a ico “Dis ibuci´on” y los mapas de calo pe mi en isualiza muy
bien la no malidad de los da os, al con a io que el his og ama. En e ec o, la educci´on
de dimensionalidad ealizada pa a ep esen a el his og ama (pe demos las echas de
las omas), aunque pe mi e ap ecia las can idades de o ma adecuada, no ecoge su
dis ibuci´on en el iempo. Po ello, sucesi as e siones de la aplicaci´on se pod ´ıa man ene
´es e ´ul imo pues o que pod ´ıa ene u ilidad m´edica pese a que no la iene es ad´ıs ica,
al menos a p io i.
5.5. Gene aci´on de n´ume os alea o ios
Comp oba la alidez de las ep esen aciones es udiadas nos ha lle ado a c ea un
gene ado de da os pa a loga lo. En es a secci´on p e endemos p o undiza en los un-
damen os ma em´a icos que sus en an las unciones implemen adas en el ma co de es e
p oyec o pa a la c eaci´on de esos da ase s sin ´e icos. La gene aci´on de n´ume os alea-
o ios siguiendo cie a dis ibuci´on de p obabilidad cons i uye un pila b´asico en los
expe imen os de Mon e Ca lo. Pese a que ese no es el ema de es udio, nos apoya emos
en los esul ados de es a ama de la es ad´ıs ica pa a el p op´osi o que nos ocupa.
Los lenguajes de p og amaci´on de p op´osi o gene al incluyen, al menos, una unci´on
pa a gene a n´ume os alea o ios comp endidos en cie o in e alo [a, b]. La dis ibuci´on
que siguen esos n´ume os es una uni o me en dicho in e alo (deno ada po U(a, b)).
Ap o echa emos es e hecho pa a implemen a una a iable alea o ia no mal N(µ, σ2).
56
5.5 Gene aci´on de n´ume os alea o ios
5.5.1. M´e odo de Box-Mulle
La o ma m´as di ec a y a la ez, m´as ingenua, de gene a una a iable alea o ia
conocida su unci´on de dis ibuci´on es p ecisamen e halla la in e sa de ´es a ´ul ima.
Queda plasmado en es e esul ado [Fishman,2013]
Teo ema 5.1. Sea Xuna a iable alea o ia con unci´on de dis ibuci´on F(z) y sea F−1
la unci´on in e sa de es a. En onces la a iable alea o ia U=F(X) iene dis ibuci´on
uni o me en el in e alo (0,1). Si Yes una a iable alea o ia que sigue dicha dis ibuci´on,
en onces la a iable alea o ia X=F−1(U) sa is ace la dis ibuci´on F.
El p incipal p oblema que plan ea es a ap oximaci´on es p ecisamen e el c´alculo de
la unci´on in e sa de una unci´on de dis ibuci´on F. En e ec o, halla una exp esi´on
anal´ı ica pa a esa unci´on puede se sumamen e complicado compu acionalmen e. No es,
ni mucho menos, el ´unico m´e odo pa a el c´alculo de a iables alea o ias.
El m´e odo de Box-Mulle es un m´e odo de acep aci´on- echazo pa a simula a iables
alea o ias que sigan una dis ibuci´on no mal [Fishman,2013, p. 190]. Es impo an e
man ene en men e las siguien es dos p opiedades de la dis ibuci´on no mal:
1. Si Y∼N(0,1), en onces Z=µ+σY es una N(µ, σ2).
2. Rep oduc i idad de la no mal: Si Z1, . . . , Znson a iables alea o ias con dis i-
buci´on N(µ1, σ2
1), . . . , N(µn, σ2
n) espec i amen e, en onces la a iable alea o ia
Z1+· · · +Znsigue la dis ibuci´on N(µ1+· · · +µn, σ2
1+· · · +σ2
n). Es a p opiedad
nos pe mi i ´a gene a cualquie dis ibuci´on N(µ, σ2) a pa i de una N(0,1).
El m´e odo pola de Ma saglia se basa en el siguien e esul ado:
Teo ema 5.2 (T ans o maci´on de Box-Mulle ).Si U1yU2son a iables alea o ias in-
dependien es id´en icamen e dis ibuidas U(0,1), las a iables
X=q−2 log(U1) cos(2πU2) e Y=q−2 log(U1) sen(2πU2)
son a iables independien es con dis ibuci´on no mal N(0,1).
5.5.2. M´e odo de Ma saglia
Aplica el esul ado an e io equie e calcula senos y cosenos, una a ea que compu-
acionalmen e puede esul a cos osa. Pese a es o, exis e un m´e odo de acep aci´on-
echazo basado en la an o maci´on de Box-Mulle que e i a el c´alculo de unciones
igonom´e icas.
Sean U1, U2 a iables independien es id´en icamen e dis ibuidas U(0,1). De inimos las
a iables alea o ias V1= 2U1−1 y V2= 2U2−1. Ambas siguen la dis ibuci´on U(0,2). De
es a o ma, el pa (V1, V2) ep esen a las coo denadas ca esianas de un pun o alea o io
dis ibuido uni o memen e sob e el cuad ado [−1,1] ×[−1,1]. Sean (R, θ) las coo denas
pola es de dichos pun os, es deci ,
R2=V2
1+V2
2e an(θ) = V1
V2
.(5.1)
57

5 Resul ados de isualizaci´on
P oposici´
on 5.1. Si R2=V2
1+V2
2≤1, es deci , el pun o de coo denadas (V1, V2)
es ´a den o de la ci cun e encia unidad, R2yθson, espec i amen e, a iables indepen-
dien es con dis ibuci´on U(0,1) yU(0,2π).
Re omando el esul ado del eo ema 5.2, podemos usa las coo denadas pola es y
esc ibi que
X=q−2 log(R2) cos(θ) e Y=q−2 log(R2) sen(θ).
U ilizando la Ecuaci´on 5.1 y sus i uyendo, se ob iene inalmen e que
X=V1s−2 ln(R2)
R2eY=V2s−2 ln(R2)
R2.
As´ı, XeYson a iables alea o ias con dis ibuci´on N(0,1), y las hemos calculado sin
necesidad de u iliza unciones igonom´e icas.
De es a o ma, puede c ea se un algo i mo [Gen le,1998] que simula una a iable
alea o ia N(0,1) de la siguien e o ma
1. Se gene an dos n´ume os alea o ios a1, a2.
2. Se calculan b1:= 2a1−1, b2:= 2a2−1.
3. Toma A=b2
1+b2
2.
4. Si A > 1, ol e al paso 1. En caso con a io, de ol e los alo es
x=b1s−2 ln(A)
Aey=b2s−2 ln(A)
A.
Es e algo i mo de uel e un pa de a iables alea o ias, bas a queda se con una de
ellas. La implemen aci´on en Ja aSc ip es la que se mues a en el C´odigo 5.1.
58
6 Conclusiones y abajo u u o
El an´alsis de da os masi os es ´a llamado a se el u u o, o al menos eso pa ece a d´ıa
de hoy. Tiene la capacidad de se implemen ado en nume osos campos, y no s´olo en el
emp esa ial o in es igado , como en´ıa pasando has a aho a. La po encia de los g andes
cen os de da os, las nue as a qui ec u as que sacan p o echo m´aximo a la capacidad de
c´alculo, la e sa ilidad de los sis emas cloud y muy especialmen e, las ingen es can idades
de da os que gene amos a dia io alumb an un u u o ealmen e p ome edo pa a el big
da a.
Muchos sec o es no son ajenos a es e cambio y comienzan a p epa a se pa a la e olu-
ci´on de los da os que es ´a po eni . La medicina, como cualquie o o campo, con empla
posibilidades de cambio muy p o undas con la ayuda de la in o m´a ica y el an´alisis de
da os. La mejo a en los diagn´os icos o los a amien os pe sonalizados pa a cada pa-
cien e son s´olo dos ejemplos de c´omo la in o m´a ica puede in oduci g andes mejo as.
La pla a o ma bip4cas a a de o ma pa e de esa e oluci´on plan eando un sis ema
in eg al de seguimien o y p e enci´on de c isis en los pacien es con as o no bipola .
Como hemos mos ado a lo la go de es as p´aginas, se ha desa ollado la aplicaci´on
web bip4cas cumpliendo los equisi os p opues os po el D . U gel´es y los obje i os que
pa a ella se es ablecie on. La aplicaci´on desa ollada es plenamen e uncional, es ´a lis a
pa a se desplegada en el se ido y se u ilizada. Pues o que la pla a o ma es ´a en una
ase muy emp ana, el p ime come ido de la aplicaci´on web se ´a la cap aci´on de da os
de los pacien es de i ado del uso dia io de los p o esionales m´edicos pa a la ges i´on de
sus consul as.
En el apa ado de las isualizaciones del Cap´ı ulo 5, hemos ealizado p uebas pa a
comp oba si cie os ipos de ep esen aciones se ajus an bien a los da os ep esen ados
y de e dad pe mi en saca conclusiones sob e la dis ibuci´on de ´es os. Las elecciones de
los g ´a icos de ´a ea y los mapas de calo pa ecen ace adas, mien as que el his og ama
no lo es an o, pues o en que su uso pe demos a iables que a ec an a la dis ibuci´on,
como la echa de las omas.
Respec o al abajo u u o, des acamos a ios aspec os. El p ime o iene que e con
la in eg aci´on. Pese a que la base de da os y el se icio es ´an in eg ados, el es o de
elemen os de la pla a o ma no. A co o plazo, se ´ıa necesa ia la in eg aci´on con la apli-
caci´on And oid pa a hace uncional el apa ado de comunicaciones con el clien e. En
el medio plazo, es necesa ia la c eaci´on de un amewo k que ecolec e los da os an o
del ac ´ıg a o como del sma phone del pacien e y los in eg e en la base de da os de
o ma au oma izada. En ese sen ido, los ac ´ıg a os pueden p esen a p oblemas pues la
ob enci´on de da os ha de hace se a a ´es de una he amien a p opia del ab ican e de los
59
6 Conclusiones y abajo u u o
mismos. As´ı mismo, se ´ıa necesa io ealiza la in eg aci´on con el modelo una ez que ´es e
se implemen e. Dicha in eg aci´on no se ´a complicada en absolu o, pues o que la modu-
la idad de Node.js pe mi e que exis an paque es enca gados de conec a con se icios de
R, como po ejemplo s a o OpenCPU, que p opo ciona una API pa a an´alisis de da os
usando R. O a al e na i a se ´ıa u iliza RSe e, un p o ocolo de comunicaci´on con una
sesi´on emo a de R. Exis e una implemen aci´on de un clien e RSe e pa a Ja aSc ip
disponible en Gi Hub.
La a qui ec u a usada, especialmen e el un ime Node.js, pe mi e que es a sea un
sis ema obus o y ´acilmen e escalable. A´un as´ı, po el momen o es di ´ıcil p e e c´omo
se compo a ´a con exac i ud el sis ema cuando la can idad de da os almacenados y las
conexiones que enga que sopo a c ezcan. Pa a ello hay que espe a a que la pla a o ma
es ´e en p ime luga plenamen e in eg ada y despu´es se ´ıa con enien e la ealizaci´on de
p uebas de ca ga pa a de e mina el endimien o del sis ema.
La isualizaci´on de los da os iene mucho po encial, especialmen e en el campo m´edico
donde la oma de decisiones puede supone in lui en la calidad de ida de las pe sonas.
La aplicaci´on web es ´a p epa ada pa a ep esen a nue os ipos de da os. En e ec o, la
API puede inc emen a se pa a se i nue os ipos de da os de o ma sencilla, las lib e ´ıas
de ep esen aci´on g ´a ica es ´an ca gadas en el clien e y las unciones de ep esen aci´on
pueden eu iliza se. Po el momen o hemos simulado la ep esen aci´on de da os que si-
guen una dis ibuci´on no mal con mapas de calo , his og amas y g ´a icos de ´a ea. Una
l´ınea de abajo u u o en es e sen ido end ´ıa dada po la p ueba de nue as isualiza-
ciones y es udia su compo amien o con da os bajo o as dis ibuciones dis in as de la
no mal.
Pese a que los equisi os es ´an cubie os, se ´ıa ecomendable ealiza p uebas de usa-
bilidad de ca a a e siones y mejo as pos e io es, eniendo en cuen a la expe iencia de
los usua ios as´ı como sus suge encias, pues o que puede se ambi´en un oco de inno-
aci´on y de inco po aci´on de nue as ca ac e ´ıs icas a la aplicaci´on en di e sos aspec os:
isualizaci´on, medicaci´on, nue os es que los m´edicos ealizasen a sus pacien es, e c.
60
´
Indice al ab´e ico
ac ´ıg a o, 2
AJAX, 45,47
Angula .js, 20
Apache, 20
Ka ka, 15
a qui ec u a
λ,13,16
h´ıb ida, 13
big da a, 1
bip4cas , 1,24
Boo s ap, 20,24
ale , 25
bagde, 34
collapse-pane, 34
glyphicon, 25
modal, 24,25,28,31,32,46,47
popo e , 47
abpane, 32
capa ba ch, 13,14
capa de se icio, 14,17
Cascading, 12
Cassand a, 15
Cloude a Impala, 14
D3.js, 45
da ase , 45
dimple.js, 24,45
se ie, 46
EEAG, 6
Elephan DB, 14
Embe .js, 20
escalabilidad
ho izon al, 14,15
Exp ess.js, 40
exp ess.js, 20,21,37
eno ipo, 2
Flume, 13
amewo k, 21
GlassFish, 21
Handleba s, 22,40,45,47
helpe , 44
HBase, 15
HDRS, 6
Ja aSc ip , 22
JBoss, 21
jQue y, 23
LAMP, 20
MapReduce, 16
MEAN, 20
MongoDB, 15,22,27,42
node.js, 20,21,37,60
body-pa se , 39
clien -sessions, 39
connec , 40
connec - es , 40
cookie-pa se , 39
h p-au h, 40
mongoose, 40,44
Schema, 44
pa h, 39
sc ibe-js, 40
se e- a icon, 39
npm, 21
PANSS, 6
61
Bibliog a ´ıa
npm documen a ion. Wha is npm? |npm Documen a ion, 2016. URL h ps://docs.
npmjs.com/ge ing-s a ed/wha -is-npm.
Ca la To en . Escala de Young pa a la E aluaci´on de la Man´ıa, Oc obe 2011. URL
h p://www.acmcb.es/ iles/425-2431-DOCUMENT/To en -42-6Oc 11.pd .
Udaci y. Da a Visualiza ion and D3.js Cou se |Udaci y, 2014. URL www.udaci y.com/
cou se/da a- isualiza ion-and-d3js--ud507.
Wikipedia con ibu o s. Global Assessmen o Func ioning, July 2016a. URL
h ps://en.wikipedia.o g/w/index.php? i le=Global_Assessmen _o _
Func ioning&oldid=731955585. Page Ve sion ID: 731955585.
Wikipedia con ibu o s. Hamil on Ra ing Scale o Dep ession, May 2016b.
URL h ps://en.wikipedia.o g/w/index.php? i le=Hamil on_Ra ing_Scale_
o _Dep ession&oldid=722263561. Page Ve sion ID: 722263561.
Wikipedia con ibu o s. Posi i e and Nega i e Synd ome Scale, June 2016c.
URL h ps://en.wikipedia.o g/w/index.php? i le=Posi i e_and_Nega i e_
Synd ome_Scale&oldid=724022764. Page Ve sion ID: 724022764.
Hage Yaapa. Exp ess Web Applica ion De elopmen . Pack Publishing L d, Janua y
2013. ISBN 978-1-84969-655-5. Google-Books-ID: nQ I1yuV DwC.
Nick Qi Zhu. Da a Visualiza ion wi h D3.Js Cookbook. Pack Publishing, 2013. ISBN
978-1-78216-216-2.
68