星屿 Hexo https://blog.399521.xyz/ All rights reserved 2026, 星屿 收藏日常与闪闪发光的瞬间 星屿日记 2026-06-30T07:02:36.945Z 星屿 复习 MySQL 的时候，最容易烦的地方不是 SQL 有多难，而是很多概念长得太像了。

CHAR 和 VARCHAR 像一对双胞胎，WHERE 和 HAVING 总在相邻位置出现，DELETE 和 TRUNCATE 都像是在删数据，结果脾气完全不一样。

所以这篇就不把它写成硬邦邦的清单了。我们把 MySQL 当成一间小小的数据房间，一格一格看清楚：哪些东西负责存放，哪些东西负责约束，哪些东西负责查询，哪些东西负责在关键时刻兜底。

一、先从数据类型开始

数据库里的字段类型，其实就是在告诉 MySQL：这个格子里准备放什么东西。

CHAR 和 VARCHAR

CHAR(n) 是固定长度，像提前画好的格子。不管实际内容有多短，它都会按 n 个字符的位置来占空间，不够的地方用空格补上。

VARCHAR(n) 是可变长度，像会伸缩的小盒子。实际写了多少，它就尽量按多少来存，只是额外用一点空间记录长度。

类型长度更适合的场景
CHAR(n)固定长度编号、状态码这类长度稳定的数据
VARCHAR(n)可变长度姓名、标题、备注这类长度不固定的数据

可以简单记成：

1
CHAR 更固定，VARCHAR 更灵活。

AUTO_INCREMENT

AUTO_INCREMENT 是自增属性，常用在主键 id 上：

1
id INT PRIMARY KEY AUTO_INCREMENT

它只适合整型字段，比如 INT、BIGINT。VARCHAR、FLOAT 这类字段就不要交给它啦。

如果手动插入了一个更大的 id，后面的自增值通常会从已有最大值继续往后走。所以手动改自增列时要小心，不然很容易和后续数据撞车。

字符串类型

常见字符串类型有：

1
2
3
CHAR
VARCHAR
TEXT

NUMERIC 不是字符串，它是数值类型，和 DECIMAL 更接近，适合放精确数字。

二、主键和外键：表之间的小规矩

主键负责让一行数据有唯一身份。

1
PRIMARY KEY

它有两个特点：

  • 不能重复。
  • 不能是 NULL。

一张表只能有一个主键，但这个主键可以由多列一起组成，也就是复合主键。

外键负责维护表和表之间的关系：

1
FOREIGN KEY (dept_id) REFERENCES department(id)

它的意思是：当前表里的 dept_id，应该能在 department 表的 id 中找到对应记录。

外键这里有几个容易混的小点：

说法实际情况
一张表只能有一个外键不对，一张表可以有多个外键
外键值一定不能为 NULL不一定，除非字段本身设置了 NOT NULL
外键值不能重复不对，多个子表记录可以指向同一个父表记录
外键用来维护引用关系对，它主要保护关联数据的一致性

主键像身份证，外键像通讯录里的联系人编号。一个负责“我是谁”，一个负责“我和谁有关”。

三、查询语句：SQL 最常用的那条路

一条比较完整的查询通常长这样：

1
2
3
4
5
6
SELECT 列名, 聚合函数(列名) AS 别名
FROM 表名
WHERE 行级过滤条件
GROUP BY 分组列
HAVING 聚合结果过滤条件
ORDER BY 排序列 DESC;

别急着背，先看它的顺序感：

1
2
3
4
5
先从表里拿数据
再用 WHERE 筛掉不需要的行
然后 GROUP BY 分组
再用 HAVING 筛分组结果
最后 ORDER BY 排序

WHERE 和 HAVING

WHERE 是分组前过滤行，HAVING 是分组后过滤结果。

对比WHEREHAVING
过滤时机分组前分组后
能不能直接写聚合函数通常不能可以
常见搭配普通条件GROUP BY 后的统计条件

比如，想先筛出有效订单，再统计每个用户的订单数：

1
2
3
4
5
SELECT user_id, COUNT(*) AS order_count
FROM orders
WHERE status = 'paid'
GROUP BY user_id
HAVING COUNT(*) >= 3;

WHERE status = 'paid' 先筛订单，HAVING COUNT(*) >= 3 再筛统计后的用户。

ORDER BY

排序这里记住两个词：

1
2
ASC  升序，从小到大，默认可以省略
DESC 降序，从大到小

SELECT * 和 SELECT ALL

平时写：

1
SELECT * FROM table_name;

就已经表示查询所有列。

ALL 是 SELECT 的默认行为，表示保留重复行。完整写法可以是：

1
SELECT ALL * FROM table_name;

但实际写 SQL 时，直接用 SELECT * 就够了，清楚又省事。

JOIN 连接

连接查询就是把两张表按某个条件拼起来。

1
2
3
SELECT e.name, d.name AS dept_name
FROM employee e
INNER JOIN department d ON e.dept_id = d.id;

INNER JOIN 只保留两边都匹配上的记录。

LEFT JOIN 会保留左表全部记录，如果右表没有匹配，右表字段就显示为 NULL。

1
2
3
SELECT e.name, d.name AS dept_name
FROM employee e
LEFT JOIN department d ON e.dept_id = d.id;

小口诀：

1
INNER 看交集，LEFT 保左边。

子查询不只住在 WHERE 里

子查询可以出现在很多地方，比如：

  • SELECT 后面，作为查询列。
  • FROM 后面，作为临时表。
  • WHERE 后面，作为过滤条件。
  • HAVING 后面，作为分组后的条件。

例如：

1
2
3
4
5
SELECT user_id, total_amount
FROM orders
WHERE total_amount > (
  SELECT AVG(total_amount) FROM orders
);

这里的子查询就是先算平均值，再拿外层订单金额去比较。

LIKE 和索引

LIKE 做模糊匹配时，百分号的位置很重要：

1
LIKE 'abc%'

这种前缀匹配通常可以利用 B-Tree 索引。

1
LIKE '%abc'

这种一开头就是 % 的写法，MySQL 很难从索引开头定位，只能更辛苦地扫数据。

INSERT 可以省略字段名吗

可以，但不太推荐。

1
2
INSERT INTO employee
VALUES (1, 'NAME_PLACEHOLDER', 'DEPT_PLACEHOLDER', 8000, '2026-01-10');

只有当值的数量和顺序完全符合表结构时，它才不会出错。更稳的写法是把字段名写出来：

1
2
INSERT INTO employee (id, name, dept_name, salary, hire_date)
VALUES (1, 'NAME_PLACEHOLDER', 'DEPT_PLACEHOLDER', 8000, '2026-01-10');

多写一点点，少踩很多坑，划算。

四、事务：要么一起成功，要么一起撤回

事务适合处理那些必须一起完成的操作，比如转账、库存扣减、订单创建。

1
2
3
4
5
6
7
8
9
10
11
START TRANSACTION;

UPDATE account
SET balance = balance - 100
WHERE id = 1;

UPDATE account
SET balance = balance + 100
WHERE id = 2;

COMMIT;

如果中途出错，就用：

1
ROLLBACK;

事务最核心的感觉就是：别让数据停在半路。

ACID

特性英文意思
原子性Atomicity要么全部成功，要么全部回滚
一致性Consistency事务前后都要保持合法状态
隔离性Isolation并发事务之间尽量互不打扰
持久性Durability提交后的数据要可靠保存

可以把 COMMIT 理解成“盖章确认”，一旦提交成功，数据就正式生效了。

DELETE 和 TRUNCATE

它们都能清数据，但性格不一样：

对比DELETETRUNCATE
类型DMLDDL
删除方式可以带 WHERE，逐行删除直接清空整张表
事务里能否回滚可以MySQL 中通常会隐式提交，不能靠事务回滚
速度相对慢通常更快

如果只是删一部分数据，用 DELETE。

如果确定整张表都不要了，再考虑 TRUNCATE。这个操作要谨慎，别手滑。

五、视图：给复杂查询套一层温柔外壳

视图是虚拟表。

它本身不真正存一份完整数据，而是把一段查询保存起来。每次查视图时，MySQL 会根据底层表动态生成结果。

1
2
3
4
CREATE VIEW active_employee AS
SELECT id, name, dept_id
FROM employee
WHERE status = 'active';

之后就可以像查表一样查它：

1
SELECT * FROM active_employee;

视图的好处有两个：

  • 把复杂查询封装起来，使用时更轻松。
  • 隐藏不想暴露的字段，比如薪资、手机号等敏感字段。

不过也要注意：有些可更新视图被修改时，会影响到底层基础表。删除视图本身不会删除基础表数据，但通过可更新视图执行 UPDATE、DELETE 时，就不是“只改了一个影子”那么简单了。

常用语法：

1
2
3
4
5
6
7
CREATE VIEW view_name AS
SELECT column_name FROM table_name WHERE condition;

ALTER VIEW view_name AS
SELECT column_name FROM table_name WHERE new_condition;

DROP VIEW view_name;

带有复杂聚合、GROUP BY、DISTINCT 的视图，通常不能直接更新。它们更适合查询，不适合拿来改数据。

六、存储过程和存储函数

存储过程和存储函数都可以把一段 SQL 逻辑封装起来，但它们的使用方式不同。

对比存储过程 PROCEDURE存储函数 FUNCTION
返回值可以没有返回值，也可以用 OUT 参数传出必须声明返回类型，并且有 RETURN
调用方式用 CALL可以放在 SQL 表达式里
参数支持 IN、OUT、INOUT通常只用输入参数
事务控制可以包含事务控制语句不适合写 COMMIT、ROLLBACK

存储过程的常见结构：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
DELIMITER //

CREATE PROCEDURE proc_name(
  IN p_id INT,
  OUT p_result VARCHAR(50)
)
BEGIN
  DECLARE v_count INT DEFAULT 0;

  SELECT COUNT(*) INTO v_count
  FROM employee
  WHERE id = p_id;

  SET p_result = IF(v_count > 0, 'exists', 'missing');
END //

DELIMITER ;

调用它：

1
2
CALL proc_name(1, @result);
SELECT @result;

DELIMITER 是为了临时修改语句结束符。因为过程体里面有很多分号，如果不换结束符，MySQL 会提前以为定义结束了。

七、触发器：数据变化时自动响一下

触发器会在 INSERT、UPDATE、DELETE 发生时自动执行。

它不能用 CALL 手动调用，也不会因为普通 SELECT 被触发。

触发时机有两种：

1
2
BEFORE  操作之前
AFTER   操作之后

触发器里经常会看到 OLD 和 NEW：

关键字意思常用场景
OLD.column_name操作前的旧值DELETE、UPDATE
NEW.column_name操作后的新值INSERT、UPDATE

比如删除员工记录前，顺手删除关联考勤记录：

1
2
3
4
5
6
7
8
9
10
11
DELIMITER //

CREATE TRIGGER trg_delete_employee_attendance
  BEFORE DELETE ON employee
  FOR EACH ROW
BEGIN
  DELETE FROM attendance
  WHERE emp_id = OLD.id;
END //

DELIMITER ;

这里用的是 OLD.id，因为正在删除的那一行，删除后就不存在了，要在删除前拿到它的旧值。

触发器很好用，但不要滥用。逻辑藏得太深，以后排查问题会比较累。能用清楚的业务代码解决时，就别把所有东西都塞进触发器里。

八、大小写问题：跨系统时别太自信

MySQL 的库名、表名是否区分大小写，和操作系统以及配置有关。

在 Windows 上，默认通常不区分大小写；在 Linux 上，通常区分大小写。

最稳的习惯是：表名、字段名统一用小写和下划线。

1
2
3
user_order
order_item
created_at

别写一会儿 UserOrder，一会儿 userorder。自己看着累，数据库也可能看着迷糊。

九、容易记混的小卡片

小问题记法
CHAR(10) 和 VARCHAR(10) 一样占空间吗不一样，CHAR 固定，VARCHAR 按需
DELETE 和 TRUNCATE 都能回滚吗不一样，TRUNCATE 在 MySQL 中通常会隐式提交
一张表只能有一个外键吗不是，可以有多个
视图会独立存储完整数据吗不会，它是虚拟表
GROUP BY 必须配聚合函数吗不必须，单独用时有点像分组去重
FUNCTION 必须有返回值吗必须
PROCEDURE 必须有返回值吗不必须
LEFT JOIN 会保留哪边左表全部保留
LIKE '%abc' 容易用上普通 B-Tree 索引吗不容易，因为开头就是通配符
子查询只能写在 WHERE 里吗不是，很多位置都可以
DESC 是升序吗不是，DESC 是降序
AUTO_INCREMENT 能给字符串用吗不适合，它用于整型自增
触发器需要手动调用吗不需要，它会自动触发

十、写综合 SQL 时，可以按这个顺序走

如果要从零写一套比较完整的数据库逻辑，可以先按这个路线来：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
-- 1. 建库
CREATE DATABASE IF NOT EXISTS db_name
  CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

USE db_name;

-- 2. 建主表
CREATE TABLE table_a (
  id INT PRIMARY KEY AUTO_INCREMENT,
  name VARCHAR(50) NOT NULL
);

-- 3. 建关联表
CREATE TABLE table_b (
  id INT PRIMARY KEY AUTO_INCREMENT,
  a_id INT NOT NULL,
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (a_id) REFERENCES table_a(id)
);

-- 4. 插入数据
INSERT INTO table_a (name)
VALUES ('NAME_PLACEHOLDER');

-- 5. 多表查询
SELECT a.name, b.created_at
FROM table_a a
JOIN table_b b ON a.id = b.a_id;

-- 6. 分组统计
SELECT a_id, COUNT(*) AS total_count
FROM table_b
GROUP BY a_id
HAVING COUNT(*) >= 1;

存储过程和触发器可以等主表、关联表、查询逻辑都稳定后再加。先把普通 SQL 写清楚，再封装，思路会顺很多。

最后

MySQL 看起来零件很多，但其实它们各有各的位置。

字段类型负责“放什么”，主键外键负责“怎么关联”，查询语句负责“怎么拿出来”，事务负责“出事时怎么撤回”，视图、存储过程和触发器则负责把常用逻辑包装得更顺手。

不用一口气把所有概念背成一堵墙。先记住每个东西的性格，再慢慢把它们放回 SQL 里。

一步一步来，数据库这间小房间就会越来越亮啦。✨

]]> https://blog.399521.xyz/2026/06/30/mysql-gentle-notes/ 2026-06-30T07:02:00.000Z 复习 MySQL 的时候，最容易烦的地方不是 SQL 有多难，而是很多概念长得太像了。

CHAR 和 VARCHAR 像一对双胞胎，WHERE 和 HAVING

把 MySQL 的小机关慢慢理顺 2026-06-30T07:02:36.945Z 星屿 备考数据可视化的那段时间，不知道为什么总喜欢在很晚的时候看文档。

窗外安静，屏幕亮着，翻着翻着就忽然觉得——ECharts 这个东西，好像不太一样。

它不像平时写 Java 或者 Python，不是在命令计算机”先做这个，再做那个”。更像是在填一张小表格。你把标题放进 title，把坐标轴放进 xAxis，把数据放进 series，然后图就出来了。很乖，不问多余的问题。

后来想通了：ECharts 不需要死背。先把骨架记住，再根据图表类型换零件就好。外套不一样，人还是那个人。

一、通用骨架

大部分图表都长这样：

1
2
3
4
5
6
7
8
9
10
11
12
var option = {
    title: { text: '图表标题' },
    tooltip: {},
    legend: { data: ['系列名称'] },
    xAxis: { type: 'category', data: ['A', 'B', 'C'] },
    yAxis: { type: 'value' },
    series: [{
        name: '系列名称',
        type: 'bar',
        data: [10, 20, 30]
    }]
};

需要记住的字段只有六个：

1
2
3
4
5
6
title    // 标题
tooltip  // 悬停提示
legend   // 图例
xAxis    // x 轴
yAxis    // y 轴
series   // 图表主体

其中 series 是整张图的心脏。图是柱状图、折线图、饼图，还是散点图，就看 type 写什么。换一个词，图表就换了一副模样。

二、柱状图和折线图

这两个最省心，就像填空题。

1
2
3
4
5
6
7
8
9
10
11
xAxis: {
    type: 'category',
    data: ['一月', '二月', '三月']
},
yAxis: {
    type: 'value'
},
series: [{
    type: 'bar',
    data: [120, 200, 150]
}]

category 和 value 的区别，记这一句话就够：

1
2
category 是分类，自己写 data（月份、城市、科目这种）
value 是数值，ECharts 自己算刻度，不用写

如果想把柱状图和折线图叠在一起，在 series 里多放一个对象就行：

1
2
3
4
series: [
    { name: '销量', type: 'bar',  data: [120, 200, 150] },
    { name: '增长', type: 'line', data: [100, 160, 130] }
]

一个 {} 一组图，想叠几个放几个。

三、两个 Y 轴

有时候两组数据的单位不一样，放在同一把尺子上会很奇怪。这时候可以写两个 Y 轴：

1
2
3
4
5
6
7
8
9
10
11
12
13
yAxis: [
    { type: 'value', name: '销量' },
    { type: 'value', name: '增长率' }
],
series: [
    { name: '销量', type: 'bar', data: [120, 200, 150] },
    {
        name: '增长率',
        type: 'line',
        yAxisIndex: 1,
        data: [10, 20, 15]
    }
]

重点是 yAxisIndex: 1——数组从 0 开始，所以 1 指的是第二个 Y 轴。

单位一样的话就别写两个了。能简单就简单。

四、tooltip，那个小纸条

tooltip 是鼠标悬停时弹出来的提示框。不写它图也能跑，但写了读图会舒服很多。

最懒的写法：

1
tooltip: {}

有坐标轴的图（柱状图、折线图）常用 trigger: 'axis'，鼠标移到某个 x 轴位置，显示整列数据：

1
tooltip: { trigger: 'axis' }

没有坐标轴的图（饼图、漏斗图）用 trigger: 'item'，鼠标移到哪个块，显示哪个块：

1
2
3
4
tooltip: {
    trigger: 'item',
    formatter: '{b}: {c}%'
}

{b} 是名字，{c} 是数值。记住这两个字母就够了。

五、散点图

散点图有点特别——坐标不写在 xAxis 里，而是直接藏在每个数据点里：

1
2
3
4
5
data: [
    [10, 20],
    [15, 35],
    [8,  18]
]

每一个小数组是一个点：[x值, y值]。

完整写法：

1
2
3
4
5
6
7
8
9
10
var option = {
    title: { text: '散点图' },
    tooltip: {},
    xAxis: { type: 'value' },
    yAxis: { type: 'value' },
    series: [{
        type: 'scatter',
        data: [[10, 20], [15, 35], [8, 18]]
    }]
};

注意 xAxis 和 yAxis 的 type 都是 'value'，不需要 data。

六、雷达图

雷达图有自己的一套，不走 xAxis / yAxis，多了一个字段叫 radar：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var option = {
    title: { text: '雷达图' },
    tooltip: {},
    radar: {
        indicator: [
            { name: '学习', max: 100 },
            { name: '体育', max: 100 },
            { name: '社交', max: 100 },
            { name: '实践', max: 100 }
        ]
    },
    series: [{
        type: 'radar',
        data: [{
            name: '样本A',
            value: [80, 70, 90, 60]
        }]
    }]
};

indicator 定义有几根轴，value 填对应的数值，两边一一对应，数量要一样多。

1
2
radar.indicator 定义轴
series.data.value 填数值

七、漏斗图

漏斗图也不需要坐标轴，数据从大到小排列，形状自然就出来了：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var option = {
    title: { text: '漏斗图' },
    tooltip: { trigger: 'item', formatter: '{b}: {c}%' },
    series: [{
        type: 'funnel',
        data: [
            { value: 100, name: '访问' },
            { value: 80,  name: '浏览' },
            { value: 60,  name: '咨询' },
            { value: 40,  name: '下单' },
            { value: 20,  name: '支付' }
        ]
    }]
};

适合表示”从多到少”的过程。越到后面越窄，像一只很认真在过滤东西的小漏斗。

八、树图

树图的数据是嵌套结构：

1
2
3
4
5
6
7
{
    name: '根节点',
    children: [
        { name: '子节点1' },
        { name: '子节点2' }
    ]
}

有一个坑：如果数据放在 JSON 文件里，不能直接用 <script> 引入，因为 <script> 只认 JS 文件。要用 fetch：

1
2
3
4
5
6
7
8
9
10
11
12
13
fetch('data.json')
    .then(res => res.json())
    .then(data => {
        var option = {
            title: { text: '树图' },
            tooltip: { trigger: 'item' },
            series: [{
                type: 'tree',
                data: [data]   // 注意是 [data]，不是 data
            }]
        };
        myChart.setOption(option);
    });

data: [data] 这里要包一层数组——因为 series.data 要数组，但树图的根节点是对象，所以手动套一层中括号。

如果节点太多挤在一起，加这两个字段会舒展很多：

1
2
orient: 'LR',        // 从左到右展开
initialTreeDepth: 2  // 先展开两层

九、关系图

关系图看起来字段多，但核心只有两个：data 写节点，links 写连线。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
series: [{
    type: 'graph',
    layout: 'force',
    roam: true,
    label: { show: true },
    edgeLabel: { show: true, formatter: '{c}' },
    data: [
        { name: '节点A', symbolSize: 30 },
        { name: '节点B', symbolSize: 30 },
        { name: '节点C', symbolSize: 30 }
    ],
    links: [
        { source: '节点A', target: '节点B', value: '关系1' },
        { source: '节点A', target: '节点C', value: '关系2' },
        { source: '节点B', target: '节点C', value: '关系3' }
    ]
}]

source 是起点，target 是终点，value 是线上显示的文字。edgeLabel.formatter: '{c}' 里的 {c} 就是这个 value。

1
2
data 写点，links 连线
source 找 target，value 写关系

十、地图

地图这里要分清两件事：

第一件事，地图轮廓文件还是用 <script> 引入 JS 文件：

1
<script src="map/province/guangxi.js"></script>

这一步相当于先把”广西这张地图纸”拿出来。

第二件事，地图上要显示的数据，可以直接写数组，也可以用 fetch 读取 JSON 文件。

如果给的是普通数据数组，就这样放进 series.data：

1
2
3
4
5
6
7
series: [{
    type: 'map',
    map: '广西',
    roam: true,
    label: { show: true },
    data: data
}]

如果数据放在 guangxi_map.json 里，就用 fetch 读取：

1
2
3
4
5
6
7
8
9
10
11
12
13
fetch('guangxi_map.json')
    .then(res => res.json())
    .then(data => {
        var option = {
            series: [{
                type: 'map',
                map: '广西',
                data: data
            }]
        };

        myChart.setOption(option);
    });

如果要按数值深浅显示颜色，加 visualMap：

1
visualMap: { min: 100, max: 900 }

如果想在地图上叠加散点或航线，用 geo + coordinateSystem: 'geo'：

1
2
3
geo: { map: '广西', roam: true }
// series 里加上：
coordinateSystem: 'geo'

十一、toolbox：导出效果图的小按钮

提交时，除了提交代码，还要提交效果图。

效果图可以用 ECharts 自带的 toolbox 导出，所以提交代码时要保留 toolbox 配置，不要删掉它哦。

最常用的是这个：

1
2
3
4
5
6
toolbox: {
    show: true,
    feature: {
        saveAsImage: {}
    }
}

放进 option 里就是：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var option = {
    title: { text: '柱状图' },
    tooltip: {},
    toolbox: {
        show: true,
        feature: {
            saveAsImage: {}
        }
    },
    xAxis: {
        type: 'category',
        data: ['一月', '二月', '三月']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        type: 'bar',
        data: [120, 200, 150]
    }]
};

页面右上角会出现一个保存图片的小按钮，点一下就能导出效果图。

简易记忆版：

1
toolbox: { feature: { saveAsImage: {} } }

最后，一张小卡片

考试前可以只背这一个骨架：

1
2
3
4
5
6
7
8
option = {
    title:   {},
    tooltip: {},
    legend:  {},
    xAxis:   {},
    yAxis:   {},
    series:  [{ type: '类型', data: [] }]
}

再记住哪些图走的是”特殊通道”：

1
2
3
4
5
6
7
饼图 / 漏斗图  →  不要 xAxis、yAxis
雷达图         →  多一个 radar
树图           →  data: [data]，JSON 用 fetch 读
关系图         →  data 写节点，links 写连线
地图           →  map 指定地图名，fetch 读数据
toolbox        →  saveAsImage 导出效果图
散点图         →  data 写 [[x, y], [x, y]]

其实 ECharts 没有那么多需要死记的东西。

它就是一只小抽屉，每个字段都有自己的位置。标题进 title，提示进 tooltip，数据进 series。一开始看会觉得字段很多，但放久了会发现，它们都很安分，不会乱跑。

考试的时候别慌。先把骨架写出来，判断图表类型，再把数据放进正确的位置。

一步一步来，图就亮起来了。

]]> https://blog.399521.xyz/2026/06/24/echarts-exam-notes/ 2026-06-23T16:00:00.000Z 备考数据可视化的那段时间，不知道为什么总喜欢在很晚的时候看文档。

窗外安静，屏幕亮着，翻着翻着就忽然觉得——ECharts 这个东西，好像不太一样。

它不像平时写 Java 或者 Python，不是在命令计算机”先做这个，再做那个”。更像是在填一]]>

把 ECharts 当成一张温柔的配置表 2026-06-25T04:31:07.929Z 星屿 傍晚的云被染成了浅浅的粉色，风从窗边经过，把今天最后一点燥热也带走了。

我忽然觉得，应该找一个地方，把那些容易被忘记的小事好好收起来。

可能是一首循环了很多遍的歌，一张偶然拍到的晚霞，也可能只是某个瞬间突然冒出来的奇怪念头。它们看起来并不重要，却悄悄组成了生活闪闪发亮的部分。

欢迎来到星屿

这里不会有宏大的开场，只有一些轻飘飘的日常、喜欢的作品，以及偶尔认真写下的心情。

如果你也刚好路过，就坐一会儿吧。

愿我们都能在平凡的日子里，捡到属于自己的小星星。✨

]]> https://blog.399521.xyz/2026/06/23/hello-world/ 2026-06-22T16:00:00.000Z 傍晚的云被染成了浅浅的粉色，风从窗边经过，把今天最后一点燥热也带走了。

我忽然觉得，应该找一个地方，把那些容易被忘记的小事好好收起来。

可能是一首循环了很多遍的歌，一张偶然拍到的晚霞，也可能只是某个瞬间突然冒出来的奇怪念头。它们看起来并不重要，却]]>

在星光落下之前 2026-06-24T15:00:10.737Z