Pie chart : Title not visible if it is long - Githubissues

mermaid-js / mermaid

Generation of diagrams like flowcharts or sequence diagrams from text in a similar manner as markdown

https://mermaid.js.org

MIT License

68.63k stars 6.05k forks source link

Pie chart : Title not visible if it is long #5567

Open surya-srivastava opened 2 weeks ago

surya-srivastava commented 2 weeks ago

Description

If the title is long is pie chart then the title gets clipped off the front, making it unreadable

Steps to reproduce

Steps to repro:

go to mermaid.live

Enter this snippet

pie title Weekly Grocery Consumption for a Family of 4
"Vegetables" : 25
"Fruits" : 5
"Cheese" : 5
"Milk" : 15
"Eggs" : 15
"Meat" : 30
"Bread" : 5

3, observe the title

Screenshots

Code Sample

https://www.mermaidchart.com/app/projects/fdaea49f-837b-41a6-aff8-ba87b1e87726/diagrams/765877e3-2586-4c58-9489-2268543d2a9c/version/v0.1/edit

Setup

Mermaid version: on mermaid live editor
Browser and Version: [Chrome, Edge, Firefox] Chrome

Suggested Solutions

The size of svg is dependent on the pie chart, if we increase the size to adjust for the title as well then it would not clip off. If this is not possible then maybe we can display title in two lines

Additional Context

No response