ECharts 是百度开源的 JavaScript 图表库,提供丰富的数据可视化解决方案。以下是核心内容概览:
🌐 快速入门
安装方式
- CDN 引入:
<script src="https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js"></script>
- npm 安装:
npm install echarts --save
- 本地开发:下载源码
- CDN 引入:
基础结构
<div id="main" style="width: 600px;height:400px;"></div>
<script>
var chart = echarts.init(document.getElementById('main'));
chart.setOption({ /* 配置项 */ });
</script>
📈 核心功能展示
- 图表类型
- 柱状图
Bar_Chart
- 饼图
Pie_Chart
- 折线图
Line_Chart
- 雷达图
Radar_Chart
- 3D 图表
3D_Chart
- 柱状图
📚 扩展阅读
- ECharts 官方 API 文档(深入学习推荐)
- 数据可视化最佳实践
- 社区案例分享
📝 示例代码
option = {
title: { text: '示例图表' },
xAxis: { type: 'category', data: ['A', 'B', 'C'] },
yAxis: { type: 'value' },
series: [{ data: [10, 20, 30], type: 'line' }]
};