一、简介
G2是阿里巴巴内部开放的数据可视化工具，提供丰富的图表类型，并且简单易上手，有比较完善的示例代码。其生成的图表简单漂亮，而且有JS互动显示，比较适合报告和文章插图。G2的数据来源是json格式数据。
G2绘制的图形
2，计算推荐次数最多的股票
a，读取数据
from sqlalchemy import create_engine
import pandas as pd
sql = "SELECT code FROM stock "
df = pd.read_sql(sql, engine)
b，数据处理
不同的分析师对一只股票可能有重复推荐，这就需要统计每只股票出现的次数，然后让总出现次数从高往低排序。
用到了自然语言处理包nltk的FreqDist词频统计工具。
from nltk import FreqDist
codes = df['code'].get_values()
print "codes ", len(codes)
fdist = FreqDist(codes) #生成词频类
fdf = pd.DataFrame(fdist.items(), columns=['code', 'count']) #转成DataFrame
fdf.sort(columns='count', ascending=False, inplace=True) # 排序
print "fdf ", len(fdf)
c，生成表格
创建html跟一个案例比较相似，这里我们生成markdown格式的表格。
定义一个markdown表格创建工具
"""
markdown 工具
"""
def m_create_table(df):
"""
从pandas的DataFrame生成markdown格式表格
:param df:
:return:
"""
if len(df) == 0:
return ''
datas = []
head = '|'.join(df.columns)
head = "|" + head + "|"
datas.append(head)
datas.append('-|-')
for ix, row in df.iterrows():
data = '|'.join(map(lambda x: str(x), row.get_values()))
data = "|" + data + "|"
datas.append(data)
result = '\n'.join(datas)
# print result
return result
调用并打印显示
makeTable = m_create_table(fdf)
print makeTable
#输出
|name|code|
|-|-|
|隆基股份|601012|
|美的集团|000333|
|贵州茅台|600519|
|华策影视|300133|
|国轩高科|002074|
|网宿科技|300017|
|阳光电源|300274|
|沧州明珠|002108|
|老板电器|002508|
|保利地产|600048|
表格如下：
| name | code |
|---|---|
| 隆基股份 | 601012 |
| 美的集团 | 000333 |
| 贵州茅台 | 600519 |
| 华策影视 | 300133 |
| 国轩高科 | 002074 |
| 网宿科技 | 300017 |
| 阳光电源 | 300274 |
| 沧州明珠 | 002108 |
| 老板电器 | 002508 |
| 保利地产 | 600048 |
3，统计饼图
对于数据比较少的html，可以直接填入数据就能创建比较精美的图表了。
如下，只需修改data的name和value值，就能马上创建一个动态的饼图。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>饼图</title>
<link rel="stylesheet" type="text/css" href="https://as.alipayobjects.com/g/datavis/g2-static/0.0.12/doc.css" />
<!--如果不需要jquery ajax 则可以不引入-->
<script src="https://a.alipayobjects.com/jquery/jquery/1.11.1/jquery.js"></script>
<script src="https://a.alipayobjects.com/alipay-request/3.0.3/index.js"></script>
<!-- 引入 G2 脚本 --><script src="https://as.alipayobjects.com/g/datavis/g2/1.2.6/index.js"></script>
</head>
<body>
<div id="c1"></div>
<!-- G2 code start -->
<script>
var data = [
{name: '买入', value: 17776 },
{name: '增持', value: 19890},
{name: '中性', value: 6814},
{name: '减持', value: 4986},
{name: '卖出', value: 494},
];
var Stat = G2.Stat;
var chart = new G2.Chart({
id: 'c1',
width: 600,
height: 400
});
chart.source(data);
// 重要：绘制饼图时，必须声明 theta 坐标系
chart.coord('theta', {
radius: 0.8 // 设置饼图的大小
});
chart.legend('bottom');
chart.intervalStack()
.position(Stat.summary.percent('value'))
.color('name')
.label('name*..percent',function(name, percent){
percent = (percent * 100).toFixed(2) + '%';
return name + ' ' + percent;
});
chart.render();
// 设置默认选中
var geom = chart.getGeoms()[0]; // 获取所有的图形
var items = geom.getData(); // 获取图形对应的数据
geom.setSelected(items[1]); // 设置选中
</script>
<!-- G2 code end -->
</body>
</html>
Paste_Image.png
网友评论