怎么在markdown里面渲染echart

[654572799]

大佬 ,帮帮我,我现在有一段markdown的
```echarts
{
"title": {
"text": "第一个 ECharts 实例"
},
"tooltip": {},
"legend": {
"data":["小红", "小明", "小黑"]
},
"xAxis": {
"data": ["语文","数学","英语"]
},
"yAxis": {},
"series": [
{
"name": "小红",
"type": "bar",
"data": [45, 15, 32]
},
{
"name": "小明",
"type": "bar",
"data": [44, 14, 33]
},
{
"name": "小黑",
"type": "bar",
"data": [38, 10, 35]
}
]
}
```
现在不知道怎么在这个编辑器中渲染,我知道需要自定义扩展组件,但是不知道怎么写,文档中的参考点过去也没有代码,我想请教一下,详细步骤,拜托大佬了

[imzbf]

原理和mermaid差不多，echarts应该也不能直接渲染成html，只能先挂载配置，然后从页面上获取配置，替换相应的标签

mermaid扩展参考：https://github.com/imzbf/md-editor-v3/blob/develop/packages/MdEditor/layouts/Content/markdownIt/mermaid/index.ts

mermaid渲染到页面过程参考：https://github.com/imzbf/md-editor-v3/blob/develop/packages/MdEditor/layouts/Content/composition/useMermaid.ts

[zhouciming]

可以直接扩展MdPreview组件的渲染方式吗，比如自定义mermaid代码块的渲染，自行添加工具栏等，其他元素的渲染保持不变。