Aikajana
Aikajana on kaavio, jota käytetään tapahtumien, päivämäärien tai ajanjaksojen havainnollistamiseen. Se renderöidään yleensä graafisesti ajan kulumisen näyttämiseksi, ja se järjestetään yleensä aikajärjestykseen. Perusaikajana luettelee tapahtumat aikajärjestyksessä, ja merkintänä käytetään yleensä päivämääriä. Aikajanaa voidaan käyttää myös tapahtumien välisten suhteiden, kuten henkilön elämäntapahtumien välisten suhteiden, näyttämiseen.
Kopioi
Upotus
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook
: Google
2005 : YouTube
2006 : Twitter
Syntaksi
Aikajanan luontisyntaksi on yksinkertainen. Sen on alettava timeline-syntaksilla, jotta mermaid tietää, että haluat luoda aikajanan.
Sen jälkeen aikajanalle voidaan lisätä otsikko. Tämä tehdään lisäämällä title-syntaksi ja sen perään otsikkoteksti.
Sen jälkeen lisätään aikajanan tiedot, jotka alkavat aina ajanjaksolla, jota seuraa kaksoispiste ja sitten tapahtuman teksti. Voit halutessasi lisätä vielä yhden kaksoispisteen ja sitten tapahtuman tekstin. Siksi jokaisella ajanjaksolla voi olla yksi tai useampi tapahtuma.
Kopioi
Upotus
{time period} : {event}
tai
Kopioi
Upotus
{time period} : {event} : {event}
tai
Kopioi
Upotus
{time period} : {event}
: {event}
: {event}
Huomautus: sekä ajanjaksot että tapahtumat ovat yksinkertaista tekstiä, eivät rajoitu numeroihin.
mermaid.grammar_timeline_note_see_up_exemport_s
Kopioi
Upotus
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
Näin voimme hyödyntää tekstijäsennystä aikajanan luomiseen. Ajanjaksojen ja tapahtumien järjestys on tärkeä, koska sitä käytetään aikajanan piirtämiseen. Ensimmäinen ajanjakso sijoitetaan aikajanan vasemmalle puolelle ja viimeinen ajanjakso aikajanan oikealle puolelle.
Kun samalla ajanjaksolla tapahtuu useita tapahtumia, ensimmäinen tapahtuma on kyseisen ajanjakson yläosassa ja viimeinen tapahtuma sijoitetaan kyseisen ajanjakson alaosaan.
Ryhmittele ajanjaksot
Voit ryhmitellä ajanjaksot eri osiin/aikakausiin. Tämä voidaan toteuttaa lisäämällä section-syntaksi ja sen perään osan nimi.
Kaikki seuraavat ajanjaksot sijoitetaan tähän osaan, kunnes uusi osa määritetään.
Jos mitään osaa ei ole määritetty, kaikki ajanjaksot sijoitetaan oletusosaan.
mermaid.grammar_timeline_default_see_one_some_part
Kopioi
Upotus
timeline
title Timeline of Industrial Revolution
section 17th-20th century
Industry 1.0 : Machinery, Water power, Steam <br>power
Industry 2.0 : Electricity, Internal combustion engine, Mass production
Industry 3.0 : Electronics, Computers, Automation
section 21st century
Industry 4.0 : Internet, Robotics, Internet of Things
Industry 5.0 : Artificial intelligence, Big data, 3D printing
Kuten näet, ajanjaksot sijoitetaan eri osiin ja osat järjestetään siinä järjestyksessä, jossa ne on määritetty.
Kaikki tietyn osan alla olevat ajanjaksot ja tapahtumat noudattavat samankaltaista värityssuunnitelmaa; näin tehdään, jotta ajanjaksojen ja tapahtumien välinen suhde on helpompi nähdä.
Pitkien ajanjaksojen tai pitkien tapahtumien rivinvaihto
Oletuksena jos ajanjaksojen ja tapahtumien teksti on liian pitkä, se rivittyy automaattisesti.
Voit myös käyttää pakotettua rivinvaihtoa.
mermaid.grammar_timeline_force_one_this_time_long
Kopioi
Upotus
timeline
title England's History Timeline
section Stone Age
7600 BC : Britain's oldest known house was built in Orkney, Scotland
6000 BC : Sea levels rise and Britain becomes an island.<br> The people who live here are hunter-gatherers.
section Bronze Age
2300 BC : People arrive from Europe and settle in Britain. <br>They bring farming and metalworking.
: New styles of pottery and ways of burying the dead appear.
2200 BC : The last major building works are completed at Stonehenge.<br> People now bury their dead in stone circles.
: The first metal objects are made in Britain.Some other nice things happen. it is a good time to be alive.
Kopioi
Upotus
timeline
title MermaidChart 2023 Timeline
section 2023 Q1 <br> Release Personal Tier
Bullet 1 : sub-point 1a : sub-point 1b
: sub-point 1c
Bullet 2 : sub-point 2a : sub-point 2b
section 2023 Q2 <br> Release XYZ Tier
Bullet 3 : sub-point <br> 3a : sub-point 3b
: sub-point 3c
Bullet 4 : sub-point 4a : sub-point 4b
Ajanjaksojen ja tapahtumien tyyli
Kuten aiemmin todettiin, jokaisella osalla on värityssuunnitelma, ja jokainen osan alla oleva ajanjakso ja tapahtuma noudattaa samaa värityssuunnitelmaa.
Aseta ajanjaksojen tyyli erikseen, eli jokaisella ajanjaksolla (ja sitä vastaavilla tapahtumilla) on oma värityssuunnitelma.
Kopioi
Upotus
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
Huomautus: mitään osaa ei ole määritetty, ja jokaisella ajanjaksolla ja sitä vastaavilla tapahtumilla on oma värityssuunnitelmansa.
Mukautettu värityssuunnitelma
Voit mukauttaa värityssuunnitelmaa teemamuuttujilla cScale0–cScale11, mikä muuttaa taustaväriä. Mermaid sallii enintään 12 osan ainutlaatuisen värin asettamisen, jossa cScale0-muuttuja määrittää ensimmäisen osan tai ajanjakson värin, cScale1-muuttuja toisen osan värin ja niin edelleen. Jos osia on yli 12, värityssuunnitelma alkaa kiertää.
Jos haluat myös muuttaa osan edustaväriä, voit toteuttaa sen teemamuuttujilla, jotka vastaavat muuttujia cScaleLabel0–cScaleLabel11.
Huomautus: näiden teemamuuttujien oletusarvot on otettu valitusta teemasta. Jos haluat ohittaa oletusarvot, voit lisätä mukautettuja teemamuuttujien arvoja initialize-syntaksilla.
Esimerkki:
Ohitetaan nyt muuttujien cScale0–cScale2 oletusarvot:
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
themeVariables:
cScale0: '#ff0000'
cScaleLabel0: '#ffffff'
cScale1: '#00ff00'
cScale2: '#0000ff'
cScaleLabel2: '#ffffff'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest
Teema
Mermaid tukee monia ennalta määritettyjä teemoja, joita voit käyttää itsellesi sopivan teeman valitsemiseen. Huomautus: voit itse asiassa ohittaa olemassa olevan teeman muuttujat luodaksesi oman mukautetun teemasi.
mermaid.grammar_timeline_theme_pre_no_same
- redux-color
- redux-dark-color
- redux
- redux-dark
- default
- neutral
- dark
- forest
- neo
- neo-dark
- base
Huomautus: teeman muuttamiseksi voit käyttää initialize-syntaksia.
Perusteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'base'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest
Metsäteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'forest'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest
Tumma teema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'dark'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest
Oletusteema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'default'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest
Neutraali teema
Kopioi
Upotus
---
config:
logLevel: 'debug'
theme: 'neutral'
---
timeline
title History of Social Media Platform
2002 : LinkedIn
2004 : Facebook : Google
2005 : YouTube
2006 : Twitter
2007 : Tumblr
2008 : Instagram
2010 : Pinterest