作图笔记 - mermaid的字体大小设置

背景

使用mermaid画图的时候,需要调整字体的大小,来尽量使得图更精炼.

代码

<html>
	<body>
		<script src="./mermaid.min.js"></script>
		<script>
			mermaid.initialize({
				startOnLoad:true,
				sequence: {showSequenceNumbers: true}});
		</script>
		<div class="mermaid">
			%%{init:{'theme':'base', 'themeVariables':{'fontSize':'8px'}}}%%
		graph TB
			%%开始
			S([开始])
			...
		</div>
	</body>
</html>

关键点

'themeVariables':{'fontSize':'8px'}控制框内字体大小

另外

%%{init:{'theme':'base', 'themeVariables':{'fontSize':'8px'}}}%%
theme有以下选项:base,dark,forest,neutral,default

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐