Flowchart Plugin

Crie fluxogramas a partir de conteúdo textual do tópico.

This topic in English

Exemplo

Pare o mouse sobre cada item e veja a etiqueta com o nome em tamanho maior.
Cada item também é um link para o bloco de texto que o criou e onde podem existir mais detalhes sobre o passo.
The Based SVG

In the text to define the itens of the Flowchart you must to write by this way for each item:

---++ Item do Fluxograma
   * Id: nome_unico
   * Type: Question
   * Yes: item_A
   * No: item_B

Regras de Sintaxe

Para criar e apresentar o fluxograma adicione a variável %FLOWCHART% ou %FLOWCHART{Parâmetros}%.

O plugin coleta o conteúdo do texto e considera que cada título de segundo nível ---++ indica o início da definição de um novo item do fluxograma. Para especificar o item e a ação derivada espera-se uma lista do tipo * Atributo: Valor

Para controlar o início e fim de de títulos válidos para a construção do Fluxograma use %FLOWCHART_START% e %FLOWCHART_STOP%.

Se um nome for grande demais para o espaço do item a quebra de linha pode ser feita com %FLOWCHART_BR%, que não interfere no texto da página, apenas no fluxograma.

Para personalizar um fluxograma, basta adicionar parametros a variável: %FLOWCHART{Parametros}%
Os parametros válidos são:

Dicas

Os navegadores normalmente fazem cache da página web e dos elementos contidos nela (imagens, animações, sons...). É possível que após salvar a modificação na definição do fluxograma você não veja o efeito da modificação na imagem. Nesse caso clique "Atualizar" no seu navegador web.

Alguns fluxogramas podem se tornar demasiadamente complexos e será difícil acompanhar suas linhas. Nesse caso aumente a área dos itens, dando assim maior espaçamento entre eles. eg: %FLOWCHART{ area-w="220" area-h="100" }%

Construção do Fluxograma e funcionamento do plugin

1. Os blocos iniciados por título de segundo nível ---++ são lidos como definição de item do Fluxograma (como o plugin de slides).
2. Um SVG é criado com essa informação e anexado ao tópico. Esse arquivo SVG pode ser acessado por %ATTACHURL%/flowchart_%TOPIC%.svg.
3. Um PNG é gerado com o ImageMagick e reduzido, para que a imagem tenha uma boa suavização de serrilhado, que não se consegue na conversão direta. O PNG é anexado ao tópico e pode ser acessado por %ATTACHURL%/flowchart_%TOPIC%.png (aproveite isto para separar a imagem do fluxograma do tópico de definição quando for interessante).
4. É criado um mapa para a imagem lincando os itens do fluxograma a origem da sua informação onde podem existir mais dados para implementação. Um arquivo txt com o mapa é anexado ao tópico e pode ser acessado por %ATTACHURL%/flowchartMapImg_%TOPIC%.txt (use para mapear a imagem mesmo fora do tópico onde o fluxograma foi gerado).
   %INCLUDE{"%PUBURL%/Web/TopicoDoFluxograma/flowchartMapImg_TopicoDoFluxograma.txt"}%
<img src="%PUBURL%/Web/TopicoDoFluxograma/flowchart_TopicoDoFluxograma.png" usemap="flowchart_TopicoDoFluxograma" alt="Fuxograma" border="0" />
5. O conteúdo do arquivo de mapa e uma tag de imagem apresentando o PNG são colocados no lugar da variável %FLOWCHART%.

Os arquivos (SVG, PNG e Map) são gerados quando o tópico contendo %FLOWCHART% é salvo.

Configurações do Plugin

As configurações do plugin são armazenadas como variáveis de preferências. Para referenciar uma configuração de plugin escreva: %<plugin>_<configuração>%, e.g. %INTERWIKIPLUGIN_SHORTDESCRIPTION%

• Descrição em uma linha, é mostrada no tópico TextFormattingRules:
  • Set SHORTDESCRIPTION = Monta fluxograma a partir de informação do tópico

• Largura padrão do item do fluxograma
  • Set ITEM_WIDTH = 140
• Altura padrão do item do fluxograma
  • Set ITEM_HEIGHT = 40
• Largura padrão da área do item do fluxograma
  • Set ITEM_AREA_W = 180
• Altura padrão da área do item do fluxograma
  • Set ITEM_AREA_H = 70
• Tamanho padrão em pixels do texto
  • Set TEXT_SIZE = 17
• Porcentagem padrão do tamanho PNG apresentado em relação ao padrão do SVG gerado
  • Set PERCENT_IMG = 70
• Estilo padrão para a tag img
  • Set TAG_STYLE = border:1px dotted #505050;

• Debug plugin: (See output in data/debug.txt)
  • Set DEBUG = 0

Instruções de Instalação do Plugin

Para istruções sobre instalação veja: TWiki:Plugins.FlowchartPlugin#InstallationInstructions

Informações do Plugin

-- AurelioAHeckert - 28 Jun 2005