ไทม์ไลน์
แสดงภาพเหตุการณ์และเหตุการณ์สำคัญตามลำดับเวลา เหมาะสำหรับประวัติโครงการและแผนงาน
ไทม์ไลน์ คืออะไร?
ไดอะแกรมไทม์ไลน์นำเสนอเหตุการณ์ตามลำดับเวลาตามแกนเวลา ทำให้ง่ายต่อการเห็นลำดับและความสัมพันธ์ระหว่างเหตุการณ์ จำเป็นสำหรับการวางแผนโครงการ เอกสารประวัติศาสตร์ แผนงานผลิตภัณฑ์ และสถานการณ์ใด ๆ ที่การเข้าใจความสัมพันธ์ทางเวลามีความสำคัญ ไทม์ไลน์ให้เรื่องเล่าเชิงเส้นที่ชัดเจนของเหตุการณ์ตามเวลา
แก้ไขและดูตัวอย่าง
สร้าง ไทม์ไลน์ ด้วยไวยากรณ์ Mermaid และดูการเปลี่ยนแปลงทันที
Example
Timeline example
A Mermaid timeline showing when example code, PNG previews, and alt text are added.

Mermaid code
timeline
title Mermaid Editor Release Timeline
2026-05-01 : Add example code
: Render PNG preview
2026-05-03 : Add image alt text
: Improve SEO content
2026-05-05 : Publish pagesกรณีการใช้งานทั่วไป
แผนงานผลิตภัณฑ์
แสดงภาพฟีเจอร์ที่วางแผน การปล่อย และเหตุการณ์สำคัญตามไทม์ไลน์ สื่อสารลำดับความสำคัญในการพัฒนากับผู้มีส่วนได้ส่วนเสียและสมาชิกทีม
เหตุการณ์สำคัญของโครงการ
ติดตามเหตุการณ์ ผลงาน และกำหนดเส้นตายหลักของโครงการ ให้ภาพรวมที่ชัดเจนเกี่ยวกับความคืบหน้าของโครงการและเหตุการณ์สำคัญที่จะเกิดขึ้น
เอกสารประวัติศาสตร์
นำเสนอประวัติบริษัท วิวัฒนาการของเทคโนโลยี หรือเรื่องราวตามลำดับเวลาใด ๆ สร้างเรื่องเล่าภาพที่น่าสนใจของเหตุการณ์ตามเวลา
บันทึกการปล่อย
จัดทำเอกสารเวอร์ชันซอฟต์แวร์และฟีเจอร์หลักตามลำดับเวลา ช่วยให้ผู้ใช้เข้าใจวิวัฒนาการของผลิตภัณฑ์
ฟีเจอร์หลัก
ช่วงเวลา
กำหนดช่วงเวลาด้วยป้ายกำกับ เช่น วันที่ ไตรมาส หรือข้อความกำหนดเองเพื่อจัดระเบียบเหตุการณ์ตามลำดับเวลา
หลายเหตุการณ์ต่อช่วง
จัดกลุ่มหลายเหตุการณ์ภายใต้ช่วงเวลาเดียวกันเพื่อแสดงกิจกรรมพร้อมกันหรือรายการที่เกี่ยวข้อง
หัวเรื่องและส่วน
เพิ่มหัวเรื่องโดยรวมและหัวข้อส่วนเพื่อให้บริบทและจัดระเบียบไทม์ไลน์เป็นกลุ่มที่มีตรรกะ
เลย์เอาต์อัตโนมัติ
Mermaid จัดวางและจัดเรียงเหตุการณ์ตามไทม์ไลน์โดยอัตโนมัติเพื่อความสามารถในการอ่านที่เหมาะสม
แนวทางปฏิบัติที่ดี
ใช้สเกลเวลาที่สอดคล้อง
รักษาช่วงเวลาให้สอดคล้องตลอดไทม์ไลน์ อย่าผสมวันกับปีเว้นแต่จะระบุอย่างชัดเจน
เน้นเหตุการณ์สำคัญ
เน้นเหตุการณ์สำคัญที่สุด ไม่จำเป็นที่ทุกเหตุการณ์จะต้องมีน้ำหนักภาพเท่ากัน
รักษาป้ายกำกับให้กระชับ
ใช้ป้ายกำกับสั้น ๆ ที่อธิบายได้สำหรับเหตุการณ์ รายละเอียดสามารถให้ในเอกสารประกอบ
จัดกลุ่มเหตุการณ์ที่เกี่ยวข้อง
ใช้ส่วนเพื่อจัดกลุ่มเหตุการณ์ที่เกี่ยวข้องเข้าด้วยกัน ทำให้เข้าใจธีมและเฟสได้ง่ายขึ้น
สำรวจไดอะแกรมประเภทอื่น
Flowchart
แสดงภาพกระบวนการ เวิร์กโฟลว์ และอัลกอริทึมด้วยโหนดและลูกศรทิศทาง เหมาะสำหรับกระบวนการทางธุรกิจและแผนผังการตัดสินใจ
Sequence Diagram
บันทึกการโต้ตอบระหว่างผู้กระทำหรือระบบต่าง ๆ ตามลำดับเวลา เหมาะสำหรับเอกสาร API และการออกแบบระบบ
Class Diagram
สร้างแบบจำลองระบบเชิงวัตถุด้วยคลาส แอตทริบิวต์ และความสัมพันธ์ จำเป็นสำหรับการวางแผนสถาปัตยกรรมซอฟต์แวร์
State Diagram
แสดงการเปลี่ยนสถานะในระบบหรือแอปพลิเคชัน เหมาะสำหรับการสร้างแบบจำลองสถานะวงจรชีวิตและเวิร์กโฟลว์
Gantt Chart
วางแผนและติดตามไทม์ไลน์โครงการด้วยงานและการพึ่งพา เหมาะสำหรับการจัดการโครงการและการจัดตารางเวลา
ER Diagram
ออกแบบสคีมาฐานข้อมูลด้วยเอนทิตีและความสัมพันธ์ เหมาะสำหรับการสร้างแบบจำลองและเอกสารฐานข้อมูล
User Journey
จัดทำแผนที่ประสบการณ์ผู้ใช้และการโต้ตอบข้ามจุดสัมผัส เหมาะสำหรับการออกแบบ UX และการจัดทำแผนที่การเดินทางของลูกค้า
Git Graph
แสดงภาพกลยุทธ์การแตกสาขาของ Git และประวัติคอมมิต ช่วยอธิบายเวิร์กโฟลว์การควบคุมเวอร์ชัน
แผนที่ความคิด
จัดระเบียบไอเดีย ระดมความคิด และสร้างโครงสร้างภาพแบบลำดับชั้น เหมาะสำหรับการวางแผนและจัดทำแผนที่ความรู้
แผนภูมิวงกลม
แสดงการกระจายข้อมูลตามสัดส่วนด้วยแผนภูมิวงกลม เหมาะสำหรับแสดงเปอร์เซ็นต์และการวิเคราะห์ส่วนแบ่งตลาด
บอร์ด Kanban
จัดระเบียบงานเป็นคอลัมน์ที่แสดงขั้นตอนเวิร์กโฟลว์ เหมาะสำหรับการจัดการโครงการแบบ Agile และการติดตามงาน
แผนภูมิสี่ส่วน
วางรายการบนตารางสองแกนเพื่อเปรียบเทียบและจัดลำดับความสำคัญ เหมาะสำหรับการจัดลำดับความสำคัญฟีเจอร์และการวิเคราะห์เชิงกลยุทธ์
ไดอะแกรม Sankey
แสดงภาพปริมาณการไหลระหว่างโหนดด้วยลูกศรตามสัดส่วน เหมาะสำหรับการไหลของพลังงาน การจัดสรรงบประมาณ และช่องทางการแปลง
แผนภูมิ XY
สร้างแผนภูมิแท่งและแผนภูมิเส้นด้วยแกนที่กำหนดเอง เหมาะสำหรับการแสดงภาพข้อมูลและการวิเคราะห์แนวโน้ม
ไดอะแกรมบล็อก
สร้างเลย์เอาต์ที่มีโครงสร้างด้วยบล็อกจัดเรียงในคอลัมน์และแถว เหมาะสำหรับสถาปัตยกรรมระบบและภาพรวมส่วนประกอบ
ไดอะแกรมสถาปัตยกรรม
ออกแบบสถาปัตยกรรมคลาวด์และระบบด้วยไอคอนบริการและการเชื่อมต่อ เหมาะสำหรับเอกสารโครงสร้างพื้นฐาน
ไดอะแกรมแพ็กเก็ต
แสดงภาพโครงสร้างแพ็กเก็ตโปรโตคอลเครือข่ายด้วยเลย์เอาต์ฟิลด์ระดับบิต จำเป็นสำหรับเอกสารโปรโตคอลเครือข่าย