Explore Products

Best Sellers

New Releases

Books

Videos

Audiobooks

Free Learning

The Official Guide to Mermaid.js

You're reading from The Official Guide to Mermaid.js Create complex diagrams and beautiful flowcharts easily using text and code

Product type Paperback

Published in Sep 2021

Publisher Packt

ISBN-13 9781801078023

Length 492 pages

Edition 1st Edition

Languages

JavaScript

Tools

Documentum

Concepts

Front End Web Development

Authors (2):

Knut Sveidqvist

Ashish Jain

View More author details

Table of Contents (19) Chapters

Preface

1. Section 1: Getting Started with Mermaid

2. Chapter 1: The Art of Documentation with Mermaid FREE CHAPTER

3. Chapter 2: How to Use Mermaid

4. Chapter 3: Mermaid Versions and Using the Live Editor

5. Chapter 4: Modifying Configurations with or without Directives

6. Chapter 5: Changing Themes and Making Mermaid Look Good

7. Section 2: The Most Popular Diagrams

8. Chapter 6: Using Flowcharts

9. Chapter 7: Creating Sequence Diagrams

10. Chapter 8: Rendering Class Diagrams

11. Chapter 9: Illustrating Data with Pie Charts and Understanding Requirement Diagrams

12. Section 3: Powerful Diagrams for the Advanced User

13. Chapter 10: Demonstrating Connections Using Entity Relationship Diagrams

14. Chapter 11: Representing System Behavior with State Diagrams

15. Chapter 12: Visualizing Your Project Schedule with Gantt Chart

16. Chapter 13: Presenting User Behavior with User Journey Diagrams

17. Other Books You May Enjoy

Appendix :Configuration Options

Chapter 12: Visualizing Your Project Schedule with Gantt Chart

A Gantt chart is a graphical representation that is used to visualize and describe tasks (events or activities) over time. It is one of the most popular techniques used in project management for planning projects of various sizes. This simple chart helps you to visualize the start and end dates for a project, and what work is to be carried out for any given day in the schedule.

In this chapter, you will learn how you can use Mermaid to generate a Gantt chart. You will learn how to create sections and how to define their tasks and dates. You will also learn how to add interactivity to your Gantt charts, as well as how to customize your gantt chart using custom styles and overriding the theme variables.

This chapter will cover the following topics:

Creating a Gantt chart with Mermaid
Advanced configuration options and comments
Adding interactivity to a Gantt chart
Styling and theming

By the...

The rest of the chapter is locked

Register for a free Packt account to unlock a world of extra content!

A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.

Unlock this book and the full library FREE for 7 days

Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of

Start free trial

Renews at $19.99/month. Cancel anytime

Authors (2)

Knut Sveidqvist

Knut Sveidqvist

Knut Sveidqvist has been in the software industry for over 20 years in roles spanning all the way from architecture to development through product ownership and managing development teams. A common theme in all these roles is the need for good documentation. This inspired Knut to create Mermaid and start the Mermaid open source project. The main goal with the project was and still is to make it more fun and efficient to write technical documentation. Ever since Knut created Mermaid, he has continued to work with the project and has a wealth of knowledge about Mermaid that he now wants to share with the developer community.

See other products by Knut Sveidqvist

Jain

Jain

Ankit Jain holds a bachelor's degree in computer science and engineering. He has 6 years, experience in designing and architecting solutions for the big data domain and has been involved with several complex engagements. His technical strengths include Hadoop, Storm, S4, HBase, Hive, Sqoop, Flume, Elasticsearch, machine learning, Kafka, Spring, Java, and J2EE. He also shares his thoughts on his personal blog. You can follow him on Twitter at @mynameisanky. He spends most of his time reading books and playing with different technologies. When not at work, he spends time with his family and friends watching movies and playing games.

See other products by Jain

Personalised recommendations for you

Based on your interests and search pattern

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Modern Full-Stack React Projects

Modern Full-Stack React Projects

Full-Stack React Projects is a complete guide to learning full-stack web development, understanding the creation and integration of backend systems, and advancing your career as a frontend developer.

Jun 2024 16h 52m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m

Mastering Node.js Web Development

Mastering Node.js Web Development

Explore Node.js with practical examples that will teach you how to utilize open-source packages for real-world solutions. Gain the skills to develop and deploy server-side applications that enhance your client-side projects.

Jun 2024 25h 56m