echarts-画图王
echarts是现在比较流行的一种画图工具,而且是最受关注的和喜爱的,因为他十分简单;
echarts网址:
https://echarts.apache.org
在echarts网站的实例内寻找自己需要的图;
例图:
如果我们要画这样的图一定会十分麻烦;因为他有许多参数和变量,而且我们这是在一张图(网页)里面,这样我们就可以很直观的得出结果和分析;
**案例**
在这里我们根据这样的一个图例来画图
python代码
from flask import Flask,render_template,request#导入库
import pandas as pd#导入库
app = Flask(__name__)#创建一个APP
@app.route('/')
def index():
data= pd.read_csv('./shu.csv')#读取数据表
data.columns=['name','value']#更改表名(根据实际情况书写,可以不要)
data = data[['value', 'name']]#根据实际情况书写(可以不要)
data = data.to_dict(orient='records')#将数据构建成html需要的样式
#data = data.to_dict(orient='records')
#print(data)
return render_template('show.html',data=data)#传送数据
if __name__ == '__main__':
app.run(debug=True)#启动APP
**html**
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 引入echarts -->
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.0/echarts.min.js"></script>
</head>
<body>
<div id="main" style="height:600px;width:800px;background: pink" ></div>
<script>
// 基于准备好的dom,初始化echarts实例
var main = echarts.init(document.getElementById('main'));//获取ID 赋值给main
//配置echarts
var option = {
backgroundColor: '#2c343c',
title: {
text: 'Customized Pie',
left: 'center',
top: 20,
textStyle: {
color: '#ccc'
}
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
visualMap: {
show: false,
min: 10,
max: 300,
inRange: {
colorLightness: [0, 1]
}
},
series: [
{
name: '电影名称',
type: 'pie',
radius: '55%',
center: ['50%', '50%'],
data:{{data|tojson}}.sort(function (a, b) { return a.value - b.value; }),//这里的“|”是用来引用功能的,导入数据data
roseType: 'radius',
label: {
color: 'rgba(255, 255, 255, 0.3)'
},
labelLine: {
lineStyle: {
color: 'rgba(255, 255, 255, 0.3)'
},
smooth: 0.2,
length: 10,
length2: 20
},
itemStyle: {
color: '#c23531',
shadowBlur: 200,
shadowColor: 'rgba(0, 0, 0, 0.5)'
},
animationType: 'scale',
animationEasing: 'elasticOut',
animationDelay: function (idx) {
return Math.random() * 200;
}
}
]
};
// 使用刚指定的配置项和数据显示图表。
main.setOption(option);
</script>
</body>
</html>
运行图例
谢谢点赞评论!
版权声明:本文为qq_44936246原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。