Users are discussing scaling and display issues with Mermaid charts in Discourse, particularly regarding the small size of pie and Gantt charts, which limits their usefulness. Several users, including Tris20, gpetrov, and Ralf_Stockmann, have requested a fullscreen or zoomable view for diagrams, similar to the existing Markdown Table Fullscreen feature. sam acknowledged the need and confirmed it was assigned to the member experience team. A user, Ralf_Stockmann, shared a custom solution to zoom into SVGs via a popup. Later, sam announced that a fix was merged, enabling fullscreen viewing of diagrams with a 16:9 aspect ratio. david confirmed the implementation, and users like tvavrda and Tris20 expressed gratitude. Some minor issues remain, such as text fitting after browser zoom and theme switching, and Ralf_Stockmann still prefers a dedicated window for printing and exporting.
Thans for integrating this functionality, it has a lot of potential for visualising data!
Is there a way to set the radius (or size in general) of a pie chart?
The default one is unfortunately so small to be practically useless 
pie showData
title Key elements in Product X
"Calcium" : 42.96
"Potassium" : 50.05
"Magnesium" : 10.01
I’m also having some size/scaling issues. Gaant charts for example are essentially useless 
Is there anyway Discourse could provide the option to view mermaid diagrams in a fullscreen way, similar to the Markdown Table Fullscreen?
This is a fantastic idea, I would love to have it. We don’t have this work slotted at the moment.
Are we likely to see any movement on this? It just feels such a shame to have something so usefull sit so close to perfection.
We wanted to use a pie chart to show some of the distribution of languages in the company, but this is the real size in the end
is it possible to have some zoom possibilities to the mermaid display? Larger diagrams can become quate small now.
Maybe allow the mermaid diagrams to be opened in a popup lightbox and have pan and zoom like on https://mermaid.live/
This would be a great additional feature!
I would love this feature. It is assigned to the member experience team and will be prioritized by them.
Missing this is certainly heavily impacting how useful complex mermaid diagrams on the forums can be.
As to when? @lindsey will be prioritizing this.
If you need it in a hurry though probably best talk to Jamie
Thank you for looking at this again 
+1 for this much needed feature - any progress?
We also really need this feature at our company, scaling charts in height is limited and this make mermaid useless in discourse, need to have a way to render them externally or by showing them fullscreen.
I built something. I thought someone might want to give it a try before I release it.
The goal was to have a low-threshold and robust approach:
Update, @David is working on a fix here and it looks great, we just need to clean up some APIs and will post about it soon.
https://github.com/discourse/discourse-mermaid-theme-component/pull/47
This is now merged. Diagrams will always be rendered with a 16:9 aspect ratio, and there’s a button to pop them into a fullscreen view:
kanban
Todo
[Create Documentations]
docs[Create Blog about the new diagrams]
[In progress]
id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
id9[Ready for deploy]
id8[Design grammar]@{ assigned: 'knsv' }
id10[Ready for test]
id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
id11[Done]
id5[define getData]
id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
id12[Can't reproduce]
id3[Weird flickering in Firefox]
OMG. I am sorry, but the reaction is not enough. THANK YOU!!!
One small thing – if I zoom out a bit using the browser (Alt+ -) the texts do not fit. If I am at 100 %, it’s all perfect.
Also just noticed that Mermaid charts do not switch light/dark theme without refreshing the browser when using the new dark theme switcher setting.
Massive thank you from my side for putting through an update for this
Now we can use Gaant charts and Pie charts along with Discourse’s revision history 
Thank you, but I would prefer to open the chards in a new, dedicated window - so wie can Print, export to PDF etc.
See my approach:
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.
