富文本代码脑图 v1.0.1
去除调试日志
2024-08-10 更新日志
  • 优化:去除调试日志
富文本代码脑图

模块介绍

「富文本代码脑图」是一个自动识别页面的code为mind类型,并自动解析为脑图显示。

功能特性

  • 用文本缩进 / 代码结构直接生成思维导图,适合技术文档与知识整理
  • 支持在页面中渲染可交互的导图,节点可折叠
  • 本地渲染,不依赖外部服务
  • 兼容最新运行环境(Laravel 13 / PHP 8.5)
代码思维导图
    生成
        文本结构转导图
        代码层级识别
    展示
        节点折叠
        页面内渲染

使用原理

CodeMind 会自动识别页面上 <code> 标签,如果这两个标签包含了形如 class="language-mind" 的属性,那么 CodeMind 就会自动将这两个标签所包含的代码转换为脑图显示。

脑图代码格式

<code class="language-mind">
脑图主题
    脑图一级标题
        脑图二级标题A
        脑图二级标题B
        脑图二级标题C
    脑图一级标题
        脑图二级标题A
        脑图二级标题B
        脑图二级标题C
</code>

目前 UEditorPlus 已支持 Mind 类型代码格式,可直接使用。

使用场景

  • 富文本中自动识别代码并生成脑图
  • 技术文章代码可视化
  • 代码逻辑关系图展示
QQ
微信
客服