mermaid图表支持html标签,javascript

这篇博客探讨了如何在 Markdown 中使用图形语法来创建流程图和图表,并展示了一个示例代码,该代码利用 marked.js 渲染包含 `graphTD` 的 Markdown 文档。通过自定义 renderer,实现了对特定代码块的识别和正确展示。
摘要由CSDN通过智能技术生成

从我的收集中,我应该能够在markdown中编写以下内容

```

graph TD;A-->B;A-->C;B-->D;C-->D;

```

并渲染

FLOWCHART / DIAGRAM IS DRAWN HERE

我想念什么?

Document

var renderer = new marked.Renderer();

renderer.code = function (code, language) {

if(code.match(/^sequenceDiagram/)||code.match(/^graph/)){

return '

'+code+'
';

}

};

$(document).ready(function(){

$.get( "test.md", function( data ) {

// console.log(data);

$('#content').html(marked(data));

});

});

console.log(marked('```graph TD;A-->B;A-->C;B-->D;C-->D;```', { renderer: renderer }));

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值