默认主题：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Echarts内置主题</title>
<script src="./lib/echarts.js"></script>
</head>
<body>
<div style="width: 600px; height: 400px"></div>
<script>
let mCharts = echarts.init(document.querySelector('div'))
let xDataArr = ['Jing','Dean','Amy','Susan','Rebbeca','Tom']
let yDataArr = [99, 90, 87, 89, 68, 52]
let option = {
xAxis: {
type: 'category',
data: xDataArr
},
yAxis: {
type: 'value'
},
series: [
{
name: 'Javascript Grades',
type: 'bar',
data: yDataArr,
markPoint: {
data: [
{
type: 'max',
name: '最大值'
}, {
type: 'min',
name: '最小值'
}
]
},
markLine: {
data: [
{
type: 'average',
name: '平均值'
}
]
},
label: {
show: true,
rotate: -30
},
barWidth: '40%'
}
]
}
mCharts.setOption(option)
</script>
</body>
</html>
light主题
dark主题
自定义主题
把下载好的主题保存到本地，然后引用并配置：
主题调色盘
全局调色盘
全局调色盘的颜色会覆盖主题调色盘的颜色
局部调色盘
会覆盖主题调色盘和全局调色盘的颜色
颜色渐变
