markdown操作
2022/5/11大约 5 分钟约 1358 字
PDF预览
代码块
:::: code-group
::: code-group-item yarn
yarn add -D theme:::
::: code-group-item npm:active
npm i -D theme:::
::::
脚注
脚注 1 链接[^first].
脚注 2 链接^second.
行内的脚注^[Text of inline footnote] 定义.
重复的页脚定义^second.
[^first]: 脚注 可以包含特殊标记
也可以由多个段落组成
任务列表
自定义对齐
脚标
- 19th
- H2O
标记
VUE 非常 强大!
计算
$$ \frac {\partial^r} {\partial \omega^r} \left(\frac {y^{\omega}} {\omega}\right) = \left(\frac {y^{\omega}} {\omega}\right) \left{(\log y)^r + \sum_{i=1}^r \frac {(-1)^i r \cdots (r-i+1) (\log y)^{r-i}} {\omega^i} \right} $$
图表
::: chart 一个块状图案例
{
"type": "bar",
"data": {
"labels": ["红色", "蓝色", "黄色", "绿色", "紫色", "橙色"],
"datasets": [
{
"label": "投票数",
"data": [12, 19, 3, 5, 2, 3],
"backgroundColor": [
"rgba(255, 99, 132, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 206, 86, 0.2)",
"rgba(75, 192, 192, 0.2)",
"rgba(153, 102, 255, 0.2)",
"rgba(255, 159, 64, 0.2)"
],
"borderColor": [
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 159, 64, 1)"
],
"borderWidth": 1
}
]
},
"options": {
"scales": {
"y": {
"beginAtZero": true
}
}
}
}:::
::: chart 一个气泡图案例
{
"type": "bubble",
"data": {
"datasets": [
{
"label": "第一个数据集",
"data": [
{ "x": 20, "y": 30, "r": 15 },
{ "x": 40, "y": 10, "r": 10 }
],
"backgroundColor": "rgb(255, 99, 132)"
}
]
}
}:::
::: chart 一个线状图案例
{
"type": "line",
"data": {
"labels": ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
"datasets": [
{
"label": "我的第一个数据集",
"data": [65, 59, 80, 81, 56, 55, 40],
"fill": false,
"borderColor": "rgb(75, 192, 192)",
"tension": 0.1
}
]
}
}:::
::: chart 一个玫瑰图案例
{
"type": "polarArea",
"data": {
"labels": ["红色", "绿色", "黄色", "灰色", "蓝色"],
"datasets": [
{
"label": "My First Dataset",
"data": [11, 16, 7, 3, 14],
"backgroundColor": [
"rgb(255, 99, 132)",
"rgb(75, 192, 192)",
"rgb(255, 205, 86)",
"rgb(201, 203, 207)",
"rgb(54, 162, 235)"
]
}
]
}
}:::
::: chart 一个雷达图案例
{
"type": "radar",
"data": {
"labels": ["吃饭", "喝水", "睡觉", "设计", "编程", "骑车", "跑步"],
"datasets": [
{
"label": "我的第一个数据集",
"data": [65, 59, 90, 81, 56, 55, 40],
"fill": true,
"backgroundColor": "rgba(255, 99, 132, 0.2)",
"borderColor": "rgb(255, 99, 132)",
"pointBackgroundColor": "rgb(255, 99, 132)",
"pointBorderColor": "#fff",
"pointHoverBackgroundColor": "#fff",
"pointHoverBorderColor": "rgb(255, 99, 132)"
},
{
"label": "我的第二个数据集",
"data": [28, 48, 40, 19, 96, 27, 100],
"fill": true,
"backgroundColor": "rgba(54, 162, 235, 0.2)",
"borderColor": "rgb(54, 162, 235)",
"pointBackgroundColor": "rgb(54, 162, 235)",
"pointBorderColor": "#fff",
"pointHoverBackgroundColor": "#fff",
"pointHoverBorderColor": "rgb(54, 162, 235)"
}
]
},
"options": {
"elements": {
"line": {
"borderWidth": 3
}
}
}
}:::
::: chart 一个散点图案例
{
"type": "scatter",
"data": {
"datasets": [
{
"label": "散点数据集",
"data": [
{ "x": -10, "y": 0 },
{ "x": 0, "y": 10 },
{ "x": 10, "y": 5 },
{ "x": 0.5, "y": 5.5 }
],
"backgroundColor": "rgb(255, 99, 132)"
}
]
},
"options": {
"scales": {
"x": {
"type": "linear",
"position": "bottom"
}
}
}
}:::
流程图
::: chart 一个散点图案例
{
"type": "scatter",
"data": {
"datasets": [
{
"label": "散点数据集",
"data": [
{ "x": -10, "y": 0 },
{ "x": 0, "y": 10 },
{ "x": 10, "y": 5 },
{ "x": 0.5, "y": 5.5 }
],
"backgroundColor": "rgb(255, 99, 132)"
}
]
},
"options": {
"scales": {
"x": {
"type": "linear",
"position": "bottom"
}
}
}
}:::
流程
代码演示
一个使用浏览器不支持解析语言 Demo
# 标题
十分强大const message: string = "VuePress Theme Hope";
document.querySelector("h1").innerHTML = message;h1 {
font-style: italic;
+ p {
color: red;
}
}幻灯片
@slidestart
幻灯片 1
一个有文字和 链接 的段落
幻灯片 2
- 项目 1
- 项目 2
幻灯片 3.1
const a = 1;--
幻灯片 3.2
$$ J(\theta_0,\theta_1) = \sum_{i=0} $$