Add ECharts feature ( #6385 ) (#6961)

This commit is contained in:
zhujinle 2024-08-13 17:35:12 +08:00 committed by GitHub
parent 9381c08c43
commit 4423710a13
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -1,4 +1,5 @@
import ReactMarkdown from 'react-markdown'
import ReactEcharts from 'echarts-for-react'
import 'katex/dist/katex.min.css'
import RemarkMath from 'remark-math'
import RemarkBreaks from 'remark-breaks'
@ -30,6 +31,7 @@ const capitalizationLanguageNameMap: Record<string, string> = {
mermaid: 'Mermaid',
markdown: 'MarkDown',
makefile: 'MakeFile',
echarts: 'ECharts',
}
const getCorrectCapitalizationLanguageName = (language: string) => {
if (!language)
@ -107,6 +109,14 @@ const CodeBlock: CodeComponent = memo(({ inline, className, children, ...props }
const match = /language-(\w+)/.exec(className || '')
const language = match?.[1]
const languageShowName = getCorrectCapitalizationLanguageName(language || '')
let chartData = JSON.parse(String('{"title":{"text":"Something went wrong."}}').replace(/\n$/, ''))
if (language === 'echarts') {
try {
chartData = JSON.parse(String(children).replace(/\n$/, ''))
}
catch (error) {
}
}
// Use `useMemo` to ensure that `SyntaxHighlighter` only re-renders when necessary
return useMemo(() => {
@ -136,19 +146,25 @@ const CodeBlock: CodeComponent = memo(({ inline, className, children, ...props }
</div>
{(language === 'mermaid' && isSVG)
? (<Flowchart PrimitiveCode={String(children).replace(/\n$/, '')} />)
: (<SyntaxHighlighter
{...props}
style={atelierHeathLight}
customStyle={{
paddingLeft: 12,
backgroundColor: '#fff',
}}
language={match[1]}
showLineNumbers
PreTag="div"
>
{String(children).replace(/\n$/, '')}
</SyntaxHighlighter>)}
: (
(language === 'echarts')
? (<div style={{ minHeight: '250px', minWidth: '250px' }}><ReactEcharts
option={chartData}
>
</ReactEcharts></div>)
: (<SyntaxHighlighter
{...props}
style={atelierHeathLight}
customStyle={{
paddingLeft: 12,
backgroundColor: '#fff',
}}
language={match[1]}
showLineNumbers
PreTag="div"
>
{String(children).replace(/\n$/, '')}
</SyntaxHighlighter>))}
</div>
)
: (