大数据时代的图表可视化利器——highcharts,D3和百度的echarts
大数据时代的图表可视化利器——highcharts,D3和百度的echarts
还记得阿里巴巴那个令人澎湃激情的双十一吗?还记得淘宝生动形象地把你的的消费历程一一地展示给你看吗?还记得那些酷炫拽的it报告图表吗?在这个大数据越来越盛行的年代,怎样去表达一些用户的关系,人物的关联,甚至是事情的发展,都让我们有更多的表达方式。其中最简单直接,形象明了的就是用图表说明问题了。
如果在以前,要实现各种图表,可能很多人会选择flash。但是flash成本较高,图表多的时候很耗性能。后来越来越多的纯js框架出现,让大家有了更多的选择。所以接下来我想推荐几个不错的图表js框架给大家用。
1.highcharts
- <html>
- <head>
- <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
- <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/4.0.1/highcharts.js"></script>
- <script>
- $(function () {
- $('#container').highcharts({
- chart: {
- type: 'column'
- },
- title: {
- text: 'My first Highcharts chart'
- },
- xAxis: {
- categories: ['my', 'first', 'chart']
- },
- yAxis: {
- title: {
- text: 'something'
- }
- },
- series: [{
- name: 'Jane',
- data: [1, 0, 4]
- }, {
- name: 'John',
- data: [5, 7, 3]
- }]
- });
- });
- </script>
- </head>
- <body>
- <div id="container" style="min-width:800px;height:400px;"></div>
- </body>
- </html>
再细节的东西我就不详细说了,只要大家去它的中文网看一下,就一清二楚了。
2 D3.js
3.echarts
- option = {
- title : {
- text: '浏览器占比变化',
- subtext: '纯属虚构',
- x:'right',
- y:'bottom'
- },
- tooltip : {
- trigger: 'item',
- formatter: "{a} <br/>{b} : {c} ({d}%)"
- },
- legend: {
- orient : 'vertical',
- x : 'left',
- data:['Chrome','Firefox','Safari','IE9+','IE8-']
- },
- toolbox: {
- show : true,
- feature : {
- mark : {show: true},
- dataView : {show: true, readOnly: false},
- restore : {show: true},
- saveAsImage : {show: true}
- }
- },
- calculable : false,
- series : (function (){
- var series = [];
- for (var i = 0; i < 30; i++) {
- series.push({
- name:'浏览器(数据纯属虚构)',
- type:'pie',
- itemStyle : {normal : {
- label : {show : i > 28},
- labelLine : {show : i > 28, length:20}
- }},
- radius : [i * 4 + 40, i * 4 + 43],
- data:[
- {value: i * 128 + 80, name:'Chrome'},
- {value: i * 64 + 160, name:'Firefox'},
- {value: i * 32 + 320, name:'Safari'},
- {value: i * 16 + 640, name:'IE9+'},
- {value: i * 8 + 1280, name:'IE8-'}
- ]
- })
- }
- series[0].markPoint = {
- symbol:'emptyCircle',
- symbolSize:series[0].radius[0],
- effect:{show:true,scaleSize:12,color:'rgba(250,225,50,0.8)',shadowBlur:10,period:30},
- data:[{x:'50%',y:'50%'}]
- };
- return series;
- })()
- };
- setTimeout(function (){
- var _ZR = myChart.getZrender();
- var TextShape = require('zrender/shape/Text');
- // 补充千层饼
- _ZR.addShape(new TextShape({
- style : {
- x : _ZR.getWidth() / 2,
- y : _ZR.getHeight() / 2,
- color: '#666',
- text : '恶梦的过去',
- textAlign : 'center'
- }
- }));
- _ZR.addShape(new TextShape({
- style : {
- x : _ZR.getWidth() / 2 + 200,
- y : _ZR.getHeight() / 2,
- brushType:'fill',
- color: 'orange',
- text : '美好的未来',
- textAlign : 'left',
- textFont:'normal 20px 微软雅黑'
- }
- }));
- _ZR.refresh();
- }, 2000);
这个框架的参考网址是: http://echarts.baidu.com/index.html
大数据时代的图表可视化利器——highcharts,D3和百度的echarts相关推荐
- 数据脱敏平台-大数据时代的隐私保护利器
什么是数据脱敏 又称数据漂白.数据去隐私化或数据变形.是对核心业务数据中敏感的信息,进行变形.转换.混淆,使得对业务数据中的身份.组织等隐私敏感信息进行去除或掩盖,以保护数据能被合理.安全地利用. 数 ...
- 大数据时代的“找油利器”
能源行业迈入大数据时代 随着数据总量的持续增长和急速膨胀,大数据时代已经来临,石油.电力等能源细分行业纷纷拉开了大数据开发应用的序幕.如何从海量数据中高效获取信息,有效地深加工并最终得到有用数据是能源 ...
- 哈佛商业评论增刊:大数据时代的营销变革 - 电子书下载(高清版PDF格式+EPUB格式)...
<哈佛商业评论>增刊:大数据时代的营销变革-哈佛商业评论 在线阅读 百度网盘下载(l589) 书名:<哈佛商业评论>增刊:大数据时代的营销变 ...
- 大数据可视化html模板开源_大数据时代-可视化数据分析平台必不可少
公众号:不安分的猿人 一.项目简介 DataGear是一款数据管理与可视化分析平台,使用Java语言开发,采用浏览器/服务器架构,支持多种数据库, 主要功能包括数据管理.SQL工作台.数据导入/导出. ...
- 网站分析实战——如何以数据驱动决策,提升网站价值(大数据时代的分析利器)
网站分析实战--如何以数据驱动决策,提升网站价值(大数据时代的分析利器) 王彦平吴盛峰 编著 ISBN 978-7-121-19312-5 2013年1月出版 定价:59.00 316页 16开 编 ...
- 网站分析实战——如何以数据驱动决策,提升网站价值(大数据时代的分析利器)...
网站分析实战--如何以数据驱动决策,提升网站价值(大数据时代的分析利器) 王彦平吴盛峰 编著 ISBN 978-7-121-19312-5 2013年1月出版 定价:59.00 316页 16开 编 ...
- g-sync钟摆演示怎么用_你还在用过时的图表吗?50页大数据时代的优秀PPT图表
数据图表是说服他人的关键,一份有力的数据通常是最好的证明材料. 我们平时做PPT时,都会用到软件自带的一些图表,大家都已经司空见惯了,太普通了,没有什么新意.我在浏览了300页数据化可视化图表,提炼出 ...
- 企业关系网络分析,大数据时代淘金利器
企业关系网络的数据构成 在早期经济发展期间,企业间的业务来往普遍是通过企业经营者与个人的交情或交情的转移发生的,即企业强势关系网的形成大部分依托于个人的人际关系. 随着各种法制法规的建立以及信息透明化 ...
- 云小课|大数据时代的隐私利器-GaussDB(DWS)数据脱敏
阅识风云是华为云信息大咖,擅长将复杂信息多元化呈现,其出品的一张图(云图说).深入浅出的博文(云小课)或短视频(云视厅)总有一款能让您快速上手华为云.更多精彩内容请单击此处. 摘要: 数据仓库服务Ga ...
- 网站分析实战--如何以数据驱动决策,提升网站价值(大数据时代的分析利器)...
<网站分析实战--如何以数据驱动决策,提升网站价值>(大数据时代的分析利器) 基本信息 作者: 王彦平 吴盛峰 出版社:电子工业出版社 ISBN:9787121193125 上架时间:20 ...
最新文章
- vs2017中编译提示一些系统头文件没有找到
- Java理论知识及面试题
- webpack原理探究 打包优化
- iphone以旧换新活动_【武商襄阳购物中心】 参与iphone以旧换新活动,最高可抵4300元,旧机可享10%额外补贴...
- 第九篇:Spring Boot整合Spring Data JPA_入门试炼04
- oracle狎鸥亭_卢永佑 个人主页 - 韩国奥拉克皮肤科整外科 - 美佳网
- php _line_,php基本语法
- FPGA实现VGA显示(六)——————多字符显示及基于fpga的“打字机”实现
- Spring Boot 依赖包讲解
- Java神鬼莫测之MyBatis多表操作延迟加载(四)
- spring boot 2.0.3+spring cloud (Finchley)1、搭建服务注册和发现组件Eureka 以及构建高可用Eureka Server集群...
- excel计算机一级知识点,计算机一级考试考点:Excel电子表格
- Windows10从 微软商店 安装 linux(ubuntu)
- 计算机联锁常见的故障,计算机联锁系统常见故障及处理方法.doc
- 120日均线金叉250日均线是大牛市来临的重要信号
- Elasticsearch 分布式搜索引擎 速学
- 取消管理员取得所有权_win7下取得管理员所有权的技巧
- 微服务下蓝绿部署、红黑部署、AB测试、灰度发布、金丝雀发布、滚动发布的概念与区别...
- 跨境电商运营:亚马逊运营如何分析店铺数据
- dnf大区服务器位置,dnf河北一区是跨几
热门文章
- Codeforces1005E1 - Median on Segments (Permutations Edition)(中位数计数)
- 6 大主流 Web 框架优缺点对比
- 【待填坑】LG_3239_[HNOI2015]亚瑟王
- 使用div模拟table
- pythonreduce()函数、sorted()函数、reversed_cmp函数、类和对象
- IDEA中新建ehcache.xml文件报错
- Kompose: Docker-compose 到 Kubernetes 的迁移工具
- oozie JAVA Client 编程提交作业
- React.js 组件的 props vs state
- bq24075 锂电池 充电电路分析