慕课在线编辑器

代码提交代码

<!DOCTYPE html>
<html lang="zh-CN">
	<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 Example</title>
	</head>
	<body>
		<div id="main" style="width: 600px; height: 400px;"></div>

const option = {
				toolbox: {
					feature: {
						magicType: {
							type: ['line', 'bar', 'stack', 'tiled'],
							option: {
								// 类型切换时，下述配置项将被merge到对应类型的图表 series 中
								line: { smooth: true },
								bar: { label: { show: true } },
								stack: { label: { show: true, color: 'red' } },
							},
							seriesIndex: {
								line: [0],
							},
						},
					},
				},
				xAxis: {
					type: 'category',
					boundaryGap: false,
					data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
				},
				yAxis: {
					type: 'value',
					axisLabel: {
						formatter: '{value} °C',
					},
				},
				series: [
					{
						name: '最高气温',
						type: 'line',
						data: [11, 11, 15, 13, 12, 13, 10],
					},
					{
						name: '最低气温',
						type: 'line',
						data: [1, -2, 2, 5, 3, 2, 0],
					},
				],
			};
			myChart.setOption(option);
		</script>
	</body>
</html>

运行结果