数据输入——生成你需要的echart图(堆积柱状图、扇形图、嵌套环形图)
最近论文需要一些比较直观的图表, 发现echart做出来的图还是比较美观的,这里介绍如何修改数据生成你需要的echart图。
1.堆积柱状图:
http://echarts.baidu.com/examples/editor.html?c=bar-stack

以上的类型的颜色是自动分配的,stack属性可以将同一类型的数据放在一个矩形图中。
2.扇形图
http://echarts.baidu.com/examples/editor.html?c=pie-legend

1---->随机生成扇形图中的
2---->随机生成对应名字的数量
3---->显示几个名字在图形中
function代码可以改为下面代码样式,来传入自己的数据:
function genData(count) {
var nameList = [
'儿童', '无标记', '灾难', '戏曲', '传记', '战争', '家庭', '历史', '科幻', '悬疑', '武侠', '冒险', '古装', '鬼怪', '爱情', '动作', '动画', '奇幻', '剧情', '惊悚', '犯罪', '运动', '短片', '喜剧','同性','恐怖'
];
var legendData = [];
var seriesData = [];
var list_1=[4,20,2,2,2,14,16,23,11,39,17,15 ,64,2,137,22,8,36,231,9,12,1,14,18,1,1]
var selected = {};
for (var i = 0; i < 26; i++) {
name =nameList[i];
legendData.push(name);
seriesData.push({
name: name,
value: list_1[i]
});
selected[name] = i <27;
}
return {
legendData: legendData,
seriesData: seriesData,
selected: selected
};
}
3.嵌套环形图
http://echarts.baidu.com/examples/editor.html?c=pie-nest

selected表示哪一个被选中,上面的data表示内圆,是外面环的总和,从上到下要按顺序排列即可(见上图),当然你也可以不这样排列,但是这样就得不到对应的效果图。
数据输入——生成你需要的echart图(堆积柱状图、扇形图、嵌套环形图)的更多相关文章
- 数据输入——生成你需要的echart图(世界地图,气泡图)
上一篇文章介绍了:堆积柱状图.扇形图.嵌套环形图,现在来介绍一下:世界地图和气泡图 1.世界地图 http://echarts.baidu.com/examples/editor.html?c=map ...
- echart 折线图、柱状图、饼图、环形图颜色修改
之前在做报表的时候用过echart 用完也就完了,而这次在用的时候已经忘了,所以这里简单记录一下,好记性不如烂笔头!!! 1.折线图修改颜色: xAxis: { type: 'category', b ...
- Webstorm+Webpack+echarts构建个性化定制的数据可视化图表&&两个echarts详细教程(柱状图,南丁格尔图)
Webstorm+Webpack+echarts ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(I ...
- Qt编写自定义控件41-自定义环形图
一.前言 自定义环形图控件类似于自定义饼状图控件,也是提供一个饼图区域展示占比,其实核心都是根据自动计算到的百分比绘制饼图区域.当前环形图控件模仿的是echart中的环形图控件,提供双层环形图,有一层 ...
- 修改echarts环形图的牵引线及文字位置
修改echarts环形图的牵引线及文字位置,下面代码及效果不仅如此,也包含了其它的效果哦.有问题可以留言. 根据echarts官方示例修改效果: 官方示例图: 修改效果图: 直接上代码:其它不多说. ...
- C语言实现数据机构链表的基本操作(从键盘输入生成链表、读取数组生成链表)
利用头插法实现逆置 下面简单介绍一下,算法思想结合图示看 算法思想:"删除"头结点与链表其他结点的原有联系(即将头结点的指针置空),再逐个插入逆置链表的表头(即"头插&q ...
- 模拟Select-Options对象实现多项数据输入功能
模拟Select-Options对象实现多项数据输入功能 Select-Options对象可以同时输入多项值并将所输入数据存入内表以供程序使用,不过Select-Options的功能有一定的局限 ...
- Web 软件测试 Checklist 应用系列,第 1 部分: 数据输入
Web 软件测试 Checklist 应用系列,第 1 部分: 数据输入 本文为系列文章"Web 软件测试 Checklist 应用系列"中的第一篇.该系列文章旨在阐述 Check ...
- 如何用asp.net MVC框架、highChart库从sql server数据库获取数据动态生成柱状图
如何用asp.net MVC框架.highChart库从sql server数据库获取数据动态生成柱状图?效果大概是这样的,如图: 请问大侠这个这么实现呢?
随机推荐
- 【转】Paxos算法1-算法形成理论
——转自:{老码农的专栏} Paxos算法的难理解与算法的知名度一样令人敬仰,从我个人的经历而言,难理解的原因并不是该算法高深到大家智商不够,而在于Lamport在表达该算法时过于晦涩且缺乏一个完整的 ...
- Java 注解概要
转载自:https://www.cnblogs.com/peida/archive/2013/04/24/3036689.html(Java注解就跟C#的特性是一样的) 要深入学习注解,我们就必须能定 ...
- spring p 标签
需要引入命名空间 xmlns:p="http://www.springframework.org/schema/p" p 是什么含义 p 是 property 的缩写,为了简化be ...
- jsTree问题
1. 问题:刷新页面时,会自动打开刚才上次选中的节点 解决办法:去掉'state'插件 2. 关闭一个node时,使用close_all,不能修改class 注:好像用toggle_node,可以op ...
- mysql中设置默认字符编码为utf-8
使用过Linux的同志就知道,在Linux下安装mysql,尤其是使用yum安装的时候,我们是没法选择其默认的字符编码方式.这个就是一个比较头痛的问题,如果Linux数据库中使用到中文的时候,乱码问题 ...
- PO Release Final Closed 灾难恢复
今天不小心 Final Closed了一条Po Release,只能通过后台更新数据恢复了. 更新后可接收可匹配,但不保证更新数据有遗漏,慎用. 更新前备份各表数据 UPDATE PO_LINE_LO ...
- Two ways to see predicates added by VPD or FGAC
http://www.bobbydurrettdba.com/2012/07/17/two-ways-to-see-predicates-added-by-vpd-or-fgac/ Two ways ...
- C#基础复习(2) 之 装箱拆箱
参考资料 [1] @只增笑耳Jason的回答 https://www.zhihu.com/question/57208269 [2] <C# 捷径教程> 疑难解答 装箱和拆箱是什么? 何时 ...
- PHP/ThinkPHP5 框架集成微博登录入库流程示意
PHP/ThinkPHP5 框架集成微博登录入库流程示意 第三方登陆这个东东,目前主要是 微信.微博.qq.淘宝.支付宝 等几个.他们都是基于oath2协议的.原理差不多.这里记录的是我测试的新郎微博 ...
- Win(Phone)10开发第(5)弹,本地媒体服务器的一些注意事项
首先有个wp上的http服务器 http://wphttpserver.codeplex.com/ 使用方式: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 ...