添加对 ChartJS 双模式的支持

1. 增加了 ChartJS 图表官方语法;
2. 新增了 ChartJS 的双模式(浅色/深色模式)显示功能;
3. 扩展了 ChartJS 的 config 语法,支持双模式配置。
4. 修复了 ChartJS 在双模式下默认样式的问题,简化用户配置图表过程。
This commit is contained in:
SeaYJ
2024-10-03 23:41:47 +08:00
Unverified
parent 2ca779a6ad
commit 975134fb14
7 changed files with 167 additions and 1 deletions

39
scripts/tag/chartjs.js Normal file
View File

@@ -0,0 +1,39 @@
/**
* Butterfly
* chartjs
* https://www.chartjs.org/
* Author: SeaYJ
*/
'use strict'
const { escapeHTML } = require('hexo-util')
const chartjs = (args, content) => {
const chartBlock = /<!--\s*chart\s*-->\n([\w\W\s\S]*?)<!--\s*endchart\s*-->/g
const descBlock = /<!--\s*desc\s*-->\n([\w\W\s\S]*?)<!--\s*enddesc\s*-->/g
const id = args[0]
const descMatches = []
let chartConfig
let descDOM = ''
let match
!content && hexo.log.warn('chartjs has no content!')
if ((match = chartBlock.exec(content)) !== null) {
chartConfig = match[1]
}
while ((match = descBlock.exec(content)) !== null) {
descMatches.push(match[1])
}
for (let i = 0; i < descMatches.length; i++) {
let descContent = hexo.render.renderSync({ text: descMatches[i], engine: 'markdown' }).trim()
descDOM += (descContent ? `<div class="chatjs-desc-${i}">${descContent}</div>` : '')
}
return `<div class="chartjs-wrap" data-chartjs-id="${id}"><pre class="chartjs-src" hidden>${escapeHTML(chartConfig)}</pre>${descDOM}</div>`
}
hexo.extend.tag.register('chartjs', chartjs, { ends: true })