<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> -->
<script src="echarts.min.js"></script>
<title></title>
<style>
</style>
</head>
<body>
<div class="chart" id="main" style="width: 600px; height: 400px;"></div>
<script>
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
animation: false,
tooltip: {
trigger: 'axis'
},
grid: { top: 5, bottom: 5, left: 5, right: 5 },
xAxis: {
type: 'category',
show: false, // 不显示横坐标
splitLine: { show: false },
data: ['20191013', '20191014', '20191015', '20191016', '20191017', '20191018', '20191019']
},
yAxis: {
type: 'value',
show: false,
axisLine: { show: false },
axisTick: { show: false },
splitLine: { show: false },
scale: true
},
series: [{
// 系列: 一组数值以及他们映射成的图
type: 'line',
name: '销量',
symbol: 'none',
smooth: true,
color: ['#6FA9FA'],
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#6FA9FA' },
{ offset: 1, color: '#fff' }
])
}
},
data: ['0', '0', '1', '0', '2', '0', '0']
}],
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>