dzVis

Sistema Interativo para Criao de Grficos com os Dados

Agregados do IBGE

2/25/2016
Projeto Final de Graduao - Pontifcia Universidade Catlica do Rio de Janeiro
Talitha Faustino Speranza

Centro Tcnico Cientfico

Departamento de Informtica
Curso de Graduao em Engenharia da Computao
 Talitha Faustino Speranza

dzVis Sistema Interativo para Criao de Grficos

com os Dados Agregados do IBGE

Relatrio de Projeto Final, apresentado ao Departamento de Informtica da PUC-Rio

como requisito parcial para a obteno do ttulo de Bacharel em Engenharia da Computao.

Orientadores: Ivan Mathias Filho (Departamento de Informtica da PUC-Rio) e

Gustavo Maurcio Gonzaga (Departamento de Economia da PUC-Rio)

Fevereiro de 2016
Rio de Janeiro

1
RESUMO

Speranza, Talitha Faustino. Mathias Filho, Ivan. Gonzaga, Gustavo Maurcio. dzVis Sistema
Interativo para Criao de Grficos com os Dados Agregados do IBGE. Rio de Janeiro, 2016.
Projeto Final II Departamento de Informtica. Pontifcia Universidade Catlica do Rio de
Janeiro.

Este projeto teve por objetivo especificar e desenvolver o dzVis, uma aplicao
OpenCPU/AngularJS para o Data Zoom. O sistema possibilita a criao de grficos com dados
agregados do Instituto Brasileiro de Geografia e Estatsitica (IBGE), a partir de conhecidos
pacotes R, como o googleVis. O ambiente R onde o sistema opera a lgica de criao de grficos
reside em um servidor OpenCPU e invisvel ao usurio, que no precisa fornecer cdigo R. A
interao com o dzVis se d apenas atravs da interface grfica. Os dados do IBGE so
armazenados em uma base de dados MySQL e lidos atravs de programas R.

Palavras-Chave: OpenCPU, AngularJS, R, googleVis, IBGE, Data Zoom, Anlise de Dados,

Computao Cientfica Embarcada, PUC-Rio, Departamento de Informtica, Projeto Final II

2
ABSTRACT

Speranza, Talitha Faustino. Mathias Filho, Ivan. Gonzaga, Gustavo Maurcio. dzVis An
Interactive System to Create Charts with the IBGE Aggregate Data. Rio de Janeiro, 2016. Projeto
Final II Departamento de Informtica. Pontifcia Universidade Catlica do Rio de Janeiro.

The objective of this project was to specify and develop the dzVis, an OpenCPU/AngularJS
application for Data Zoom. The system makes it possible to create charts with aggregate data
from the Brazilian Institute of Geography and Statistics (IBGE), through well-known R packages
like googleVis. The R environment where the system operates the chart creation logic resides in
an OpenCPU server and is invisible to the user, who does not need to provide R code.
Interaction with the dzVis is through graphic interface only. The IBGE data is stored in a MySQL
database and retrieved by R programs.

Keywords: OpenCPU, AngularJS, R, googleVis, IBGE, Data Zoom, Data Analysis, Embedded
Cientific Computing, PUC-Rio, Departament of Informatics, Projeto Final II

3
Sumrio

Lista de Figuras.............................................................................................................................................. 5
1. Introduo ................................................................................................................................................. 7
2. Motivao ................................................................................................................................................. 7
2.1 O Sistema IBGE de Recuperao Automtica (SIDRA) ...................................................................... 10
2.2. Grficos do SIDRA ............................................................................................................................ 11
2.3. Grficos dos Pacotes R ..................................................................................................................... 12
3. Requisitos ............................................................................................................................................ 14
3.1. Requisitos da Base de Dados ........................................................................................................... 14
3.2. Requisitos da Interface Grfica ........................................................................................................ 14
3.3. Requisitos da Arquitetura ................................................................................................................ 15
4. Definio das Tecnologias Utilizadas .................................................................................................. 15
4.1. Sistema Gerenciador de Banco de Dados ........................................................................................ 16
4.2. Integrao com o Ambiente R ......................................................................................................... 16
4.3. Interface Web .................................................................................................................................. 19
4.4. Controle de Verso .......................................................................................................................... 23
4.5. Ferramentas de Desenvolvimento ................................................................................................... 24
4.6. Documentao ................................................................................................................................. 24
4.7. Testes ............................................................................................................................................... 26
5. Arquitetura do Sistema ........................................................................................................................... 26
5.1. Viso de Projeto ............................................................................................................................... 26
5.1.1. Diagrama de Componentes (Estado Atual) ............................................................................... 26
5.1.2. Diagrama de Componentes (Prximas Verses)....................................................................... 27
5.2. Viso de Implementao ................................................................................................................. 28
5.2.1. Diagrama de Classes: Controladores de Grficos ..................................................................... 28
5.2.2. Diagrama de Classes: Controladores e Configuraes.............................................................. 29
5.3. Banco de Dados................................................................................................................................ 31
5.3.1. Diagrama de Tabelas ................................................................................................................. 31
5.3.2. Estrutura ................................................................................................................................... 32
6. Extenses ................................................................................................................................................ 33
6.1. Regras para a Criao de Modalidades de Grfico .......................................................................... 33

4
 6.1.1. A funo R ................................................................................................................................. 33
6.1.2. O template ................................................................................................................................ 35
6.1.3. O controlador ............................................................................................................................ 37
6.2. Integrao dos Novos Mdulos ....................................................................................................... 39
7. Interao com o Usurio ......................................................................................................................... 41
7.1. Instalao ......................................................................................................................................... 41
7.2. Utilizao da Interface Grfica ......................................................................................................... 41
8. Testes ...................................................................................................................................................... 51
9. Consideraes Finais e Trabalhos Futuros .............................................................................................. 52
10. Referncias Bibliogrficas ..................................................................................................................... 53

Lista de Figuras

Figura 1: Grfico animado da Gapminder. .................................................................................................... 8

Figura 2: Motion Chart do pacote googleVis, para R. ................................................................................... 9
Figura 3: Exemplo de interface para montagem de quadros (tabelas) no site do IBGE. ............................ 10
Figura 4: Parte de um arquivo .csv que foi solicitado ao SIDRA. ................................................................ 11
Figura 5: Exemplo de grfico feito no SIDRA. ............................................................................................. 12
Figura 6: Geo Map do pacote ggplot2 ........................................................................................................ 12
Figura 7: Stacked Area Chart do pacote rCharts ......................................................................................... 13
Figura 8: Grfico criado com funes do pacote plotly .............................................................................. 13
Figura 9: ZIP Explorer: exemplo de aplicao construda com o Shiny. Disponvel na web page do Shiny.
Figura 10: Estrutura da aplicao AngujarJS que compe a interface grfica do dzVis. ............................ 22
Figura 11: Cabealho da funo R createGoogleComboChart.................................................................... 24
Figura 12: Documentao com o JSDoc ...................................................................................................... 25
Figura 13: Diagrama de componentes da verso monousurio do dzVis. ................................................. 26
Figura 14: Diagrama de Componentes da verso multi-usurio do dzVis. ................................................. 27
Figura 15: Diagrama de classes representando as relaes entre controladores de grficos ................... 29
Figura 16: Diagrama de Classes representando as relaes entre controladores e configuraes da
aplicao AngularJS ..................................................................................................................................... 30
Figura 17: Diagrama de Tabelas do banco de dados do dzVis. ................................................................... 31
Figura 18: Pgina principal - e nica - do dzVis ........................................................................................... 42
Figura 19: Combo para a escolha do tipo de grfico. ................................................................................. 42
Figura 20: Pgina do dzVis aps o carregamento do template do Google Combo Chart........................... 43
Figura 21: rvore de dados e suas checkboxes para seleo de tabelas e colunas. ................................... 43
Figura 22: Busca em tempo real na rvore de dados. ................................................................................ 44

5
Figura 23: Resultado da primeira seleo na rvore de dados. .................................................................. 45
Figura 24: Resultado da escolha de outros parmetros na rvore de dados. ............................................ 45
Figura 25: Mensagem de erro. .................................................................................................................... 46
Figura 26: Pgina do dzVis quando a criao de um Google Combo Chart bem sucedida. ..................... 47
Figura 27: Detalhe do grfico mostrado na figura 23. ................................................................................ 47
Figura 28: Detalhe do menu de um grfico. ............................................................................................... 48
Figura 29: Seleo de intervalo. .................................................................................................................. 48
Figura 30: Seleo de mltiplas datas......................................................................................................... 48
Figura 31: Mensagem de data invlida. ...................................................................................................... 49
Figura 32: Exemplo de grfico gerado a partir de mltiplas datas. ............................................................ 49
Figura 33: Visualizao dos dados de uma coluna. ..................................................................................... 50
Figura 34: Pgina do dzVis quando a criao de um Google Motion Chart bem sucedida. .................... 50

6
 1. Introduo

O dzVis uma aplicao OpenCPU/AngularJS que torna possvel criar grficos de dados
econmicos brasileiros usando uma srie de pacotes R1, sem que seja necessrio digitar uma nica linha
de cdigo.

uma ferramenta indita no Brasil. Do ponto de vista do usurio, indito porque possibilita
uma experincia totalmente nova de acesso aos dados do IBGE. Do ponto de vista do desenvolvedor,
indito porque introduz o uso de ferramentas muito poderosas, pouco conhecidas e, provavelmente,
nunca antes acopladas entre si.

Este texto explica por qu o dzVis foi implementado, como o sistema funciona internamente,
qual a maneira de utiliz-lo e o que deve ser feito para criar extenses.

2. Motivao

O acesso aos dados pblicos no Brasil sempre foi tarefa rdua. H, por exemplo, relatos de
ingerncia poltica sobre os rgos responsveis pela coleta de dados durante o Estado Novo e a
Ditadura Militar, a burocracia colocava entraves ao processo de obteno desses dados pela populao
e a internet no existia ou no era utilizada para democratizar o compartilhamento de informao. Hoje,
felizmente, esses problemas esto superados. Mas surgiram outras dificuldades. A primeira
compreender como a procura deve ser feita em sites desatualizados, com interfaces pouco amigveis e
funcionalidade limitada. A segunda, organizar ou, no jargo dos analistas, limpar os dados que so
fornecidos.

Pensando nisso, uma equipe do Departamento de Economia da PUC-Rio, sob a coordenao do

professor Gustavo Maurcio Gonzaga, desenvolveu o Data Zoom.2 A ferramenta tem por objetivo
principal eliminar o esforo de leitura e organizao dos dados das pesquisas domiciliares que podem
obtidos no site do Instituto Brasileiro de Geografia e Estatstica (IBGE).3

Implementado por economistas, o software emprega tecnologias familiares a esses

profissionais: foi desenvolvido na linguagem R e distribudo na forma de um pacote STATA 4 gratuito.
Sua instalao e utilizao foi projetada para ser descomplicada e no exige qualquer conhecimento
prvio do ambiente STATA, oferencendo inclusive uma interface grfica. O processamento dos dados
originais do IBGE gera arquivos no formato .dta que podem ser exportados para .csv e, portanto, lidos
por qualquer programa de anlise de dados, ao gosto do usurio. Alm disso, oferecida a possibilidade
de gerar dados em painel, compatibilizar dados ao longo dos anos e deflacionar valores monetrios.

1
The R Project for Statiscal Computing: https://cran.r-project.org
2
Data Zoom: http://www.econ.puc-rio.br/datazoom/
3
IBGE: http://www.ibge.gov.br/
4
Stata: http://www.stata.com/

7
 O pacote preencheu uma lacuna no acesso informao no Brasil e foi um sucesso, sendo
procurado inclusive por estrangeiros. No entanto, restam ainda muitas melhorias a serem implantadas.
Uma delas, a que serviu de inspirao para esse trabalho, foi levantada pelo coordenador do projeto,
citado anteriomente. Como aluna de Engenharia da Computao e de Economia, procurei-o na inteno
de ampliar o programa. Ele, na ocasio, disse que gostaria de incorporar uma ferramenta de gerao de
grficos animados ao Data Zoom. Sua inspirao havia sido a fundao Gapminder 5 e o impressionante
grfico animado produzido para um de seus softwares estatsticos, o Trendalyzer. A animao,
popularizada por Hans Rosling no TED Talk, mostrava dados mundiais evoluindo ao longo do tempo e
contava com uma mirade de opes (Figura 1).

Figura 1: Grfico animado da Gapminder.

O grfico animado chamou a ateno do Google, que comprou a ideia e passou a oferecer um
objeto muito similar na API Google Charts,6 projetada para desenvolvedores web. Enquanto isso, um
grupo de desenvolvedores R atendeu a demanda da comunidade R pelas visualizaes sofisticadas que
poderiam ser geradas com o Google Charts e criou um pacote simples para o ambiente R, o googleVis,7
que no exige conhecimento da API do Google (Figura 2).

5
Gapminder: http://www.gapminder.org/
6
Google Charts: https://developers.google.com/chart/
7
googleVis vignette: https://cran.r-project.org/web/packages/googleVis/vignettes/googleVis.pdf

8
Figura 2: Motion Chart do pacote googleVis, para R.

Entusiasmada com a ideia que impressionou o Google e j pensando em como uni-la ao Data
Zoom, conversei com alguns alunos de doutorado e mestrado sobre suas necessidades. Como
desenvolvedora e futura economista, utilizei tambm minha prpria experincia para levantar alguns
requisitos bsicos de extenses ao Data Zoom e detectar que tipo de funcionalidade poderia ser
agregada. Desse levantamento, destaca-se:

1. Os dados agregados do IBGE, que agrupam e resumem as informaes colhidas nas

pesquisas domiciliares, no tm a leitura e o processamento cobertos pela verso original
do Data Zoom. A busca no site do IBGE demorada e seu resultado inadequado para
softwares de anlise estatstica.
2. Ferramentas para gerao de grficos simples, de mltiplos formatos e propsitos, tambm
poderiam ser includas. O site do IBGE apresenta opes de grficos, mas so bastante
ultrapassadas e baseadas em verses antigas do Excel.
3. O googleVis no o nico pacote R para montagem de grficos modernos, informativos,
amplamente customizveis e fceis de idealizar. H, na realidade, inmeros pacotes
disponveis. Alguns exemplos populares so o ggplot2,8 o plotly,9, e o rCharts.10

8
ggplot2: http://docs.ggplot2.org/
9
plotly: https://plot.ly/r/
10
rCharts: http://rcharts.io/

9
 Para no deixar dvidas quanto sua relevncia e mostrar como cada um destes tpicos contribuiu
para o projeto do dzVis, discuto os detalhes a seguir.

2.1 O Sistema IBGE de Recuperao Automtica (SIDRA)

A fim de disponibilizar os dados agregados das pesquisas domiciliares, o IBGE criou o SIDRA. O
sistema tem a vantagem de juntar em um s lugar todas as bases de dados do Instituto, mas apresenta
graves problemas de interao com o usurio.

Em primeiro lugar, o sistema fora o usurio a escolher a dedo os dados que deseja em uma
tabela. Essa abordagem torna a busca mais demorada, mas seu principal problema inverter a ordem
lgica da explorao de dados. O que se quer no procurar um dado especfico, uma informao cuja
natureza j se conhece, e sim que os prprios dados, desconhecidos, exponham seu corportamento e se
mostrem interessantes. Em outras palavras, de pouca utilidade pr-definir com quais varives de uma
coleo de dados relacionados se quer trabalhar, pois as caractersticas de um processo s se revelam
quando se tem liberdade para comparar quaisquer variveis entre si. O ideal, portanto, seria fornecer
todos os dados agregados de uma determinada pesquisa de uma vez, deixando a escolha das variveis
para o momento da anlise.

Um outro problema do sistema o nmero excessivo de opes nos formulrios de criao dos
chamados quadros. Os quadros so tabelas com os dados escolhidos, que podem ser visualizadas no
site e/ou enviadas por e-mail no formato .csv. A interface para a sua montagem intrincada e no h
instrues plenamente esclarecedoras (Figura 3). muito comum acabar gerando um quadro confuso,
com mais de dois cabealhos, redundncias, colunas no lugar linhas ou vice-versa, entre outros.

Figura 3: Exemplo de interface para montagem de quadros (tabelas) no site do IBGE.

10
 Com frequncia, a configurao dos quadros no pode ser conferida. Quando h mais de 10.000
dados, situao bastante comum, o sistema no mostra sequer um quadro vazio, o que permitiria
corrigir sua especificao. Alm disso, o usurio descobre que no pode visualizar seu quadro somente
depois de ter o trabalho de preencher todo o formulrio e submet-lo. De qualquer modo, mantida a
opo de receber os dados por e-mail.

O envio do e-mail rpido, mas todos os problemas relacionados a quadros deformados

aparecem no arquivo .csv (Figura 4) e precisam ser tratados. Tipicamente, um cientista social preferir
faz-lo manualmente, utilizando o Excel ou o bloco de notas, deixando o uso da linha de comando dos
softwares de anlise estatstica apenas para o final, no momento de criar grficos. No entanto, essa
estratgia no segura, e o bom analista preferir empregar um tempo adicional na linha de comando
para garantir que os dados permaneam ntegros. Em ambos os casos, mais uma etapa incmoda
adicionada ao processo de obteno e leitura dos dados.

Figura 4: Parte de um arquivo .csv que foi solicitado ao SIDRA.

Como se no bastassem os contratempos citados at aqui, os nomes das colunas do arquivo .csv
costumam ser muito extensos, do tamanho de descries. Veja, por exemplo, as opes do campo
Variveis na Figura 3. Esses nomes podero aparecer no .csv e ser carregados nos softwares de anlise.
Isso no apenas poluir os grficos como tambm tornar impraticvel a experimentao com as
colunas na linha de comando, especialmente quando se quiser testar diversas funes e for necessrio
digitar o nome das colunas vrias vezes. Renome-las, uma a uma, ser obrigatrio e ter como
consequncia a perda de suas descries, a menos que se construa um dicionrio de dados.

2.2. Grficos do SIDRA

A elaborao de grficos no SIDRA pode ser to penosa quanto a montagem de quadros. Mas a
principal deficincia dessa ferramenta a qualidade dos grficos. Na contramo dos excelentes pacotes
para o ambiente R, eles apresentam nmero limitado de informaes numricas e visuais (Figura 5).

11
Figura 5: Exemplo de grfico feito no SIDRA.

No se trata de um problema propriamente dito, uma vez que os dados so exibidos

corretamente. Porm, num mundo onde o compartilhamento de informao cumpre papel central,
grficos que comunicam to pouco tendem a ser ignorados e, portanto, no cumprem sua funo de
ilustrar, dar suporte e chamar a ateno para a questo que est sendo tratada.

2.3. Grficos dos Pacotes R

Com o objetivo de contrastar a riqueza de informaes e a interatividade dos grficos que

podem ser criados no ambiente R com a simplicidade limitante dos grficos do SIDRA, apresento alguns
exemplos dos primeiros a seguir. Observe o Geo Map do pacote ggplot2 (Figura 6):

Figura 6: Geo Map do pacote ggplot2

12
 O Stacked Area Chart do pacote rCharts disponibiliza trs opes de visualizao (Stacked,
Stream e Expanded) em um s objeto. Aqui, mostrado apenas o modo Stream (Figura 7):

Figura 7: Stacked Area Chart do pacote rCharts

O pacote plotly, apesar de no contar com uma API to intuitiva quanto a dos pacotes exibidos
anteriormente, possibilita a criao de grficos com mltiplas opes e inspeo de dados (Figura 8):

Figura 8: Grfico criado com funes do pacote plotly

13
 Vale lembrar que um exemplo j foi exibido na Figura 2 (o Motion Chart do pacote googleVis).

Por tudo que foi dito at aqui, a razo para o desenvolvimento do dzVis j deve estar clara:
fornecer aos pesquisadores e analistas uma ferramenta prtica para elaborar grficos modernos, ricos
em recursos e interativos, tendo como fonte de dados as amplas bases do IBGE, sem que seja necessrio
passar pelo site do Instituto ou ou utilizar a linha de comando.

Objetivos mais especficos do sistema sero discutidos na prxima sesso.

3. Requisitos

A partir do objetivo geral enunciado no ltimo pargrafo da sesso anterior, uma lista informal
de requisitos foi preparada. Essa lista no pretendia ser exaustiva, e sim servir como guia bsico, porm
imperativo, para a implementao do sistema. Ela estabelecia apenas o que deveria ser produzido, mas
no tudo que poderia ser desenvolvido ou de que maneira.

A seguir, a reproduo integral da lista.

3.1. Requisitos da Base de Dados

a. Deve ser nica, completa e eliminar a necessidade de acessar o SIDRA.

b. As tabelas devem obedecer a um padro conhecido por todos os desenvolvedores que
precisam acessar diretamente a base ou fazer sua manuteno.11
c. Para retirar da aplicao cliente a responsabilidade de administrar a base, ser utilizado
um SGBD.

3.2. Requisitos da Interface Grfica

a. Deve conter poucos elementos e ser intuitiva.

b. Nenhuma linha de cdigo R precisar ser fornecida pelo usurio final para que o sistema
funcione: todas as entradas devem ser captadas via interface.
c. No se deve exigir do usurio qualquer conhecimento sobre a estrutura das funes R
que sero utilizadas: se o preenchimento de algum formulrio tiver que seguir regras
derivadas do comportamento de uma funo em R, elas devem ser gerenciadas
internamente, isto , segui-las no ser responsabilidade do usurio.
d. O usurio poder escolher com quais colunas das tabelas deseja trabalhar, mas a
estrutura que apresentar as opes deve oferecer uma maneira simples de desfazer
essas escolhas e de escolher todas as colunas.

11
Em breve, a definio dos padres estar disponvel na Wiki do dzVis: https://github.com/talithafs/dzVis-
Package/wiki/Database-Maintenance

14
 e. A descrio de uma tabela ou coluna, assim como os dados de uma coluna, devem
poder ser visualizados pelo usurio e em um espao separado do destinado escolha
das colunas, mas na mesma pgina.
f. Uma vez selecionadas a tabela e as colunas, diversos tipos de grfico podero ser
gerados com o mesmo conjunto de dados, sem que seja necessrio selecion-los
novamente.
g. O preenchimento dos formulrios de criao de grficos ser automtico e ocorrer
conforme o usurio for selecionando as colunas.
h. A validao dos formulrios de criao de grficos deve ser dinmica, isto , o usurio s
poder ver as opes que forem vlidas. Isso decorre diretamente do item (c).

3.3. Requisitos da Arquitetura

a. Os componentes devem obedecer ao princpio de separao de conceitos.

b. Os componentes devem ser reutilzveis, robustos e testveis.
c. A possibilidade de introduzir novas opes de grficos uma das funcionalidades mais
relevantes do sistema. Portanto, desenvolver um ponto de extenso com interface bem
definida deve ser a preocupao central durante todo o processo de desenvolvimento.
d. Decorre do item (c) que a escalabilidade tambm um fator fundamental a ser
considerado na implementao do sistema.
e. A nica permisso de acesso base de dados concedida aplicao cliente ser a de
consulta. Isso implica que a base de dados no poder ser modificada por requisio do
usurio final.
f. Com o objetivo de adequar as sub-tabelas escolhidas pelo usurio s funes em R que
criam grficos, pode ser necessrio format-las. Qualquer processo desse tipo deve
ocorrer dentro de funes em R que serviro de envelopes para as funes geradoras de
grficos.

4. Definio das Tecnologias Utilizadas

Foi feito um estudo minucioso das opes de tecnologia que poderiam ser empregadas. A nica
exigncia comum a todas era que fossem gratuitas, pois o Data Zoom no cobra de seus usurios.

Esses estudos foram possveis no apenas devido ao aprendizado na PUC-Rio, mas tambm
minha experincia profissional e a cursos que fiz com o objetivo exclusivo de desenvolver o dzVis. A
relao completa dos cursos, em sua maioria coordenados por universidades norte-americanas e
oferecidos pela plataforma de cursos online Coursera,12 pode ser encontrada nas referncias
bibliogrficas, itens [8] a [17].

12
Coursera: https://www.coursera.org/

15
 As particularidades das escolhas para cada componente so descritas nas sesses a seguir.

4.1. Sistema Gerenciador de Banco de Dados

Minha experincia anterior com SGBDs se resumia, basicamente, ao SQL Server.13 Um dos
cargos que exerci exigia conhecimento vasto do software da Microsoft e de Transact-SQL. bem
verdade que tive contato com o MySQL na faculdade, mas meu domnio sobre o SGBD da Oracle era
irrelevante quando comparado ao que eu possua sobre o SQL Server.

No entanto, o SQL Server no open-source como o MySQL. Sua verso gratuita, o SQL Server
Express, limita o tamanho das bases em 4GB e, portanto, no adequada ao dzVis. Logo, precisava
descartar o SQL Server como opo vivel, embora estivesse consciente de que seu sistema de clusters e
de partio de dados pudesse ser de grande ajuda caso a base de dados aumentasse muito de tamanho.

Diante desta considerao de que a base poderia crescer indefinidamente e necessitar de

esquemas complexos de distribuio, a primeira alternativa examinada foi o PostgreSQL.14 Conhecido
por ser o SGBD open-source mais avanado do mercado, amplamente extensvel e compatvel com os
padres ANSI/ISO SQL (da mesma forma que o familiar SQL Server), o PostgreSQL aparentava ter as
credenciais perfeitas para o projeto.

Algumas fontes, porm, apontavam que o uso do PostgreSQL em aplicaes que dependem
somente de operaes de leitura das bases de dados era, alm de um excesso, um equvoco em muitos
casos. A performance poderia ser inferior do MySQL.15 Adicionalmente, o MySQL conta com um
nmero maior de desenvolvedores e usurios, suporte da gigante Oracle e de uma comunidade ativa,
GUIs mais intuitivas e curva de aprendizado menos ngreme.

Por coincidncia, no incio do projeto do dzVis, quando ainda estava aprendendo a linguagem R,
entrei em contato com um pacote R que implementa uma interface 16 para a comunicao entre o
ambiente R e SGBDs, o RMySQL.17 Como o nome j diz, o pacote torna possvel acessar bases de dados
do MySQL (e do MariaDB) de dentro do ambiente R.

Portanto, optar pelo MySQL parecia natural: minimamente familiar, popular, gil, escalvel,
gratuito e facilmente integrvel ao R.

4.2. Integrao com o Ambiente R

Desde o princpio, era evidente que o ambiente R deveria ser a pedra angular do sistema, sendo
utilizado para criar os grficos e acessar a base de dados. Mas como as demais peas deveriam ser

13
SQL Server: https://msdn.microsoft.com/en-us/library/mt590198(v=sql.1).aspx
14
PostgreSQL: http://www.postgresql.org/
15
Ver referncias bibliogrficas: item [3]
16
DBI: https://cran.r-project.org/web/packages/DBI/DBI.pdf
17
RMySQL vignette: https://cran.r-project.org/web/packages/RMySQL/RMySQL.pdf

16
organizadas? Quais eram, exatamente, esses outros elementos? Nessa altura, ainda no estava claro se
o dzVis seria para a web, hospedado em novas pginas do site do Data Zoom, ou para Desktop, na forma
de um pacote STATA distribudo com o Data Zoom ou at mesmo como um software independente do
STATA.

Essas perguntas foram respondidas ao longo de pesquisas sobre como as funes em R so

habitualmente chamadas por aplicaes externas.

A primeira soluo contemplada foi o simptico framework Shiny,18 para R. Com ele, possvel
criar modernas aplicaes web com pequenos programas integralmente escritos em R. No , portanto,
necessrio que se conhea HTML, CSS, Javascript ou qualquer outra linguagem. Um exemplo de
aplicao pode ser visto na Figura 9.

Figura 9: ZIP Explorer: exemplo de aplicao construda com o Shiny. Disponvel na web page do Shiny.

Bastante popular na comunidade R, o Shiny possui dezenas de bons tutoriais, extensa

documentao e, mais importante, o suporte do RStudio,19 a mais poderosa IDE para R. Parecia ser a
ponte ideal entre o R e uma interface grfica.

Entretanto, como era de se esperar de um framework projetado para no-desenvolvedores, o

Shiny limita enormemente o que pode ser oferecido na interface. Apesar dos excelentes resultados
estticos, falta flexibilidade ao framework. H, por exemplo, considerveis obstrues para dotar os
elementos de comportamento inteligente, como a validao dinmica dos formulrios prescreve. Mais
grave: no h suporte para plugins ou maneira explcita de estender os mdulos. O risco de violar a
separao de conceitos para preencher essas lacunas seria muito alto.

Descaratado o Shiny, vrias outras alternativas foram analisadas, a saber:

18
Shiny: http://shiny.rstudio.com/
19
RStudio: https://www.rstudio.com/

17
 a. Executar scripts e processos R diretamente num servidor web, mais
especificamente o Apache2, utilizando o rApache.
b. Chamar funes R a partir de programas escritos em outras linguagens, usando
o o rpy2 (para Python), JRI (para Java), o RinRuby (para Ruby) ou o Rinside (para
C++).

Essas possveis solues no foram nada fceis de encontrar, apesar de j estarem disponveis
h anos. A razo para isso, infelizmente, que nenhuma delas prtica. Uma discusso interessante
sobre suas fraquezas pode ser encontrada em um estudo publicado por Jeroen Ooms.20 Um trecho
sintetiza com primor os problemas que elas apresentam (traduo livre):

Dada a enorme demanda por anlise e visualizao nos dias de hoje, a adoo do R para
computao cientfica embarcada , na realidade, decepcionante. Por experincia prpria, a causa
primria desse sucesso limitado que essas pontes [entre diversas aplicaes e o R] so difceis de
implementar, no so escalveis e deixam os problemas mais desafiadores sem resposta. Trabalho
substancial e conhecimento dos detalhes internos do R so necessrios para construir aplicaes com
essas ferramentas. Clientes devem gerar e injetar sintaxe R, ter uma noo das estruturas C que
compem o R e escrever seus prprios frameworks para gerenciar requisies, grficos, segurana,
intercmbio de dados, etc. Portanto, os clculos cientficos ficam misturados com outras partes do
sistema, resultando em um software altamente acoplado, complexo e frequentemente no confivel.
Alto acomplamento tambm problemtico do ponto de vista de recursos humanos. Construir uma
aplicao com o RServe, por exemplo, requer um programador web que tambm um especialista em R,
Java e Rserve. Como o R uma linguagem de nicho, essa combinao de habilidades muito rara e cara.

Esse mesmo artigo expe um sistema elaborado por Ooms que foi essencial contruo do
dzVis, o OpenCPU.21 Era a pea que faltava no quebra-cabeas: a janela para um servidor R atravs de
uma API Javascript que no requer que o desenvolvedor da aplicao cliente conhea o que foi
implementado em R.

Na realidade, existem duas implementaes do OpenCPU. O pacote R opencpu prov um

servidor monousurio que funciona dentro do ambiente R, em qualquer plataforma. Como o R single-
threaded, apenas uma requisio pode ser tratada por vez. J o servidor OpenCPU faz uso do rApache e
demanda um servidor Linux dedicado para aceitar mltiplos usurios e requisies concorrentes. A
primeira implementao ideal para desenvolver e testar e foi a utilizada at ento. Em verses futuras,
a arquitetura do dzVis mudar para incorporar o servidor multi-usurio.22 A transio no deve ser
problemtica, uma vez que todas as interfaces do OpenCPU esto muito bem determinadas.

Como foi brevemente mencionado, o OpenCPU conta com uma API Javascript. Isso impe uma
limitao escolha da linguagem de programao da interface grfica, mas no cria maiores
dificuldades. Javascript a chamada linguagem da web, afinal.

20
Ver referncias bibliogrficas item [1]
21
OpenCPU: https://www.opencpu.org
22
Ver sesso [5.1. Viso de Projeto]

18
 O OpenCPU traz ainda uma vantagem adicional. A estrutura s funciona se os programas R
desenvolvidos pelo cliente forem compilados como um pacote R e todos os objetos que compem a
interface associada forem inseridos no pacote. A distribuio do sistema para testes caixa-preta e uso
experimental facilitada por sua atomicidade. Abriu-se, tambm, a possibilidade de distribuir o pacote
R para o usurio final e prescindir da hospedagem no site do Data Zoom.

Por ltimo, mas no menos importante, a escolha do OpenCPU dota o sistema de mais um
aspecto desejvel: dado o nvel de desacoplamento entre a base de dados, a interface web, a aplicao
R (conjunto de funes R) e o servidor R, cada um desses componentes pode ter sua prpria equipe de
desenvolvimento, manuteno e testes, com conhecimentos especficos de cada domnio.

4.3. Interface Web

O OpenCPU impunha, de certa forma, que a linguagem de escolha para a implementao da

interface deveria ser Javascript. A dificuldade, agora, era encontrar uma maneira de modularizar o
cdigo para conferir extensibilidade e possibilidade de reso. Do contrrio, no haveria como permitir a
integrao de novos formulrios para a criao de grficos e a manuteno dos componentes seria
dificultosa.

Antes, porm, foi necessrio que me familiarizasse com HTML, CSS e o prprio Javascript.
Minha experincia com desenvolvimento web havia sido apenas no mbito dos produtos proprietrios
da Microsoft (ASP.NET, C#), rejeitados para o projeto do dzVis desde o incio, por no serem gratuitos.

Durante toda a fase de aprendizagem, o foco foi na qualidade modular que o futuro cdigo
deveria ter. Incomodada com a falta de recursos built-in do Javascript para aplicar o paradigma
orientado a objetos, pesquisei padres e prticas que me auxiliassem nesse sentido.23 Aps vrias
tentativas frustradas por conta da supreendente falta de literatura sobre o assunto, o resultado acabou
por ser bastante satisfatrio. Um exemplo simplicado de classe implementada segundo os padres
estabelecidos no processo24 apresentado abaixo. A classe foi efetivamente utilizada pelo dzVis, mas
sua verso completa contm mais atributos, alm de comentrios em JSDoc.

var GoogleChartsBase = (function() {

// Variveis de instncia
this.databaseTree = undefined ;
this.connection = undefined ;

// Variveis privadas
var currentTable = undefined ;
var currentColumns = [] ;

// Constantes protegidas
var DEFAULT = {

23
Ver referncias bibliogrficas itens [7], [19], [20] e [21]
24
Em breve, a definio dos padres estar disponvel na Wiki do dzVis .

19
 get TARGET() {
return {id : "no_target", text : "Nenhuma"} ;
},
get NO_VALUE(){
return {id: "no_value", text: "Nenhum valor selecionado"} ;
}
};

// Variveis protegidas
var properties = {
get table(){
return currentTable ;
},
get columns(){
return currentColumns ;
},
};

// Construtor
function GoogleChartsBase(databaseTree, connection) {

// Inicializao das variveis de instncia

this.databaseTree = databaseTree ;
this.connection = connection ;
}

// API pblica da classe

GoogleChartsBase.prototype.DEFAULT = DEFAULT ;
GoogleChartsBase.prototype.properties = properties ;

return {
GoogleChartsBase : GoogleChartsBase ;
};
}());

Nesse exemplo, as variveis privadas esto plenamente protegidas de tentativas de alterao

externa e seu estado pode ser acessado atravs da API pblica. Pode parecer estranho, mas utilizar a
prototipagem a nica maneira de assegurar esse comportamento e resguardar a integridade dos
objetos em Javascript. Para compreender melhor, veja o exemplo a seguir:

var base = new GoogleChartsBase(dbTree, conn);

// Suponha que o estado atual de currentTable 'PEA'

base.currentTable = undefined ;
console.log(base.properties.currentTable)
// O registro no console ser 'PEA' - o estado do objeto no foi modificado

// Suponha agora que 'properties' no seja prototipado

// e que exista um mtodo prototipado 'getTable' que retorne currentTable
base.currentTable = 'INPC';
console.log(base.getTable())
// O registro no console ser 'INPC' - o estado do objeto foi modificado!

20
 Os mtodos pblicos tambm precisam ser prototipados para permanecerem protegidos de
intervenes indevidas. As variveis de instncia e os mtodos privados, no. O exemplo de classe
abaixo ilustra como mtodos podem ser protegidos e, adicionalmente, mostra como o padro singleton
pode ser implementado. Essa classe tambm foi utilizadas no dzVis, mas sua verso plena mais
complexa.

var Connection = (function() {

// Varivel privada: instncia nica

var instance ;

// Construtor
function Connection(){ }

// Mtodos privados
function createInstance() {
var object = new Connection();
return object;
}

var getQuery = function(functionName, parameters, callback){

// Chamada de uma funo R atravs do cliente JS do OpenCPU

var req = ocpu.call(functionName, parameters, function(session){

session.getObject(function(filename){

$.getJSON(session.getFileURL(filename), function(data) {
callback(data.values.join()) ;
});
});
});

req.fail(function(){
alert("Server error: " + req.responseText);
});
};

// Mtodos protegidos
var getColumnValues = function(column, table, nvalues, callback){

var parameters = {
column : column,
table : table,
} ;

getQuery("getColumnValues", parameters, callback) ;

} ;

//API pblica da classe Connection

Connection.prototype.getColumnValues = function(column, table, callback){
getColumnValues.call(this, column, table, callback);
};

return {

21
 getInstance: function () {
if (!instance) {
instance = createInstance();
}
return instance;
}
};
}());

Tendo resolvido essas questes, restava decidir como, exatamente, os pontos de extenso
seriam implementados. Para isso, o framework AngularJS,25 que tem por objetivo facilitar a construo
de aplicaes Javascript com arquitetura Model-View-Controller (MVC), veio a calhar. Observe a
estrutura dos arquivos que geram a interface grfica do dzVis, que nada mais que uma aplicao
AngularJS. (Figura 10)

Figura 10: Estrutura da aplicao AngujarJS que compe a interface grfica do dzVis.

25
AngularJS: https://angularjs.org/

22
 A pasta controllers contm os mdulos que executam a lgica de negcio do sistema,
gerenciando o contedo da interface, mas sem alterar sua estrutura. Em outra palavras, os
controladores determinam o que ser mostrado na interface, mas no como os dados aparecero para
o usurio. A validao dinmica dos parmetros dos grficos tambm feita nos controladores, cada
mdulo operando de acordo com as regras de um certo tipo de grfico.

Um ou mais servios podem ser utilizados pelos controladores para que cumpram suas tarefas.
Os servios esto armazenados na pasta services. So injetados nos controladores como objetos
singleton que executam lgica compartilhada por diversas partes do programa. O servio Connection,
por exemplo, utilizado pelos controladores GoogleMotionChartController e
GoogleComboChartController para chamar as funes R que criam grficos. J o controlador
DetailsController utiliza o mesmo servio para chamar a funo R que retorna os valores da coluna
de uma tabela da base de dados.

Tambm para agregar funcionalidade aos mdulos e facilitar o reso de cdigo, possvel
implementar dispositivos de herana entre os controladores e entre controladores e servios. Por
exemplo, o GoogleComboChartController e o GoogleMotionChartController herdam
comportamento do ChartsController.

A pasta views armazena os arquivos .html com os templates onde os dados processados pelo
controladores so exibidos. Os templates so enxergados pela aplicao como elementos HTML e cada
um gerenciado por um nico controlador. Nem todos os templates precisam ser carregados de uma
vez na interface: o ui-router26, um servio fornecido pela API do AngularJS, pode faz-lo sob demanda.

evidente que esse um mecanismo poderoso de extenso da interface e era precisamente

disso que o dzVis necessitava.

4.4. Controle de Verso

O sistema, por enquanto, s possui um colaborador, mas espera-se que a equipe cresa e se
diversifique. Isso torna a adoo de um controlador de verso imprescindvel onde ela j era altamente
recomendvel.

Por possuir experincia anterior com o Git, 27 resolvi optar por ele.

Recorreu-se intensamente ao controlador durante todo o processo de implementao, fosse

para registrar as mudanas no sotware, apontar falhas ou documentar funcionalidades. Tais registros
podem ser verificados no repositrio do dzVis no Github. 28

26
ui-router: https://github.com/angular-ui/ui-router
27
Git: https://git-scm.com/
28
dzVis no Github: https://github.com/talithafs/dzVis-Package/

23
 4.5. Ferramentas de Desenvolvimento

Relao completa das ferramentas empregadas no desenvolvimento do dzVis e das atividades

relacionadas a cada uma:

RStudio 0.98 servidor monosurio do OpenCPU e implementao em R

Stata MP 13 avaliao do Data Zoom
Git Shell controle de verso
Aptana Studio 3.6 implementao em HTML, CSS, AngularJS e JQuery 29
WAMP Server 2.5 testes preliminares da interface grfica, sem integrao com o R 30
MySQL Workbench 6.3 GUI da base de dados, uso de stored procedures 31
Astah Community 7.0 documentao 32

4.6. Documentao

O R exige que todas as funes de um pacote estejam documentadas. Caso contrrio, o pacote
no poder ser instalado nem mesmo pelo desenvolvedor. O pacote roxygen233 facilita o processo,
criando manuais do R (.rd) a partir dos comentrios no cabealho das funes. A funo
createGoogleComboChart, por exemplo, apresenta o seguinte cabealho (Figura 11):

Figura 11: Cabealho da funo R createGoogleComboChart

29
Aptana Studio: http://www.aptana.com/index.html
30
WAMP Server: http://www.wampserver.com/en/
31
MySQL Workbench: https://www.mysql.com/products/workbench/
32
Astah Community: http://astah.net/editions/community
33
roxygen2: https://cran.r-project.org/web/packages/roxygen2/index.html

24
 Digitando roxygen2::roxygenize()
no console do R, o arquivo de ajuda,
createGoogleComboChart.rd, gerado automaticamente e pode ser acessado atravs do comando
34
?createGoogleComboChart.

Para os mdulos Javascript, a documentao foi gerada atravs de uma ferramenta muito
semelhante ao roxygen2: o JSDoc.35 Um exemplo de cabealho pode ser visto abaixo. Ele pertence ao
arquivo DatabaseTree.js e o descreve (Figura 12):

Figura 12: Documentao com o JSDoc

Para criar as pginas de ajuda associadas ao arquivo DatabaseTree.js, basta digitar ./jsdoc
36
DatabaseTree.js no prompt do Windows.

34
Todos os manuais R para o dzVis podem ser encontrados no Github: https://github.com/talithafs/dzVis-
Package/tree/master/man
35
JSDoc: http://usejsdoc.org/
36
Os manuais dos mdulos Javascript podem ser encontrados aqui: https://github.com/talithafs/dzVis-
Package/tree/master/www/man

25
 4.7. Testes

Felizmente, testes automatizados formais so facilmente implementveis tanto em R quanto em

AngularJS. H muitas ferramentas disponveis e manuais associados. Para as funes R, foi escolhido o
utilitrio testthat do pacote devtools.37 Para a aplicao AngularJS, o Jasmine.38 Ambos esto bem
estabelecidos, contam com uma comunidade ativa e so recomendados por especialistas como Hadley
Wikham (R) e a equipe de desenvolvedores do AngularJS, do Google.39

5. Arquitetura do Sistema
5.1. Viso de Projeto
5.1.1. Diagrama de Componentes (Estado Atual)

A figura abaixo representa as relaes entre os componentes do sistema na forma como ele
hoje (Figura 13):

Figura 13: Diagrama de componentes da verso monousurio do dzVis.

37
devtools vignette: https://cran.r-project.org/web/packages/devtools/devtools.pdf
38
Jasmine: http://jasmine.github.io/1.3/introduction.html
39
Ver referncias bibliogrficas itens [6] e [18]

26
 A aplicao em AngularJS administra todo o trfego de dados entre a interface grfica no
navegador e o servidor, exatamente como em uma aplicao web padro. A diferena, nesse caso, que
o servidor inclui sesses R e so elas que se conectam ao servidor de banco de dados via SSL. Alm
disso, todas as requisies HTTP ao servidor so feitas atravs do cliente JavaScript do OpenCPU (nesse
texto, chamada algumas vezes de API Javascript).

Notar que, no estado atual, as chamadas ao R so enfileiradas pelo servidor local, ou seja, no
so concorrentes nem remotas.

A performance do sistema sob a configurao centralizada ilustrada acima no ideal, mas a

verso serve bem ao propsito de testar localmente e distribuir releases para uso experimental.

5.1.2. Diagrama de Componentes (Prximas Verses)

As prximas verses daro suporte a requisies concorrentes e remotas ao servidor OpenCPU.

Notar que a interface entre o cliente Javascript do OpenCPU e o servidor multi-usurio a mesma que a
da verso monousurio. Portanto, nada dever mudar no cdigo do dzVis. Essa , certamente, uma
tima notcia para os desenvolvedores que participaro do projeto. (Figura 14)

Figura 14: Diagrama de Componentes da verso multi-usurio do dzVis.

27
 5.2. Viso de Implementao

Os diagramas de classe que sero apresentados aqui correspondem apenas parte principal da
aplicao AngularJS. Julgou-se desnecessrio representar as funes R, uma vez que elas possuem
poucas relaes entre si. Vale lembrar que essas funes j esto bem documentadas nos manuais R
gerados pelo roxygen2.40

Alguns detalhes da interface tambm foram omitidos, j que no fazem parte do escopo desse
trabalho, sendo meramente acessrios. Por exemplo, os servios de redimensionamento dos painis.

5.2.1. Diagrama de Classes: Controladores de Grficos

A Figura 15 mostra um diagrama de classes que ilustra as relaes dos controladores de grficos
entre si e com os servios charts e Connection.

O controlador ChartsController administra tarefas comuns a qualquer controlador de

grfico, sendo ele do Google Charts ou no. Ele responsvel por mostrar a lista de grficos disponveis,
carregar o formulrio escolhido, exibir o grfico criado, as eventuais mensagens de erro e um menu que
acompanha todo grfico, operando tambm a lgica desse menu. Por isso, tanto o
GoogleComboChartController quanto o GoogleMotionChartController herdam
comportamento do ChartsController.

Em AngularJS, a herana tambm o melhor mecanismo para a passagem de mensagens. Todos

os eventos disparados pelo ChartsController atravs do mtodo $scope.$broadcast somente
podem ser captado pelos controladores filhos. Da mesma forma, os eventos emitidos pelos filhos
atravs do mtodo $scope.$emit s podem ser capturados pelo controlador pai.

O servio GoogleChartsBase existe para concentrar a execuo de obrigaes compartilhadas

entre os grficos do Google Charts, especificamente. A ligao com os mdulos que o utilizam feita
atravs de agregao, e no atravs de herana. A justificativa que o GoogleChartsBase no lida
diretamente com contedo exibido na interface, ao contrrio de um controlador AngularJS tpico. 41

O servio charts l um arquivo .json com as informaes dos grficos disponveis, assim que a
aplicao carregada.

J o servio Connection encarregado de processar as requisies de funes R ao servidor

OpenCPU. Essas funes se comunicam com a base de dados e criam grficos.

40
Ver sesso 4.6. Documentao
41
Em termos do AngularJS, isso significa que no h two-way data binding entre o escopo de um servio e um
elemento de algum template do sistema. Ver https://docs.angularjs.org/tutorial/step_04 para mais informaes.

28
Figura 15: Diagrama de classes representando as relaes entre controladores de grficos

5.2.2. Diagrama de Classes: Controladores e Configuraes

A Figura 16 mostra um diagrama de classes que ilustra as relaes entre as configuraes da

aplicao AngularJS e os principais controladores.

29
Figura 16: Diagrama de Classes representando as relaes entre controladores e configuraes da aplicao AngularJS

Uma aplicao AngularJS tpica feita de mdulos controladores e servios. Eles so registrados
junto ao mdulo gerenciador da aplicao, o dzvis-app. Esse mdulo responsvel por carregar os
templates e seus controladores, injetando neles todos os servios necessrios.

Como foi dito anteriormente, existe uma hierarquia de controladores. No dzVis, todos
controladores descendem, direta ou indiretamente, do MainController. o controlador encarregado
do plano de fundo da interface, cuidando do redimensionamento dos painis e do roteamento dos
eventos que precisam ser transmitidos entre controladores irmos.

O ChartsController foi comentado na sesso anterior. Os demais controladores

administram a rvore de dados (TreeController), a busca (SearchController) e o painel de
detalhes (DetailsController).

30
5.3. Banco de Dados
5.3.1. Diagrama de Tabelas

A base de dados do dzVis destinada anlise estatstica. Isso significa que, por sua natureza,
ela no relacional, ou seja, no h chaves estrangeiras no modelo. O diagrama abaixo apresenta a
definio das cinco tabelas hoje presentes na base (Figura 17). uma quantidade pequena de dados,
mas suficiente para testar todas as funcionalidades e propriedades desejveis do sistema.

Figura 17: Diagrama de Tabelas do banco de dados do dzVis.

31
 Nota: O SGBD utilizado, MySQL, garante a escalabilidade da base, a nica propriedade que no
testvel quando se tem poucos dados.

5.3.2. Estrutura

A insero de novas tabelas na base de dados do dzVis deve seguir um procedimento padro e
adotar certas convenes. O objetivo fornecer dados consistentes ao usurio, bem como assegurar a
compatibilidade entre as propriedades da base e os programas em R que lero os dados. Alguns dos
padres adotados sero expostos a seguir.

Existem dois tipos de tabelas na base do dzVis: as tabelas de dados e as tabelas de metadados.
O nome da tabela de metadados, por padro, sempre deve ter o formato desc_nome_da_tabela.

A uma tabela de dados sempre deve corresponder uma tabela de metadados que lhe deu
origem. Afinal, as tabelas s podem ser criadas atravs da stored procedure create_dzVis_table,
cuja execuo depende da existncia da tabela de metadados. Elas precisam armazenar as seguintes
informaes:

cod: nomes das colunas da tabela de dados

ctype: tipo das colunas da tabela de dados
alias: descrio curta das colunas da tabela de dados
description: descrio longa das colunas da tabela de dados

As tabelas de metadados foram originalmente concebidas para armazenar os nomes das colunas
das tabelas obtidas no SIDRA, que eram extensos demais para se adequarem manipulao no R.
Percebeu-se, tambm, que esses nomes no se adaptavam bem a menus de interface e a grficos, um
problema bem mais grave para o dzVis. Para que a soluo ficasse completa, alis, foi criada a tabela
tables, cujas colunas so:

name: nomes das tabelas de dados

description: descrio das tabelas de dados
data_frequency: frequncia dos dados das tabelas correspondentes

Assim, no perdida nenhuma informao que pode ser obtida no SIDRA.

32
 6. Extenses

6.1. Regras para a Criao de Modalidades de Grfico

O desenvolvedor precisa criar apenas trs arquivos para que um novo tipo de grfico fique
disponvel no dzVis. Para ilustrar quais so esse arquivos e a quais regras eles devem obedecer, um
exemplo vai ser retirado do prprio dzVis: o Google Motion Chart, tipo de grfico que j foi apresentado
nesse texto.42

Os arquivos necessrios para que o Google Motion Chart funcione no dzVis so:

createGoogleMotionChart.R funo R que cria o grfico

google-motion-chart-template.html formulrio de onde so retirados parmetros
que sero passados para a funo R
GoogleMotionChartController.js controlador do formulrio: faz a validao
dinmica dos parmetros e chama a funo R

A regras para cada arquivo sero pormenorizadas nas prximas sesses.

6.1.1. A funo R

Em primeiro lugar, a documentao deve seguir o padro do roxygen2 para gerao de manuais
R. Explicaes detalhadas podem ser encontradas nesse site:

https://cran.r-project.org/web/packages/roxygen2/vignettes/rd.html

Quaisquer regras de validao dos parmetros devem ser explicitadas na documentao, bem
como o pacote e a funo que ser utilizada para gerar o grfico. O cabealho do arquivo
createGoogleMotionChart.R, contendo essas e outras informaes, reproduzido abaixo.

#' @title Create a Google Combo Chart

#'
#' @description Creates a Combo Chart using the googleVis R package
#'
#' @param table A \code{character}. The name of the table from which the data
should be retrieved
#' @param targetVar A \code{character}. The name of the column with the
vertical axis variable
#' @param groupVar A \code{character}. The name of the column with the
variable by which \code{targetVar} should be grouped
#' @param timeVar A \code{character}. The name of the column with the
horizontal axis variable
#' @param min A \code{numeric} value or a \code{date string} in the format
'yyyy-mm-dd'. Lower bound for the \code{timeVar}

42
Ver Figura 2.

33
#' @param max A \code{numeric} value or a \code{date string} in the format
'yyyy-mm-dd'. Upper bound for the \code{timeVar}
#' @param restrictions A n x 2 \code{matrix}. The n equality restrictions
that make timeVar and groupVar values unique when combined.
#' @param alternatives A n x 2 \code{matrix}. Alternative values of a column
(joined by 'or' conditions in a SQL query). The first column must contain the
names of the columns. The second, its values.
#' @param filename A \code{character}. The name of the .html file where the
chart should be printed. The extension (.html) is not needed.
#'
#' @return A \code{character vector} if the chart was successfully created,
with the name of two files: the .html file where the chart was printed and
the .csv file where the source data was saved.
#' Otherwise, an error string returned by one of validation functions
listed under the 'Parameters validation' section.
#'
#' @section Parameters validation:
#' The parameters are checked according to the rules estabilished in
validation functions and in the following order:
#' \enumerate{
#' \item groupVar: This variable cannot be \code{NULL}.
#' \item targetVar, groupVar, timeVar, min, max, restrictions:
\code{\link{validateGoogleChartParameters}}
#' \item lineVar: \code{\link{validateTargetVariables}} and
\code{\link{validateConsistency}}.
#' \item lineVar, operation, groupVar: If \code{groupVar} is \code{NULL},
\code{lineVar} must be also \code{NULL}. Besides, \code{operation} cannot be
\code{NULL} when \code{lineVar} is not \code{NULL}.
#'}
#'
#' @seealso \code{\link[googleVis]{gvisMotionChart}}
#'
#' @export
#' @import googleVis

O programador livre para eleger os argumentos da funo. Entretanto, eles devem ser
processados para evitar problemas de compatibilidade. A justificativa que a API do OpenCPU tem a
desvantagem de no converter o valor null do Javascript para o valor NULL do R e no existe um valor
em Javascript que seja equivalente ao NA do R.

Para contornar esse problema, a funo createGoogleMotionChart transforma em nulas todas

as variveis que no forem recebidas ou forem recebidas como uma string vazia ou um vetor vazio:

createGoogleMotionChart <- function(table, targetVar, groupVar, timeVar, min

= NA, max = NA, restrictions = NULL, alternatives = NULL, filename = NULL){

#-- Processamento dos parmetros

if(!is.null(restrictions) && length(restrictions) == 0){
restrictions <- NULL
}

if(!is.null(alternatives) && length(alternatives) == 0){

alternatives <- NULL
}

34
 if(!is.na(min) && min == ""){
min <- NA
}

if(!is.na(max) && max == ""){

max <- NA
}

if(!is.null(groupVar) && groupVar == ""){

groupVar <- NULL
}
## (CONTINUA)

A sada deve ser um vetor contendo dois elementos, nessa ordem:

O nome de um arquivo .html onde o grfico foi impresso

O nome de um arquivo .csv onde os dados utilizados no grfico foram salvos

Importante: em caso de erro, deve-se retornar apenas uma string contendo a mensagem de
erro, e no um vetor.

Recomenda-se que o desenvolvedor leia os manuais da API R oferecida pelo dzVis. Vrias
funes foram implementadas pensando em abstrair a lgica de rotinas comuns e facilitar ainda mais a
incorporao de novos grficos ao sistema. As funes importData, formatDates, getColumnAlias
e printChartData, por exemplo, podem ser particularmente teis.

6.1.2. O template

O template pode ficar a critrio do programador. No entanto, aconselha-se que sejam utilizadas
algumas classes CSS pr-definidas no arquivo main.css exclusivamente com o propsito de ajudar o
desenvolvedor. Para um melhor resultado, o espao do formulrio deve ser dividido em trs colunas,
onde at trs elementos podem ser inseridos, e cada elemento deve pertencer a somente uma classe.

A lista abaixo mostra as classes disponveis, o tamanho dos elementos <div> que pertencem a
elas, os elementos que devem ser colocados no <div> e exemplos de utilizao. Os exemplos foram
retirados do arquivo google-combo-chart-template.html, que contm uma variedade maior de
elementos em comparao ao anlogo google-motion-chart-template.html:

.selection-input: ocupam 1/3 do espao vertical de uma coluna; se <select>

possuir o atributo multiple, 2/3. O <div> deve englobar um <label> e um <select>.

<div class="selection-input">
<label>{{targetVarLabel}}</label>
<select ng-model="targetSelection" ng-
change="targetSelectionChanged(targetSelection)" ng-options="opt
as opt.text for opt in targetOptions" multiple>
</select>
</div>

35
 .date-input: ocupam 2/9 do espao vertical de uma coluna. O <div> deve englobar
um <label>, um <input> e um <p>.

<div class="date-input"
<label>{{minLabel}}</label>
<input id="gcc-min-date" type="month" ng-model="minDate"
value="{{minDate}}" min="{{lowerBound}}" max="{{maxDate}}">
<p>{{lowerBound | date:'dd-MM-yyyy'}}</p>
</div>

.no-option: ocupam 1/9 do espao vertical de uma coluna. O <div> deve englobar
um <p>.

<div class = "no-option">

<p class="switch" ng-
click="selectMultipleDates()">{{selectMultipleDatesLabel}}</p>
</div>

.list-input: ocupam 2/3 do espao vertical de uma coluna. O <div> deve englobar
um <label> e uma <div class=table-scroll> contendo um <table>.

<div class="list-input">
<label>{{filtersLabel}}</label>
<div class="table-scroll">
<table ng-repeat="filter in filters">
<tr ng-model="filter">
<td>{{filter.column.text}}</td>
<td>----</td>
<td>{{filter.value.text}}</td>
</tr>
</table>
</div>
</div>

.radio-input: ocupam 1/3 do espao vertical de uma coluna. O <div> deve englobar
um <label> e um <div class=inline> com um <input type=radio>.

<div class="radio-input">
<label>{{operationLabel}}</label>
<div class="inline" ng-repeat="operation in operations">
<input name="ops" type="radio" ng-
model="operationSelection.value" ng-
change="operationSelectionChanged(operationSelection.value)"
value="{{operation.value}}">{{operation.name}}
</div>
</div>

36
 .text-input: ocupam 4/9 do espao vertical de uma coluna. O <div> deve englobar
um <textarea>.

<div class="text-input" ng-show="multipleDatesMode">

<textarea ng-model="multipleDates" rows="2"
placeholder="{{placeholder}}"> </textarea>
</div>

6.1.3. O controlador

O programador possui somente duas obrigaes em relao ao controlador: subscrev-lo aos

eventos $stateChangeSuccess, nodeChecked, nodeUnchecked, $destroy e createChart,
tratando-os adequadamente, e validar o formulrio dinamicamente e de acordo com as regras
estabelecidas nos manuais R, mostrando apenas as opes vlidas ao usurio. O resto opcional.

A lista abaixo d informaes sobre cada evento mencionado. indicado onde o evento se
origina, o que o controlador deve fazer quando o captura e um exemplo de listener. Os exemplos foram
retirados do controlador GoogleMotionChartController.

Nota: Observe que os quatro primeiros listeners dependem do objeto base. Esse objeto o
singleton da classe GoogleChartsBase, servio implementado para executar tarefas comuns aos
formulrios e templates que geram grficos do pacote googleVis. O objeto tambm gerencia uma cache
com dados que no so destrudos pelos ciclos $digest do AngularJS, a menos que o usurio escolha um
grfico que no pertena ao googleVis.

$stateChangeSuccess: Disparado pelo ui-router quando carrega o template. O

controlador deve preencher o formulrio e valid-lo automaticamente, a partir do
estado da rvore de dados, isto , dos ns marcados.

$scope.$on("$stateChangeSuccess", function(){

base.onLoad(fillOptions);
});

Nota: fillOptions uma callback implementada no controlador.

nodeChecked: Disparado pelo jstree, tratado pelo TreeController e re-

transmitido. O controlador deve adicionar um novo dado ao formulrio, o n recm-
marcado, e valid-lo automaticamente.

$scope.$on("nodeChecked", function(e, node){

base.onNodeChecked(node, addOption) ;
});

37
 Nota: addOptions uma callback implementada no controlador.

nodeUnchecked: Disparado pelo jstree, tratado pelo TreeController e re-

transmitido. O controlador deve retirar um dado do formulrio, o n recm-
desmarcado, e reorganizar os campos de entrada, se for o caso.

$scope.$on("nodeUnchecked", function(e, node){

base.onNodeUnchecked(node, removeOption);
});

Nota: removeOptions uma callback implementada no controlador.

$destroy: Disparado pelo $rootScope quando ir destruir um escopo e remov-lo

do do escopo-pai, isto , quando um template e um controlador sero retirados da
memria. O controlador deve esvaziar sua cache e desfazer qualquer mudana externa
que tenha provocado (por exemplo, nos checkboxes da rvore de dados).

$scope.$on("$destroy", function(){

base.onDestroy();
});

createChart: Disparado pelo chartController quando o boto Criar Grfico

clicado. O controlador deve chamar a funo de criao do grfico correspondente
atravs do servio Connection, e emitir para o ChartController o evento
chartCreated, em caso de sucesso, ou o evento chartError, em caso de erro. O
evento chartError deve re-transmitir a mensagem (string) de erro enviada pela
funo de criao. O evento chartCreated deve transmitir um objeto com quatro
propriedades:
o chartFilePath: string. Localizao no servidor do arquivo .html que contm
o grfico. Recebido atravs da funo de criao do grfico.
o sourceDataPath: string. Localizao no servidor do arquivo .csv que contm
os dados que foram utilizados no grfico. Recebido atravs da funo de
criao do grfico.
o height: numrico. Altura do grfico, em pixels.
o width: numrico. Largura do grfico, em pixels.

38
 $scope.$on("createChart", function(){

var callback = function(chartFilePath, sourceDataPath){

if(chartFilePath != "ERROR"){
$scope.$emit("chartCreated",{ chartFilePath : chartFilePath,
sourceDataPath : sourceDataPath,
width : 730,
height : 320
});
}
else {
$scope.$emit("chartError", sourceDataPath);
}
};

connection.createGoogleMotionChart( table = table

targetVar = target,
groupVar = group,
timeVar = time,
min = min,
max = max,
restrictions = restrictions,
alternatives = alternatives,
callback = callback );
});

6.2. Integrao dos Novos Mdulos

Em um futuro no muito distante, ser implementado um instalador para agregar ao dzVis os

trs arquivos descritos na sesso anterior. Por enquanto, a configurao do ambiente feita
manualmente, como explicado a seguir.

Primeiramente, deve-se criar uma funo Javascript que chame a funo R de criao do grfico
com o qual se est trabalhando. No preciso conhecer nada a respeito da implementao da funo R,
apenas sua assinatura. Assim, seja uma funo R com a seguinte assinatura:

createGoogleMotionChart <- function(table, targetVar, groupVar,

timeVar, min = NA, max = NA, restrictions = NULL, alternatives = NULL,
filename = NULL)

O mtodo correspondente, em Javascript, deve ser:

var createGoogleMotionChart = function(table, targetVar, groupVar,

timeVar, min, max, restrictions, alternatives, callback){

var parameters = {
table : table,
targetVar : targetVar,

39
 groupVar : groupVar,
timeVar : timeVar,
min : min,
max : max,
restrictions : restrictions,
alternatives : alternatives
};

createChart("createGoogleMotionChart", parameters, callback);

};

Esses mtodos devem ser inseridos no arquivo Connection.js, dentro da definio da classe
Connection, onde tambm precisam ser prototipados:

Connection.prototype.createGoogleMotionChart = function(table,
targetVar, groupVar, timeVar, min, max, restrictions, alternatives,callback){

createGoogleMotionChart.call(this, table, targetVar, groupVar, timeVar,

min, max, restrictions, alternatives, callback);

};

obrigatrio que a nica atividade que mtodos de criao de grfico executem seja a chamada
ao mtodo createChart, da mesma classe, com os parmetros apropriados. createChart definida
da seguinte forma:

/** @function createChart(functionName, parameters, callback)

* @description Standard function to create charts using opencpu.
* @param {string} functionName The name of the R function to be evoked
* @param {Object} parameters Parameters of the R function.
* @param {function} callback The function that must be executed after
the chart is created.
*/

var createChart = function(functionName, parameters, callback){ () }

O segundo passo para integrar a nova funcionalidade incluir o template e o controlador na

aplicao AngularJS e registr-los junto ao ui-router. No caso do Google Motion Chart, anlogo a
qualquer outro, as seguintes linhas de cdigo foram inseridas:

No arquivo index.html, dentro do elemento <body>

<script
src="js/controllers/charts/GoogleMotionChartController.js"</scrip
t>

No arquivo dzvis-app.js, dentro da funo que argumento para

application.config()

40
 $stateProvider.state("Google Motion Chart", {
url: "",
templateUrl: "views/google-motion-chart-template.html",
controller: "GoogleMotionChartController",
data : {
type : "googlevis"
}
});

7. Interao com o Usurio

7.1. Instalao

A instalao da verso monousurio do dzVis, a nica distribuda at o momento,43 simples.

Requer apenas que o usurio possua o R instalado em sua mquina e digite cinco comandos curtos no
console do R.

O R pode ser baixado nesse endereo:

https://cran.r-project.org/bin/

Na linha de comando do R, o usurio deve digitar:

> install.packages(c("opencpu", "devtools")) #instala o OpenCPU e o

devtools

> library(devtools) #carrega o devtools, pacote responsvel pela

instalao a partir do Github

> devtools::install_github('talithafs/dzVis-Package')

> library(opencpu) #carrega o pacote opencpu

> library(dzVis) #carrega o pacote dzVis

Importante: No Windows, o caracter / deve ser substitudo por // no caminho para o arquivo
.tar, uma vez que o R usa / como caracter de escape.

7.2. Utilizao da Interface Grfica

Para abrir a interface grfica do dzVis, basta digitar um comando no console do R:

> opencpu$browse('/library/dzVis/www')

43
Ver sesso 5.1.1. Diagrama de Componentes (Estado Atual)

41
 O navegador padro do usurio abrir diretamente na pgina inicial do dzVis (Figura 18). Na
realidade, essa a nica pgina do site, j que se trabalha com o conceito de templates.

Figura 18: Pgina principal - e nica - do dzVis

O primeiro passo que o usurio pode dar selecionar o grfico desejado na combo sob o label
Escolha um tipo de grfico, como na figura abaixo. Mas ele tambm pode escolher os dados na rvore
no painel esquerda. O dzVis no requer que quaisquer escolhas do usurio sigam uma ordem
especfica. O exemplo dado nesse texto segue um fluxo meramente ilustrativo.

Figura 19: Combo para a escolha do tipo de grfico.

Para utilizar a GUI o formulrio - do grfico, o usurio deve clicar no link Usar este grfico ,
localizado logo abaixo da figura que ilustra o grfico escolhido. O template selecionado carrega
imediamente. (Figura 20)

42
Figura 20: Pgina do dzVis aps o carregamento do template do Google Combo Chart.

Para escolher com qual tabela e com quais colunas se deseja trabalhar, suficiente que se
utilize as checkboxes da rvore no painel [bases de dados]. (Figura 21)

Figura 21: rvore de dados e suas checkboxes para seleo de tabelas e colunas.

H um pequeno sistema de busca que pode ajudar o usurio a encontrar os dados que
necessita. Para utiliz-lo, deve-se clicar no boto [busca], que abre um painel pull-down com uma
textbox. Conforme se digita o termo de busca na textbox, os resultados vo sendo grifados na rvore.
(Figura 22)

43
 Nota: A altura e a largura dos painis [bases de dados] e [busca] podem ser ajustadas. A Figura
22 ilustra, tambm, esse fato.

Figura 22: Busca em tempo real na rvore de dados.

Aps selecionar a primeira coluna, o usurio notar algumas mudanas. (Figura 23) O nome da
coluna entrar em algum campo do formulrio, a coluna Ms ser selecionada automaticamente e
sua checkbox na rvore, desativada, e os detalhes da coluna e da tabela aparecero no painel
[detalhes].

Alm disso, os limites inferior e superior das datas aparecero ao lado dos campos Incio e
Fim. Isso acontece porque, naturalmente, s pode haver uma varivel temporal em uma tabela, que o
dzVis reconhece de modo automtico. O Google Combo Chart, assim como o Google Motion Chart,
sempre precisam dessa varivel. por essa razo que o usurio impedido de desmarcar o n
correspondente da rvore. (Figura 23)

44
Figura 23: Resultado da primeira seleo na rvore de dados.

Conforme o usurio escolhe mais dados, o formulrio vai sendo preenchido automaticamente,
como os requisitos de validao dinmica prescreviam.44 (Figura 24) As regras para a validao podem
ser encontradas nos manuais R do dzVis.45

Figura 24: Resultado da escolha de outros parmetros na rvore de dados.

Para criar o grfico, o usurio de deve clicar no boto Criar Grfico no canto inferior direito do
formulrio. Caso deixe de escolher alguma varivel essencial para a construo do grfico, mas que no
tem como ser prevista pelo sistema (como foi o caso da varivel temporal), uma mensagem de erro
exibida. (Figura 25)

44
Ver sesso 3.2. Requisitos da Interface Grfica
45
Ver sesso 4.6. Documentao

45
 Nota: A mensagem de erro pode ser fechada a qualquer momento, mas desaparecer quando o
primeiro grfico for criado. O painel de informao tambm pode ser fechado e, uma vez fechado, no
aparecer outra vez.

Figura 25: Mensagem de erro.

O usurio pode optar por outro tipo de grfico quando quiser. Para isso, basta clicar no link
Escolher outro grfico, no canto inferior esquerdo do formulrio. As mesmas variveis que estavam
em uso antes da troca sero carregadas para o novo formulrio, sem perdas.

Se um dado de uma outra tabela for selecionado, o sistema apaga do formulrio os dados da
tabela anterior e carrega uma nova varivel temporal, com seus limites. Isso ocorre porque ainda no h
suporte para a unio de tabelas.

Finalmente, se a criao do grfico for bem sucedida, o usurio se deparar com uma tela
semelhante exibida abaixo (Figura 26):

46
Figura 26: Pgina do dzVis quando a criao de um Google Combo Chart bem sucedida.

O grfico que aparece na figura anterior pode ser visto em detalhe na figura a seguir (Figura 27):

Figura 27: Detalhe do grfico mostrado na figura 23.

Observe que o grfico vem acompanhado de um pequeno menu onde o usurio pode baixar um
arquivo .html com o grfico e/ou um arquivo .csv com os dados representados nele. H tambm a opo
de copiar um cdigo para adicionar o grfico a um website, servindo o arquivo .html a partir do
OpenCPU. (Figura 28)

Como o dzVis ainda monousurio, esta ltima funcionalidade contm uma limitao: os
arquivos ficam armazenados no servidor local e, por default, no podem ser servidos a partir dele, a
menos que o usurio saiba configur-lo. Essa questo ser resolvida nas prximas verses.

47
 Figura 28: Detalhe do menu de um grfico.

No caso do Google Combo Chart, o usurio ainda pode selecionar datas especficas clicando no
link Selecionar mltiplas datas no formulrio. (Figura 29)

Figura 29: Seleo de intervalo.

Para voltar atrs, h o link Selecionar intervalo. (Figura 30)

Figura 30: Seleo de mltiplas datas.

Para evitar problemas de compatibilidade com diferentes navegadores, as datas, mltiplas ou

no, so validadas somente quando o usurio clica em Criar Grfico. (Figura 31)

48
Figura 31: Mensagem de data invlida.

Um exemplo de grfico gerado a partir de mltiplas datas pode ser visto na Figura 32.

Nota: Alm dos limites, o formato em que as datas foram digitadas e as restries de ms e dia
do ms tambm so validados.

Figura 32: Exemplo de grfico gerado a partir de mltiplas datas.

49
 Resta ainda comentar uma outra funcionalidade do dzVis: a visualizao dos dados em si.
Quando alguma coluna da rvore de dados selecionada, o painel [detalhes] oferece a opo Ver
Dados. Ao clicar nessa opo, aparecem os dados da coluna escolhida. O usurio, ento, pode
modificar a quantidade de dados exibida, clicando na combo box, ou voltar para a descrio da coluna,
clicando em Voltar. (Figura 33)

Figura 33: Visualizao dos dados de uma coluna.

Por ltimo, apresento com a figura abaixo o exemplo de um outro tipo de grfico que pode ser
gerado com o dzVis. exatamente aquele que motivou o desenvolvimento desse trabalho: o Google
Motion Chart. (Figura 34)

Figura 34: Pgina do dzVis quando a criao de um Google Motion Chart bem sucedida.

50
8. Testes

Os testes realizados at agora foram ad hoc, isto , interativos. Adotou-se uma postura
disciplinada para a liberao do uso de novos mdulos. Suas funcionalidades foram colocadas prova de
modo incremental, com rigor. A cada nova pequena modificao, antes de ser integrado ou re-integrado
ao sistema, o mdulo era submetido a uma bateria de testes. Caso um problema ficasse muito tempo
sem resoluo e o processo de desenvolvimento precisasse seguir, procurava-se isolar o elemento
defeituoso e registrar uma issue relacionada no Github, a ser solucionada em momento oportuno.46

O pacote R contou com o apoio da linha de comando, que permite testar as funes
implementadas sem que elas tenham sido intregadas ao pacote, protegendo-o. Nenhuma funo foi
exportada sem que se tivesse certeza de que todas as suas especificaes, disponveis de antemo nos
manuais R47, estivessem sendo cumpridas. Foram testadas entradas, sadas e condies segundo um
roteiro pr-estabelecido, especfico de cada funo.

As funes e mdulos em Javascript tambm possuem manuais que propiciaram o

estabelecimento de roteiros de teste. Neste caso, no entanto, os testes se deram via interface grfica.

A propsito da interface, os casos de uso principais foram testados. So eles:

Visualizar os dados de uma coluna

Realizar busca em tempo real
Selecionar n na rvore de dados
Desmarcar n da rvore de dados
Carregar formulrio
Trocar de formulrio
Criar grfico
Baixar arquivo com o grfico
Baixar arquivo com os dados
Copiar cdigo do grfico

Estes casos de uso aninham outros, particulares aos formulrios dos grficos. Todos foram
testados e, at onde se sabe, a interface tem exatamente o comportamento esperado.

Planeja-se distribuir o pacote dzVis para uso experimental, recolhendo informaes sobre
melhorias e falhas junto aos usurios. Mas, primeiro, preciso escrever testes unitrios de qualidade e
acrescent-los ao workflow do desenvolvimento de verses futuras.

46
Todas as issues levantadas podem ser encontradas aqui: https://github.com/talithafs/dzVis-Package/issues
47
Ver sesso 4.6. Documentao

51
9. Consideraes Finais e Trabalhos Futuros

O dzVis foi projetado para crescer. Como foi enfatizado vrias vezes neste texto, uma de suas
principais caractersticas, seno a principal, a extensibilidade. O intuito sempre foi adicionar uma srie
de novos grficos s prximas verses, tornando-as to versteis quanto os pacotes R em sua base.
Considero que obtive xito nesse quesito. H planos concretos de implementar essas extenses e
nenhuma delas implica em mudanas estruturais. At mesmo a mais impactante transformao
prevista, a migrao para um sistema multi-usurio, no deve ter efeitos colaterais no cdigo do sistema
como hoje.48

Outras funcionalidades que sero acrescentadas:

Opes de busca: foi deixado um espao livre no painel de busca justamente para
ampliar as opes. O usurio deve ser capaz de filtrar sua busca, restringindo-a a
tabelas, colunas ou categorias. A rvore de dados, que pode ser muito longa, deve
mostrar apenas as tabelas que contm resultados.
Ferramenta para alterar o tamanho do grfico.
Sistema de guias para grficos, de modo que mais de um grfico possa ficar disponvel
para o usurio simultaneamente.
Instalador tanto para o pacote dzVis quanto para extenses.
Upload de arquivos de dados pelo usurio.

De qualquer forma, o sistema no estado atual cumpre muito bem sua funo: o dzVis j possui
uma mirade de vantagens em relao s ferramentas de criao de grfico atualmente disponveis.
Acredito que at mesmo profissionais no ligados anlise de dados propriamente dita, como
historiadores e cientistas polticos, podem ser atrados por sua facilidade de uso e eficncia de
resultados. Na realidade, esse era um dos objetivos no confessos desse trabalho.

Estas conquistas so bastante satisfatrias por si s. Mas, acima de tudo, o desenvolvimento do

dzVis me proporcionou um vasto aprendizado, me habilitando a concluir o curso de Engenharia da
Computao da PUC-Rio com os conhecimentos pertinentes rea perfeitamente atualizados e no
mais restritos ao ambiente profissional e acadmico.

48
Ver sesso 5.1.1. Diagrama de Componentes (Estado Atual)

52
10. Referncias Bibliogrficas

1. Ooms, Jeroen. The OpenCPU System: Towards a Universal Interface for Scientific Computing
through Separation of Concerns. UCLA Department of Statistics. Junho de 2014.
2. Ooms, Jeroen. The OpenCPU Server PDF Manual Version 1.4. UCLA Department of Statistics.
Junho de 2014.
3. Bassil, Youssef. A Comparative Study on the Performance of the Top DBMS Systems. Journal of
Computer Science & Research (JCSCR). Vol. 1, No. 1. Fevereiro de 2012.
4. Gessman, Markus; De Castillo, Diego. Using the Google Chart Tools with R: googleVis-0.5.10
Package Vignette. CRAN. Agosto de 2015.
5. Wickham, Hadley. Advanced R. Chapman and Hall. Setembro de 2014.
6. Wickham, Hadley. R Packages. O'Reilly Media. Abril de 2015.
7. Rauschmayer, Axel. Speaking JavaScript: An In-Depth Guide for Programmers. O'Reilly Media.
Fevereiro de 2014.
8. Peng, Roger; Leek, Jeff; Caffo, Brian. R Programming. Universidade John Hopkings.
https://www.coursera.org/learn/r-programming. Acesso em outubro de 2015.
9. Peng, Roger; Leek, Jeff; Caffo, Brian. Getting and Cleaning Data. Universidade John Hopkings.
Disponvel em https://www.coursera.org/learn/data-cleaning. Acesso em novembro de 2015.
10. Peng, Roger; Leek, Jeff; Caffo, Brian. Developing Data Products. Universidade John Hopkings.
Disponvel em https://www.coursera.org/learn/data-products. Acesso em dezembro de 2015.
11. Rossiter, David. HTML, CSS & Javascript. Universidade de Cincia e Tecnologia de Hong-Kong.
Disponvel em https://www.coursera.org/learn/html-css-javascript. Acesso em novembro de 2015.
12. Van Lent, Coleen. Introduction to HTML5. Universidade de Michigan. Disponvel em
https://www.coursera.org/learn/html. Acesso em novembro de 2015.
13. Van Lent, Coleen. Introduction to CSS3. Universidade de Michigan. Disponvel em
https://www.coursera.org/learn/introcss. Acesso em novembro de 2015.
14. Muppala, Jogesh K. Front-End Web UI Frameworks and Tools. Universidade de Cincia e Tecnologia
de Hong-Kong. Disponvel em https://www.coursera.org/learn/web-frameworks/. Acesso em
dezembro de 2015.
15. Codeschool. Shaping Up with AngularJS. Disponvel em
https://www.codeschool.com/courses/shaping-up-with-angular-js. Acesso em dezembro de 2015.
16. Codecademy. jQuery. Disponvel em https://www.codecademy.com/learn/jquery. Acesso em
novembro de 2015.
17. Codecademy. Learn AngularJS. Disponvel em https://www.codecademy.com/learn/learn-angularjs.
Acesso em dezembro de 2015.
18. Google. AngularJS Unit Testing. Disponvel em https://docs.angularjs.org/guide/unit-testing. Acesso
em janeiro de 2016.
19. Walton, Phillip. Implementing Private and Protected Members in JavaScript. Disponvel em
http://philipwalton.com/articles/implementing-private-and-protected-members-in-javascript/.
Acesso em janeiro de 2016.

53
20. Crockford, Douglas. Private Members in Javascript. Disponvel em
http://javascript.crockford.com/private.html. Acesso em janeiro de 2016.
21. jQuery. Code Organization Concepts. Disponvel em https://learn.jquery.com/code-
organization/concepts/. Acesso em novembro de 2015.
22. Gamma, Erich et al. Design Patters: Elements of Reusable Object Oriented Software. Addison-
Wesley. 1998.

54