如何调整mermaid的graph图的大小(所见即所得模式下)


这个graph太大了,而且无法调整大小,也没有滚轮,导致一部分挡住了,应该怎么调整大小 :grimacing:

也在搜这个问题,不知道是否已得到解决……
英文论坛里有给出方案,亲测有效,进行一个搬(不妥删)
问就是以前用过,后来重开了个css就给忘了……

svg[id^="m"][width][height][viewBox] {
    width: 400px;
    height: auto;
}

↑保留比例将宽度定为400,比如要限制高度的话两个互换就行

一些变体:

svg[id^="m"][width][height][viewBox] {
    width: 80%;
    height: auto;
}

↑宽度为当前窗口宽度的80%

svg[id^="m"][width][height][viewBox] {
    min-width: 350px;
    max-width: 600px;
    width: 80%;
    height: auto;
}

↑宽度最小350px最大600px

另外布局也可以改:

div.mermaid {
    text-align: center;
}

center可以替换为left或right

1 个赞