Mudanças entre as edições de "Ajuda:Linha do tempo"

Edição atual tal como às 20h52min de 12 de agosto de 2022

Linha do tempo é um recurso gráfico que pode ser utilizado para apresentar eventos organizados por datas no espaço de tempo.

Para formar uma linha do tempo é necessário definir pelo menos uma data (ano-mês-dia) e um nome para o evento. Os dados para formar uma linha do tempo devem ser incluídos entre as marcações <itimeline> e </itimeline>

<itimeline>
1990-07-26|Chacina de Acari
1991-10-10|Chacina do Maracanã
1990-07-26|[[Chacina de Acari]]
1998-10-10|[[Chacina do Maracanã - 10 de outubro de 1998]]
</itimeline>

As linhas do tempo podem ser empregadas para listar eventos da mesma natureza que se repetem com o passar do tempo ou para listar eventos distintos e destacar sua posição no curso do tempo.

Chacinas[editar | editar código-fonte]

1990-07-26T00:00:00Z

Chacina de Acari

1991-10-10T00:00:00Z

Chacina do Maracanã

1990-07-26T00:00:00Z

Chacina de Acari

1998-10-10T00:00:00Z

Chacina do Maracanã - 10 de outubro de 1998

1998-10-10T00:00:00Z

Chacina do Maracanã

2003-04-16T00:00:00Z

Chacina do Borel

1993-07-23T00:00:00Z

Chacina da Candelária

2021-06-06T13:00:00Z

Chacina do Jacarezinho

{"selectable":false}

Veja como é escrito o código desse exemplo:

<itimeline>
1990-07-26|Chacina de Acari
1991-10-10|Chacina do Maracanã
1990-07-26|[[Chacina de Acari]]
1998-10-10|[[Chacina do Maracanã - 10 de outubro de 1998]]
1998-10-10|[[Chacina do Maracanã - 10 de outubro de 1998|Chacina do Maracanã]]
2003-04-16|[[Chacina do Borel|Chacina do Borel]]
1993-07-23T00:00:00Z|[[Chacina da Candelária|Chacina da Candelária]]
2021-06-06T13:00:00Z|[[Arquivo:Imagem da Vila Operária.jpg|64px|link=Chacina do Jacarezinho]] [[Chacina do Jacarezinho|Chacina do Jacarezinho]]
</itimeline>

Sintaxe dos eventos na linha do tempo[editar | editar código-fonte]

Dentro da tag <itimeline> você define a lista de eventos a serem exibidos na linha do tempo. Você deve incluir um evento por linha e os eventos não podem abranger várias linhas. Os eventos são definidos usando:

Evento sem hora definida e sem link:

1990-07-26|Chacina de Acari

Evento sem hora definida e com link para o verbete:

1993-07-23|[[Chacina de Acari]]

Evento sem hora definida e com link para o verbete:

1993-07-23|[[Chacina de Acari|Chacina de Acari]]

Evento sem hora definida, com link para o verbete e nome diferente de exibição:

1990-07-26|[[Chacina de Acari|Acari]]

Evento com data e hora definida e com link para o verbete:

1993-07-23T13:50:10Z|[[Chacina de Acari|Chacina de Acari]]

Evento com imagem

2021-06-06|[[Arquivo:Imagem da Vila Operária.jpg|64px|link=Chacina do Jacarezinho]] [[Chacina do Jacarezinho|Chacina do Jacarezinho]]

Linhas do tempo agrupadas[editar | editar código-fonte]

Podemos criar linhas do tempo de temáticas diferentes e agrupá-las em uma única linha do tempo, funcionando como um recurso de comparação visual.

Grupos[editar | editar código-fonte]

A linha do tempo pode ser apresentada por grupos de eventos. Neste exemplo temos os eventos apresentados nos seguintes grupos: Governo, Prefeitura, Políticas Públicas e Chacinas.

Atenção! Ao criar uma linha do tempo por grupos, todos os registro deverão ter o grupo indicado, caso contrário, os registros sem grupos serão ignorados.

1999-01-01T00:00:00Z

2002-04-06T00:00:00Z

Governo

Anthony Garotinho

2003-01-01T00:00:00Z

2006-04-06T00:00:00Z

Governo

Rosinha Garotinho

2021-01-01T00:00:00Z

2024-12-31T00:00:00Z

Prefeitura

Eduardo Paes (DEM/PSD)

2017-01-01T00:00:00Z

2021-01-01T00:00:00Z

Prefeitura

Marcelo Crivella

2009-01-01T00:00:00Z

2016-12-31T00:00:00Z

Prefeitura

Eduardo Paes (PMDB)

1989-01-01T00:00:00Z

1992-12-31T00:00:00Z

Prefeitura

Marcello Alencar (PDT)

2006-01-01T00:00:00Z

2022-03-31T00:00:00Z

Políticas públicas

Bolsa família

2022-04-01T00:00:00Z

2022-12-31T00:00:00Z

Políticas públicas

Auxílio Brasil

1993-07-23T00:00:00Z

Chacinas

Chacina da Candelária

2003-04-16T00:00:00Z

Chacinas

Chacina do Borel

1998-10-10T00:00:00Z

Chacinas

Chacina do Maracanã

2019-02-08T00:00:00Z

Chacinas

Chacina do Fallet-Fogueteiro

{"selectable":false}

Veja como é escrito o código desse exemplo:

<itimeline>
<!-- Essas linhas definem eventos que acontecem em um intervalo de tempo -->
<!-- Governo -->
1999-01-01/2002-04-06|Governo|Anthony Garotinho
2003-01-01/2006-04-06|Governo|Rosinha Garotinho
<!-- Prefeitura -->
2021-01-01/2024-12-31|Prefeitura|Eduardo Paes (DEM/PSD)
2017-01-01/2021-01-01|Prefeitura|Marcelo Crivella
2009-01-01/2016-12-31|Prefeitura|Eduardo Paes (PMDB)
1989-01-01/1992-12-31|Prefeitura|Marcello Alencar (PDT)
<!-- Políticas públicas -->
2006-01-01/2022-03-31|Políticas públicas|Bolsa família
2022-04-01/2022-12-31|Políticas públicas|Auxílio Brasil

<!-- Essas linhas definem eventos que acontecem em uma data específica -->
<!-- Chacinas -->
1990-07-26|Chacinas|[[Chacina de Acari|Chacina de Acari]
1993-07-23|Chacinas|[[Chacina da Candelária|Chacina da Candelária]]
2003-04-16|Chacinas|[[Chacina do Borel|Chacina do Borel]]
1998-10-10|Chacinas|[[Chacina do Maracanã - 10 de outubro de 1998|Chacina do Maracanã]]
2019-02-08|Chacinas|[[Chacina do Fallet-Fogueteiro - 08 de fevereiro de 2019|Chacina do Fallet-Fogueteiro]]

</itimeline>

OBS.: Os textos entre as marcações  funcionam apenas como comentários, não precisam ser incluídos na timeline.

Uso[editar | editar código-fonte]

Uma vez instalado, você pode colocar tags <itimeline>...</itimeline> nas páginas onde você deseja mostrar uma linha do tempo. Um grande número de parâmetros pode ser definido na tag <itimeline>, mas todos eles são opcionais. O conteúdo da tag deve ser uma série de eventos, com um evento definido por linha^[1]. Por exemplo:

<itimeline height="512px" min="2014-06-01" max="2014-08-30">
<!-- Estas duas linhas definem eventos que acontecem em um tempo específico -->
2014-07-25T13:00:00Z|Design|[[Página 1|Página 1]]
2014-07-26T10:00:00Z|Design|[[Página 2|Página 2]]
<!-- Esses três períodos foram definidos usando intervalos IS8601 com datas e horas de início e fim. -->
2014-07-25T08:00:00Z/2014-07-26T15:00:00Z|Implemento|[[Fase 1]]
2014-07-26T12:00:00Z/2014-07-27T15:00:00Z|Implemento|[[Fase 2]]
2014-07-25T08:00:00Z/2014-08-00:00:00+02:00|Implemento|Projeto 1
<!-- Disponível na v1.3: Suporte para agrupamentos. Estas três linhas definem grupos de eventos em um grupo de fase final. -->
2014-07-25T13:00:00Z|[[File:Nuvola apps important.svg|16px]] Coalface|[[Target 1/Deploy]]
2014-07-25T13:10:00Z|[[File:Nuvola apps important.svg|16px]] Coalface|[[Target 1/Panic]]
2014-07-25T13:15:00Z|[[File:Nuvola apps important.svg|16px]] Coalface|[[Target 1/Rollback]]
</itimeline>

Datas e horários[editar | editar código-fonte]

Todas as datas e horas especificadas em uma tag <itimeline>, seja como valor fornecido para um parâmetro ou como parte de uma definição de evento, devem ser formatadas usando um perfil de ISO 8601 . As datas e horários aceitos pela InteractiveTimeline devem assumir a forma de uma data de calendário, opcionalmente seguida de uma hora:

As datas devem ser especificadas como um ano de quatro dígitos (o ano incluindo o século), seguido por um mês de dois dígitos (01 a 12), seguido por um dia de dois dígitos (01 a 31), com as seções opcionalmente separadas por hífens. A forma da data deve ser YYYY-MM-DDou YYYYMMDD, por exemplo: 2014-07-12ou 20140712.

Datas anteriores a 0000-01-01 não são suportadas no momento - estou trabalhando em um suporte confiável para elas.

Se uma hora não for especificada, o padrão de "00:00:00Z" (meia-noite UTC) será usado para a hora.

Se uma hora for especificada, ela deve ser separada da data por exatamente um espaço ' ' ou pelo caractere 'T'. Quando fornecido, os horários devem ser especificados como uma hora de dois dígitos (00 a 23 ^{[Notas 1]}), seguido por um minuto de dois dígitos (00 a 59), seguido por um segundo de dois dígitos (00 a 59), com os campos separados opcionalmente por dois pontos. O tempo deve ser da forma HH:MM:SSou HHMMSS. Os minutos e segundos são opcionais e, se não especificados, o padrão é "00". Frações decimais não são suportadas para os campos de hora. Os horários devem ser seguidos por um designador de fuso horário.

O designador de fuso horário deve ser "Z" para indicar que a hora está em UTC ou pode ser um deslocamento do UTC especificado como horas positivas ou negativas (e opcionalmente minutos) no formato ±[HH]:[MM] , ±[HH][MM], ou ±[HH].

Por exemplo, as seguintes datas e horas são válidas:

2014-07-12 17:10Z(17:10 UTC de 12 de julho de 2014)
2014-08-14(00:00 UTC de 14 de agosto de 2014)
2014-07-12T13:12:10-05:00(13:12:10 no horário de verão central em 12 de julho de 2014)
2014-08-14 08:24+02(08:24 no horário de verão da Europa Central em 14 de agosto de 2014)

As seguintes partes da ISO 8601 não são suportadas pelo InteractiveTimeline:

Datas de 'precisão reduzida' (somente YYYY ano, ou YYYY-MM ano e mês); somente datas de calendário completas são suportadas.
Datas da semana
Datas ordinais
Frações decimais para horas, minutos ou segundos.
Designador de fuso horário opcional (o designador de fuso horário deve ser especificado se for fornecido um horário)
Durações
Os intervalos são suportados apenas parcialmente (consulte a sintaxe do evento <start>/<end> fornecida abaixo) - intervalos incluindo durações não são suportados.
Intervalos de repetição
Representações truncadas
Escalas de tempo para representar calendários não gregorianos

Parâmetros[editar | editar código-fonte]

Os seguintes parâmetros podem ser especificados na tag <itimeline>. Todos os parâmetros são opcionais e diferenciam maiúsculas de minúsculas e, se não especificados, o padrão é usado.

Parâmetro	Modelo	Predefinição	Descrição
end	datatime	none	A data no final da exibição da linha do tempo quando a linha do tempo é exibida inicialmente. Se não for definido, a data e a hora do último evento na linha do tempo serão usadas.
height	string	auto	A altura da linha do tempo. Isso pode ser uma altura em qualquer unidade de tamanho CSS válida (px, em, %, etc) ou 'auto' para indicar que a altura deve ser calculada automaticamente. Quando a altura é definida como "auto", uma altura mínima pode ser especificada com a opção minheight.
locale	string	pt	Selecione a localidade a ser usada dentro da biblioteca CHAP Timeline. As localidades suportadas são: ca: catalão (alias: ca_ES) pt: inglês (alias: en_US, en_UK) nl: holandês (alias: nl_NL, nl_BE) fi: finlandês (alias: fi_FI) fr: francês (alias: fr_FR, fr_BE, fr_CA) de: alemão (alias: de_DE, de_CH) da: dinamarquês (alias: da_DK) ru: russo (alias: ru_RU) es: espanhol (alias: es_ES) tr: turco (alias: tr_TR)
max	datatime	none	A data máxima que pode ser mostrada na linha do tempo. Se definido, não é possível mover a linha do tempo além deste ponto (não confundir com o parâmetro 'end' que controla a data de término da visualização inicial). O máximo em si é excluído. Se não for definido, nenhum máximo será aplicado.
min	datatime	none	A data mínima que pode ser mostrada na linha do tempo. Se definido, não é possível mover a linha do tempo antes deste ponto (não confunda com o 'início', que controla a data de início da visualização inicial). O mínimo está incluído. Se não for definido, nenhum mínimo será aplicado.
minheight	int	0	A altura mínima da linha do tempo em pixels quando 'altura' foi definida como "auto".
moveable	boolean	true	Se for verdade, a linha do tempo é móvel.
stack	boolean	true	Se true, os eventos são empilhados uns sobre os outros para evitar eventos sobrepostos.
start	datatime	none	A data no início da visualização da linha do tempo quando a linha do tempo é exibida inicialmente. Se não for definido, a data e a hora do primeiro evento na linha do tempo serão usadas.
showcurrenttime	boolean	true	Se true, a linha do tempo mostra uma linha vertical vermelha exibindo a hora atual.
showmajorlabels	boolean	true	Por padrão, a linha do tempo mostra os rótulos de data principais e secundários no eixo horizontal. Por exemplo, os rótulos menores mostram minutos e os rótulos principais mostram horas. Quando showmajorlabels for false, nenhum rótulo principal será exibido.
showminorlabels	boolean	true	Por padrão, a linha do tempo mostra os rótulos de data principais e secundários no eixo horizontal. Por exemplo, os rótulos menores mostram minutos e os rótulos principais mostram horas. Quando showminorlabels é falso, nenhum rótulo secundário é mostrado. Quando showmajorlabels e showminorlabels forem falsos, nenhum eixo horizontal será visível.
width	string	100%	A largura da linha do tempo. Isso pode ser qualquer unidade de tamanho CSS válida (px, em, %, etc).
zoomable	boolean	true	Se true, a linha do tempo pode ser ampliada.
zoommax	int	315360000000000	Defina um intervalo máximo de zoom para o intervalo visível em milissegundos. Não será possível diminuir o zoom além desse máximo. O valor padrão é igual a cerca de 10.000 anos.
zooming	int	10	Defina um intervalo mínimo de zoom para o intervalo visível em milissegundos. Não será possível aumentar o zoom além desse mínimo.

A documentação adicional para as opções de configuração suportadas pode ser encontrada na documentação da linha de tempo do vis.js. Observe que algumas das opções de configuração listadas nessa página não são suportadas por esta extensão, seja porque não fazem sentido incluí-las, por segurança, ou simplesmente porque ainda não as adicionei.

Sintaxe do evento[editar | editar código-fonte]

Dentro da tag <itimeline> você define a lista de eventos a serem exibidos na linha do tempo. Você deve incluir um evento por linha e os eventos não podem abranger várias linhas. Os eventos são definidos usando:

<datahora>|<texto do evento>: Exemplo:2014-07-25T13:00:00Z|Phase 1; Este formato define um evento fornecendo a hora do evento e algum texto descrevendo o evento.

<datahora>/<datahora>|<texto do evento>: Exemplo:2014-07-25T08:00:00Z/2014-08-00:00:00+02:00|Project 1; Este formato define um intervalo usando um intervalo IS8601. O primeiro datetime é a data e hora em que o intervalo começa, o segundo é a data e hora de término (inclusive).

<datahora>|<nome do grupo>|<texto do evento>: Exemplo:2014-07-25T13:00:00Z|last phase|Deploy; Este formato define um evento em um grupo fornecendo a hora do evento, o nome do grupo no qual colocar o evento e algum texto descrevendo o evento.

<datahora>/<datahora>|<nome do grupo>|<texto do evento>: Exemplo:2014-07-25T08:00:00Z/2014-08-00:00:00+02:00|first phase|Be agile; Este formato define um intervalo de eventos em um grupo. O primeiro datetime é a data e hora em que o intervalo começa, o segundo é a data e hora de término (inclusive), o nome do grupo determina em qual grupo o intervalo deve estar e o texto descreve o evento.

Os valores de 'datetime' devem ser fornecidos no formato discutido acima na seção Datas e horas . O 'nome do grupo' e o 'texto do evento' podem conter texto wiki, então você pode incluir imagens, links ou outra formatação. Observe que o texto wiki complexo deve ser evitado, ou você provavelmente fará com que a exibição da linha do tempo fique instável: não espere listas, tabelas ou qualquer coisa complicada para funcionar como esperado.

Se você definir um grupo para qualquer um dos eventos definidos para uma determinada <itimeline>, você DEVE especificar grupos para todos os outros eventos nessa <itimeline> Se você não fizer isso, os eventos sem um grupo não serão exibidos!

A ordem em que os eventos são definidos não é importante, e se a extensão não puder validar a definição de um evento, ela será ignorada.

O corpo da tag <itimeline> suporta transclusão e expansão de template, então você pode definir uma lista de eventos em outro lugar e transcluí-los no corpo da tag <itimeline>.

Demonstração[editar | editar código-fonte]

Uma demonstração do MediaWiki acessível ao público desta extensão não está disponível no momento. A documentação da Timeline contém vários exemplos dos recursos da biblioteca Timeline.

Notas[editar | editar código-fonte]

↑ A especificação ISO 8601 afirma que a hora pode estar no intervalo de 00 a 24, onde 00 é meia-noite no início do dia e 24 é meia-noite no final. No entanto, as implementações JavaScript Date.parse() em todos os navegadores que testei falham ao analisar strings de data com as horas definidas como 24 (porque JavaScript) e, por segurança, essa extensão evita isso.

Referências[editar | editar código-fonte]

↑ Tradução livre de https://www.mediawiki.org/wiki/Extension:InteractiveTimeline

[2] A especificação ISO 8601 afirma que a hora pode estar no intervalo de 00 a 24, onde 00 é meia-noite no início do dia e 24 é meia-noite no final. No entanto, as implementações JavaScript Date.parse() em todos os navegadores que testei falham ao analisar strings de data com as horas definidas como 24 (porque JavaScript) e, por segurança, essa extensão evita isso.

[1] Tradução livre de https://www.mediawiki.org/wiki/Extension:InteractiveTimeline

[1]

[Notas 1]