使用npm 插件[mmdc]将.mmd时序图转换为图片

使用npm 插件[mmdc]将.mmd时序图转换为图片

      • 1. 安装 `mmdc`
      • 2. 转换为图片

可以使用 mmdc (Mermaid CLI)这个工具来将 .mmd 时序图(Mermaid语法描述的时序图)转换为图片,以下是使用步骤:

1. 安装 mmdc

确保你已经安装了 npm,在命令行中运行以下命令安装 mmdc

npm install -g mmdc

-g 选项表示全局安装,这样你可以在任何项目目录下使用该命令。如果不想全局安装,也可以在项目内安装,之后通过 npx 来运行。

2. 转换为图片

安装完成后,通过以下命令进行转换:

  • 假如你的 .mmd 文件名为 example.mmd,想要生成一张 png 图片:
mmdc -i example.mmd -o example.png
  • 常用的输出格式除了 png,还支持 svg 等,例如转换为 svg 格式:
mmdc -i example.mmd -o example.svg

这里 -i 用于指定输入的 .mmd 文件路径,-o 用于指定输出的图片文件路径。通过上述操作,就能轻松将 .mmd 时序图转换为对应的图片。

mmdc 可以通过调整一些参数来提升输出图片的清晰度,关键参数是 --width--height,用于指定输出图片的尺寸,尺寸越大,图片往往越清晰,细节越丰富:

mmdc -i example.mmd -o example.png --width 1920 --height 1080

在上述命令中,--width 1920 将输出图片的宽度设为1920像素,--height 1080 将高度设为1080像素 。你可以根据实际需求进一步增大这两个数值,不过要注意,太大的尺寸会导致生成时间变长,而且生成的文件体积也会增大。

此外,--scale 参数也能起到一定作用,它用于设置渲染的缩放比例,默认值是 1,增大该值会让图形元素更大更清晰,示例如下:

mmdc -i example.mmd -o example.png --scale 2

上述命令将缩放比例设为2,使得输出图片中的内容加倍放大呈现,从而获得更清晰的视觉效果。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/947637.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Java高频面试之SE-08

hello啊,各位观众姥爷们!!!本牛马baby今天又来了!哈哈哈哈哈嗝🐶 成员变量和局部变量的区别有哪些? 在 Java 中,成员变量和局部变量是两种不同类型的变量,它们在作用域…

Linux(Centos 7.6)命令行快捷键

Linux(Centos 7.6)操作系统一般都是使用命令行进行管理,如何能高效的进行命令编辑与执行,需要我们记住一些常见的命令,也需要连接一些常见快捷键的使用,常见快捷键如下: 快捷键快捷键说明tab命令行补齐ctrlr快速查找之…

Geoserver修行记-后端调用WMS/WMTS服务无找不到图层Could not find layer

项目场景 调用geoserver地图服务WMS,找不到图层 我在进行地图服务调用的时候,总是提示我找不多图层 Could not find layer,重点是这个图层我明明是定义了,发布了,且还能够正常查看图层的wms的样式,但是在调用后端调用…

ip属地的信息准确吗?ip归属地不准确怎么办

在数字化时代,IP属地信息成为了我们日常生活中不可或缺的一部分。在各大社交媒体平台上,IP属地信息都扮演着重要的角色。然而,随着技术的不断进步和网络的复杂性增加,IP属地信息的准确性问题也日益凸显。那么,IP属地信…

nginx高可用集群搭建

本文介绍nginx高可用集群的搭建。利用keepalived实时检查nginx进程是否存活、keepalived的虚拟ip技术,达到故障转移的目的。终端用户通过访问虚拟ip,感知不到实际发生的故障。架构图如下: 0、环境 Ubuntu:22.04.2 ltsnginx: 1.…

UE5材质节点Distance

Distance可以计算两个物体间的距离,可以用来做过渡效果 当相机和物体距离3000的时候,就会渐渐从蓝过渡到红色,除以500是为了平滑过渡

CS·GO搬砖流程详细版

说简单点,就是Steam买了然后BUFF上卖,或许大家都知道这点,但就是一些操作和细节问题没那么明白。我相信,你看完这篇文章以后,至少会有新的认知。 好吧,废话少说,直接上实操! 首先准…

【Cocos TypeScript 零基础 3.1】

目录 场景跳转 场景跳转 把新建好的TS文件与场景绑定 选中 场景 或 camera 拖进右边的 属性检查器 双击T文件,进入编辑 至于用什么IDE看个位朋友高兴 我这里有 VScode ,先用这个,老师也没有推荐 (老师也用的是这个) VScode UI 也有中文包,请自行上网搜索 打开创建的TS文件后…

分析服务器 systemctl 启动gozero项目报错的解决方案

### 分析 systemctl start beisen.service 报错 在 Linux 系统中,systemctl 是管理系统和服务的主要工具。当我们尝试重启某个服务时,如果服务启动失败,systemctl 会输出错误信息,帮助我们诊断和解决问题。 本文将通过一个实际的…

pd虚拟机 Parallels Desktop 20 for Mac 安装教程【支持M芯片】

文章目录 效果图一、下载软件二、安装运行⚠️注意事项:1、前往 系统设置–> 隐私与安全性 –> 完整磁盘访问权限,中允许终端:2、安装运行【ParallelsDesktop-20.1.2-55742.dmg】,运行【安装.app】3、将【Patch】文件夹拖到…

回归预测 | MATLAB实现CNN-GRU卷积门控循环单元多输入单输出回归预测

回归预测 | MATLAB实现CNN-GRU卷积门控循环单元多输入单输出回归预测 目录 回归预测 | MATLAB实现CNN-GRU卷积门控循环单元多输入单输出回归预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 MATLAB实现CNN-GRU卷积门控循环单元多输入单输出回归预测 数据准备&#x…

JAVA创建绘图板JAVA构建主窗口鼠标拖动来绘制线条

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默, 忍不住分享一下给大家。点击跳转到网站 学习总结 1、掌握 JAVA入门到进阶知识(持续写作中……) 2、学会Oracle数据库入门到入土用法(创作中……) 3、手把…

CSS层叠样式表

目标 能够说出什么是CSS能够使用CSS基础选择器能够设置字体样式能够设置文本样式能够说出CSS的三种引入方式能够使用Chrome调试工具调试样式 目录 CSS简介CSS基础选择器CSS字体属性CSS文本属性CSS的引入方式综合案例Chrome调试工具 1.1 HTML的局限性 说起HTML,…

Win32汇编学习笔记03.RadAsm和补丁

Win32汇编学习笔记03.RadAsm和补丁-C/C基础-断点社区-专业的老牌游戏安全技术交流社区 - BpSend.net 扫雷游戏啊下补丁 在扫雷游戏中,点关闭弹出一个确认框,确认之后再关闭,取消就不关闭 首先第一步就是确认关闭按钮响应的位置,一般都是 WM_CLOSE 的消息 ,消息响应一般都在过…

深入Android架构(从线程到AIDL)_08 认识Android的主线程

目录 3、 认识Android的主线程(又称UI线程) 复习: 各进程(Process)里的主线程​编辑 UI线程的责任: 迅速处理UI事件 举例 3、 认识Android的主线程(又称UI线程) 复习: 各进程(Process)里的主线程 UI线程的责任: 迅速处理UI事…

4.CSS文本属性

4.1文本颜色 div { color:red; } 属性值预定义的颜色值red、green、blue、pink十六进制#FF0000,#FF6600,#29D794RGB代码rgb(255,0,0)或rgb(100%,0%,0%) 4.2对齐文本 text-align 属性用于设置元素内文本内容的水平对齐方式。 div{ text-align:center; } 属性值解释left左对齐ri…

数据挖掘——支持向量机分类器

数据挖掘——支持向量机分类器 支持向量机最小间隔面推导基于软间隔的C-SVM非线性SVM与核变换常用核函数 支持向量机 根据统计学习理论,学习机器的实际风险由经验风险值和置信范围值两部分组成。而基于经验风险最小化准则的学习方法只强调了训练样本的经验风险最小…

慧集通iPaaS集成平台低代码培训-基础篇

训练使用素材: 1.数据源: 单号业务日期工厂仓库物料单位数量批次0100012022-5-1210031001030001kg500202304150100012022-5-1210031001030001kg122202304150100012022-5-1210031001030001kg1250202304150100012022-5-1210031001030002kg130202304110100…

深入理解计算机系统—虚拟内存(一)

一个系统中的进程是与其他进程共享 CPU 和主存资源的。然而,共享主存会形成特殊的挑战。随着对 CPU 需求的增长,进程以某种合理的平滑方式慢了下来。但是如果太多的进程需要太多的内存,那么它们中的一些就根本无法运行。 为了更加有效地管理内…

Unresolved plugin: ‘org.apache.maven.plugins:maven-site-plugin:3.12.1‘

问题 使用idea 社区办加载项目提示下面问题: Unresolved plugin: org.apache.maven.plugins:maven-site-plugin:3.12.1 问题解决 maven插件地址: https://maven.apache.org/plugins/maven-dependency-plugin/plugins.html Maven 中央仓库地址&#…