4 Técnicas de Filtragens Aplicadas às Visões do Ambiente de Autoria do Sistema HyperProp

Transcrição

1 4 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp U prolea enfrentado pelos usuários que traalha co estruturas de dados grandes é a desorientação na usca por deterinada inforação. Essa desorientação é causada pelo núero elevado de vértices e arestas. Dentre as técnicas ais couns para a apresentação das estruturas, pode ser citadas o uso de recursos de zoo e scroll e partes da estrutura. Entretanto, a técnica que se ostra ais eficaz, eora ais coplexa, é a filtrage de partes da estrutura não relevantes para o usuário. A dificuldade é identificar quais partes da estrutura realente são relevantes. Ua solução uito aplicada nos editores de estruturas coplexas para filtrar inforações é a técnica olho-de-peixe (Furnas, 1986). Este capítulo está dividido da seguinte fora: na Seção 4.1 será explicada a técnica de filtrage olho-de-peixe e sua extensão para grafos copostos. Para u elhor entendiento da técnica olho-de-peixe utilizada no sistea HyperProp, a Seção 4.2 está dividida e três suseções. A Suseção apresenta a técnica olho-de-peixe sore a visão estrutural do sistea HyperProp co ase no exeplo ilustrado na Seção 4.1. A Suseção deonstra o funcionaento da visão olho-de-peixe na visão espacial na especificação de layout sincronizada co a visão declarativa. Por fi, a Suseção analisa os cálculos realizados para filtrage na especificação de layout na visão espacial Técnica de Filtrage Olho-de-Peixe aplicada e Grafos Copostos A visão olho-de-peixe, proposta por Furnas (Furnas, 1986) para estruturas hierárquicas, atua coo ua lente, preservando os detalhes próxios a u ponto escolhido (vértice e foco) e, à edida que se afasta desse ponto, exiindo enos inforação (apenas as inforações ais iportantes segundo critérios que serão explicados no próxio parágrafo).

2 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 59 A estratégia do olho-de-peixe é definir ua função de grau de interesse, que atriui a cada eleento do grafo u valor que representa o grau de interesse do usuário e relação ao eleento e foco. A idéia principal é que essa função grau de interesse (DOI(x,y)) auente co a iportância a priori (API(x)) do eleento x e diinua co a distância (D(x,y)) entre os eleentos x e y, sendo o eleento y o foco. Assi, te-se: DOI(x,y) = API(x) D(x,y). A filtrage dos vértices é realizada escolhendo u deterinado valor k para o corte, de odo a exiir soente os eleentos x que possuíre u DOI(x,y) k. Variando o valor de k, que pode ser interpretado coo o nível de detalhe desejado, oté-se diferentes visões olho-de-peixe para o eso grafo. A proposta original de Furnas é aplicada e estruturas onde a função DOI(x,y) pode ser facilente definida, coo e listas e árvores. Para a utilização da técnica olhode-peixe no sistea Hyperprop, a esa teve de ser estendida para ser aplicada e grafos copostos (Muchaluat-Saade et al., 1998), levando e conta tanto as relações de aninhaento coo relações de arestas entre os vértices para calcular quais os vértices e arestas são visíveis. No caso de grafos copostos, a iportância a priori API(x) de u vértice x é dada pelo valor negativo do nível de aninhaento do vértice oservado e relação ao vértice coposto ais externo (no caso, o próprio grafo ou u vértice coposto do grafo que tenha sido eleito coo o escopo da filtrage 1 ). Assi, API(x) = -i onde i é o nível de profundidade do vértice e relação ao vértice coposto eleito coo escopo. A Figura 4-1 ilustra u exeplo de cálculo da função API(x) para grafos copostos. 1 Se u vértice coposto é eleito coo sendo o escopo para filtrage significa que apenas os vértices diretaente ou recursivaente contidos no vértice coposto pode vir a ser exiidos. No caso default, o próprio grafo pode ser entendido coo o vértice coposto eleito coo escopo.

3 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 60 API(x) vértice atôico vértice coposto apeaento ind Figura 4-1 Exeplo de cálculo de API(x) para grafos copostos A segunda coponente da função DOI, a distância D(x,y), é coputada entre u vértice x e o vértice y (vértice e foco) da seguinte fora: D(x,y) = in(dc(x,y) + wc, De(x,y) + we). A função Dc(x,y) é a distância ínia entre os vértices x e y considerando soente a relação de aninhaento das estruturas de coposição, que será explicada elhor nos próxios parágrafos, e a função De(x,y) é a distância ínia entre x e y considerando soente os relacionaentos por arestas. Se não há u cainho de arestas ligando os dois vértices, a distância D(x,y) é equivalente a Dc(x,y). As constantes wc e we representa os pesos que estes dois étodos de navegação (Dc(x,y) e De(x,y)) tê no cálculo da visão olho-de-peixe. A diferença entre esses pesos deterina ua prioridade na exiição dos vértices relacionados ao vértice e foco pela estrutura de coposição ou por arestas. A distância Dc(x,y), considerando-se a navegação e profundidade (aseada apenas no aninhaento de vértices copostos), do foco y para o vértice x é dada por: Dc(x,y) = dist a + dist d. O valor de dist a é a distância ascendente, calculada adicionando-se ua unidade para cada passo (passage de u vértice para seu respectivo pai (vértice coposto)) no cainho ascendente desde o vértice y (foco) até que o prieiro vértice coposto ancestral cou aos vértices x e y seja alcançado.

4 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 61 O valor de dist d é a distância descendente, calculada adicionando-se ua unidade para cada passo (passage para o vértice filho (coposto ou atôico)) no cainho descendente entre o vértice coposto ancestral cou encontrado no cálculo da distância dist a e y. Ao final, se a distância do cainho descendente é aior que zero, soa-se o valor calculado co o valor de dist a. E outras palavras, dist d = cainho descendente + dist a, se cainho descendente > 0. O valor dist a é usado no cálculo de dist d para anter a relação de distância do vértice ancestral cou e o vértice co foco. A Figura 4-2 ilustra u exeplo de cálculo da função Dc(x,y) para grafos copostos. Dc(x,y) Foco(y) vértice atôico vértice coposto apeaento ind Figura 4-2 Exeplo de cálculo de Dc(x,y) para grafos copostos Para calcular a distância considerando a navegação por arestas De(x,y), deve-se, para cada aresta (inds e apeaentos, vide Seção 2.1) percorrida entre os vértices x e y, adicionar ua unidade. A distância De(x,y) será igual ao valor ínio encontrado entre todos os cainhos possíveis entre x e y. Note que pode existir ais de u cainho relacionando os vértices x e y por arestas. Para tal cálculo de De(x,y), pode ser usado o algorito de Dijkstra (Coren et al., 2001), que calcula o enor cainho entre dois vértices nu grafo não-orientado. A Figura 4 ilustra u exeplo de cálculo da função De(x,y) para grafos copostos.

5 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 62 De(x,y) Foco(y) vértice atôico vértice coposto apeaento ind Figura 4 Exeplo de cálculo de De(x,y) para grafos copostos Apenas a título de ilustração, a Figura 4-4 apresenta os valores dos vértices considerando a função D(x,y) = in(dc(x,y) + wc, De(x,y) + we) e as distâncias das Figuras 4-2 (Dc(x,y)) e 4 (De(x,y)). Para esse caso e particular, as constantes wc e we fora atriuídas co valor zero. D(x,y) Foco(y) vértice atôico vértice coposto apeaento ind Figura 4-4 Exeplo de cálculo da função D(x,y) para grafos copostos aseado nas Figuras 4-2 (Dc(x,y)) e 4 (De(x,y)) A Figura 4-5 apresenta os valores dos vértices para a função DOI(x,y) = API(x) D(x,y) aseados na Figuras 4-1 (API(x)) e 4-4 (D(x,y)).

6 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 63 DOI(x,y) Foco(y) vértice atôico vértice coposto apeaento ind Figura 4-5 Exeplo de cálculo da função DOI(x,y) para grafos copostos aseado nas Figuras 4-1 (API(x)) e 4-4 (D(x,y)) Caso o usuário escolha o valor de k igual a enos cinco, por exeplo, soente os vértices co grau de interesse aior ou igual a enos cinco serão visualizados pelo usuário Filtrage Olho-de-Peixe no Sistea HyperProp O sistea HyperProp, na ipleentação atual, utiliza a filtrage olho-de-peixe nas visões estrutural, declarativa e na especificação do leiaute na visão espacial, podendo a esa ser aplicada a qualquer oento durante a edição e navegação dos docuentos. Confore o usuário altera o parâetro k ou seleciona u novo vértice coo foco, os deais vértices são exiidos e/ou excluídos nas visões espacial, estrutural e declarativa, de fora sincronizada.

7 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp Filtrage olho-de-peixe na Visão Estrutural A técnica de filtrage olho-de-peixe foi reintegrada à visão estrutural do sistea HyperProp e sincronizada co a visão declarativa. Para usar a visão olho-de-peixe na visão estrutural, o usuário deve inicialente ativar a técnica de filtrage clicando na opção View da arra de enu da visão estrutural e, e seguida, selecionar na opção FishEye. Nesse instante, todos os vértices copostos são fechados na visão do grafo. A Figura 4-6 ilustra a visão estrutural do sistea HyperProp apresentando u grafo coposto co todos seus vértices desenhados. Nesse oento, a técnica de filtrage olho-de-peixe ainda não foi aplicada sore o grafo. Figura 4-6 Visão estrutural se a técnica olho-de-peixe A escolha do vértice a ser utilizado coo foco é realizada após a ativação da filtrage. Para definir u vértice coo foco, o usuário deve selecioná-lo co o otão direito do ouse e, e seguida, escolher a opção Focus entre as alternativas de enu exiida sore o vértice. Os parâetros de configuração (k, wc e we) da visão olho-depeixe pode ser alterados através da janela FishEye Configuration.

8 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 65 Para exiir a janela FishEye Configuration o usuário deve selecionar a opção View da arra de enu da visão estrutural e depois selecionar a alternativa Configure. Oserve na Figura 4-7 que e u deterinado oento da navegação o usuário escolheu coo foco o vértice elig. E seguida, ativou a janela FishEye Configuration para configurar a visão olho-de-peixe co nível de detalhe no valor de 25% de sua visualização inicial. Isto fez co que apenas os vértices elig, iagecopig e ingredientes fosse exiidos. Figura 4-7 Visão olho-de-peixe co 25% de Nível de detalhe Quando o usuário ativa visão olho-de-peixe, os vértices exiidos na visão estrutural são autoaticaente apresentados na visão declarativa (na parte direita do editor) co taanhos variados de texto, diferenciando-os de acordo co a respectiva distância ao foco. Já a parte esquerda do editor declarativo apresenta apenas os vértices exiidos na visão estrutural. A Figura 4-8 ostra a visão declarativa sincronizada co a visão estrutural.

9 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 66 Figura 4-8 Visão declarativa sincronizada co a visão estrutural (olho-de-peixe 25%) Confore o usuário navega no grafo ou altera os parâetros de configuração da visão olho-de-peixe na janela FishEye Configuration, as novas inforações exiidas na visão estrutural são refletidas na visão declarativa de fora sincronizada. A Figura 4-9 ilustra o grafo na visão estrutural co nível de detalhe no valor de 75% de visualização e a Figura 4-10 ostra a visão declarativa sincronizada co a visão estrutural da Figura 4-9. Oserve a diferença de taanho nas fontes de texto na parte direita do editor. Figura 4-9 Visão olho-de-peixe co 75% de Nível de detalhe

10 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 67 Figura 4-10 Visão declarativa sincronizada co visão estrutural (olho-de-peixe 75%) Visão olho-de-peixe na Visão Espacial e Textual Confore já apresentado na Seção 3.4, durante a edição espacial, o usuário pode especificar o leiaute da apresentação espacial de ua deterinada arquitetura de acordo co os recursos disponíveis. A Figura 4-11 ilustra o editor espacial na especificação de u leiaute para apresentação de docuentos hiperídia aseado na linguage NCL. Nessa figura, o autor definiu três eleentos toplayout ( w1, w2 e w3 ) co vários filhos internos a eles (regions). Alé disso, escolheu coo foco o eleento region r8. A esa inforação apresentada na visão espacial da Figura 4-11 pode ser visualizada na visão textual confore a Figura 4-12.

11 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 68 Figura 4-11 Visão Espacial da especificação do eleento layout na linguage NCL

12 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 69 Figura 4-12 Visão Textual da especificação do eleento layout refletida da Figura 4-11 Para aplicar a técnica olho-de-peixe na edição do leiaute na visão espacial, o usuário inicialente seleciona u vértice coo foco e, e seguida, ajusta o parâetro nível de detalhe (parâetro k ) na janela FishEye Configuration. O filtro aplicado na visão espacial é refletido na visão textual. A Figura 4-13 ilustra a visão espacial co a filtrage olho-de-peixe antendo a região r8 coo foco e usando u nível de detalhe e aproxiadaente 50%. Confore o usuário altera o nível de detalhe (parâetro k ) ou seleciona u novo vértice coo foco, a filtrage é autoaticaente reavaliada e a visão atualizada.

13 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 70 Figura 4-13 Visão olho-de-peixe aplicada na visão espacial A Figura 4-14 ilustra a visão textual sincronizada co a visão olho-de-peixe aplicada sore o editor espacial da Figura Oserve que, na visão textual, os vértices não ilustrados no editor espacial da Figura 4-13 são excluídos da parte esquerda do editor (visão e árvore), enquanto que, na área direita (texto), os eleentos são ostrados co taanhos variados de texto, diferenciando-os de acordo co a respectiva distância ao foco. Quanto ais próxio do foco o vértice estiver, aior será o taanho do texto exiido no editor.

14 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 71 Figura 4-14 Visão olho-de-peixe aplicada na visão textual 4.3. Cálculos Realizados na Filtrage Olho-de-Peixe sore a Visão Espacial Confore encionado na Seção 4.1, a técnica olho-de-peixe pode ser aplicada na fora original proposta por Furnas (Furnas, 1986) para estruturas siples coo árvores e listas. Os relacionaentos de inclusão entre os eleentos presentes na linguage NCL (layout, toplayout e region) visualizados na Figura 4-12 pode ser tratados coo ua árvore, onde a raiz da árvore (vértice coposto) é o eleento layout da linguage NCL. É iportante destacar que o algorito olho-de-peixe aplicado sore a especificação de u leiaute na visão espacial foi aplicado na fora original proposta por Furnas, diferente da visão estrutural, e que o algorito foi adaptado para grafos copostos confore discutido na Seção 4.1. O cálculo realizado na especificação do leiaute da visão espacial da Figura 4-12 (foco sore o vértice r8 ) procedeu nas seguintes etapas: 1. calcular os valores da função API(x) - no caso da estrutura e árvore, cada eleento pertencente à árvore recee u valor negativo referente a seu nível de profundidade (API(x) = - i). A Figura 4-15 ilustra os eleentos da visão espacial co seus respectivos valores calculados;

15 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 72 layout 0 API(x,y) = -d(x,raiz) -1 w1 w2-1 w3-1 r1-2 r2-2 r3-2 r9-2 r10-2 r11-2 r18-2 r19-2 r20-2 r4 r5 r6 r7 r8 r12 r13 r14 r15 r16 r17 r21 r22 r23 r24 r25 r26 Figura 4-15 Cálculo da função API(x,y) 2. calcular os valores da função D(x,y) - no caso da distância do vértice x e relação ao vértice y (foco), soa-se ua unidade para cada aresta entre o vértice e foco ( r8 ) e o vértice de destino. A Figura 4-16 ilustra os eleentos co seus respectivos valores calculados; layout 3 D(x,y) 2 w1 w2 4 w3 4 r1 3 r2 3 r3 1 r9 5 r10 5 r11 5 r18 5 r19 5 r r4 r5 r6 r7 r8 r12 r13 r14 r15 r16 r17 r21 r22 r23 r24 r25 r26 Figura 4-16 Cálculo da função D(x,y) 3. calcular os valores da função DOI(x,y). Para estruturas e árvores foi utilizado DOI(x,y) = API(x) D(x,y). A Figura 4-17 ilustra os eleentos co seus respectivos valores calculados;

16 Técnicas de Filtragens Aplicadas às Visões do Aiente de Autoria do Sistea HyperProp 73 layout DOI(x,y) = API(x) D(x,y) w1 w2-5 w3-5 r1-5 r2-5 r3 r9-7 r10-7 r11-7 r18-7 r19-7 r r4 r5 r6 r7 r8 r12 r13 r14 r15 r16 r17 r21 r22 r23 r24 r25 r26 Figura 4-17 Cálculo da função DOI(x,y) 4. selecionar quais eleentos deve ser exiidos: confore o usuário altera o nível de detalhe u novo parâetro k é definido coo corte. Para k igual -5, soente os eleentos co valores DOI (x,y) aiores ou iguais a -5 tornara-se visíveis. A Figura 4-18 ilustra a árvore filtrada. DOI(x,y) >= -5 layout w1 w2-5 w3-5 r1-5 r2-5 r3 r8 Figura 4-18 Eleentos visualizados co k -5