根据下方给出的数据完成数据可视化练习
- 某公司的产品销售数据如下表，根据数据完成数据可视化。
要求：
- 标题为“某公司产品销量图”
- 副标题为自己的姓名
数据：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">//告诉浏览器以UTF-8编码格式读取HTML文档。
<title>Echarts</title>//网页显示的名字
<script src="echarts.js"></script>//引用echarts
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>//大小窗口
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'))//指定图表的配置项和数据
var option = {
title: {text:'某公司产品销量图',
subtext:'xxx',
left:'center'//居中显示},
tooltip:{},
legend:{
data:['各产品的销售情况']
},
xAxis: {
data: ['手机', '电脑', '笔记本电脑','平板','显卡' ]
},
yAxis:{},
series: [
{name:'销量',
type:'bar',
data:[2500,1800,200,902,318]
}]
};
myChart.setOption(option);
</Script>
</body>
</html>
示例结果图
将
将图中bar改成line即得到折线图
| 品类 | 销量 | 单位 |
| 手机 | 2500 | 部 |
| 电脑 | 1800 | 台 |
| 笔记本电脑 | 200 | 台 |
| 平板 | 902 | 个 |
| 显卡 | 318 | 张 |
