【实例】推荐一款带有设计器的JS图表插件

LouisDr 发布于 2015/01/04 09:38
阅读 3K+
收藏 5

【Gopher China万字分享】华为云的Go语言云原生实战经验!>>>

    笔者今天通过一个分析实例来推荐一个新的图表插件,它跟echarts,highcharts这些有一些区别,希望给各位看客一些启发!

    智能手机的大战在2009年就已经打响了,5年的时间美国苹果和它的iOS始终是赢家,正如两次世界大战美国始终是赢家是一样的。不论是在等公交,还是在乘地铁,不论是晚上睡觉还是白天上课上班,就连出去吃饭,也是一排排的iPhone。用户的口袋越来越大,钞票越来越多,对手机的要求也就越来越丰满。那么,是否给人一种假象:苹果手机已经称霸全球,成为新一代诺基亚了呢?这个问题我们不方便讨论,反正我是用过诺基亚用过htc用过三星也用过iPhone的,各有优势吧!

    笔者最近搜寻了一些关于Apple产品的一些数据,找了一个专业的分析工具做了一些图表,希望能给大家一个关于iPhone市场情况的直观说明。
    先来说一说我用的这个分析工具吧,因为正在搞页面的前端开发,有时候要嵌一些图表进去,因此形成了“职业病”,今天用的就是一个图表插件,能提供分析展现,也能嵌入页面。这个插件不知道是什么公司还是某个团队刚发出来的,名曰okaycharts。呃,是的,我也觉的这个名字怪怪的。但总能让人记住不是?链接我就不贴了,反正是不收费的东西,自个儿去官网下吧!
 
图1  贴图一张,这是Okaycharts的界面


    废话少说,直入正题!数据全部来源于互联网,本文一些观点也许片面和不准确,轻喷!
排序 移动设备品牌 使用量占比

排序

移动设备品牌

使用量占比

1

苹果

20.44%

2

三星

19.32%

3

华为

5.99%

4

小米

5.16%

5

联想

4.87%

6

OPPO

3.89%

7

步步高

3.82%

8

酷派

3.46%

9

中兴

2%

10

HTC

1.93%

11

金立

1.42%

12

索尼爱立信

1.22%

13

魅族

0.89%

14

天语

0.89%

15

红米

0.67%

16

海信

0.57%

17

摩托罗拉

0.45%

18

LG

0.30%

19

朵唯

0.23%

20

欧博信

0.20%

表1  部分品牌手机份额

    打开Okaycharts后,新建一个工作表,也许是已经自动新建了一个了。右侧可以选择数据源,数据源分成Excel,Json和内置数据集,做前端开发用json比较多,可以实现动态数据刷新。今天我们拿到的数据是Excel,因此就用本地Excel做个示范吧。

   

                     图2 导入数据源  

               图3 数据集种类选择

    选择我找到的Excel文档,点击预览,就可以看到和Excel表格一样的内容了。这里面我也费了一点点功夫,我的数据表格不是标准的字段——内容模式,而是比较凌乱的组合式表格,这样的表格在这个软件中读取不了,毕竟不是用来做Excel 的,哈哈。然后我把表格简单处理了一下,目的是一图一表,下面看下预览的表格长什么样子。
 
图4  Okaycharts表格预览
    下面就是唯一的难点所在了,就是在选择图表后如何定义表的几个参数。其实做过图的人一看就明白了,横轴是分类轴,系列是并列出现的不同数据,比如柱形图里在同一个横坐标下的两个柱子,就是两个系列。系列是完整出现的,每个分类都应该有这几个系列的值。
也许这么说还是难以理解,下面来看看Apple和各大手机上的份额占有图。
 
图5  主流手机品牌市场份额
    我们都知道iPhone是利润率最高的手机了,现在iPhone的市场占有率也变成了第一!原来大家的感觉非常正确!iPhone已经成为了名副其实的街机!哈哈!
    这样的原因是多方面的。对手机有所了解的人都知道,iPhone的配置是很一般的,比同时期推出的其他厂商的旗舰机都要低上不少,什么CPU,什么RAM,如果用一些手机跑分软件来测试的话,iPhone绝对排在中庸的位置,价格却排在第一位第二位!新出的iPhone6和Plus,动辄五六七千。我们究其原因,到底是哪一种因素让全世界这么多人为之趋之若鹜呢?

好吧,我用问卷星做了一个投票,找了800多个样本,下面我们来看看结果:

图6  部分用户选择iPhone的原因
    不得不承认iOS系统的稳定、流畅和美观大方的UI还是颇得消费者青睐的,大家选择iPhone,非常大的原因,就是它比Andriod机更加注重用户体验。互联网时代的第一思维是用户体验至上。苹果公司的设计师非常准确得捏住了用户的思维,并且拥有世界上最棒的工业设计师。因此在硬件软件UI乃至外观上都做到了无可挑剔的地步。无怪乎Apple已经以7000亿美金市值成为世界第一大科技公司了。
    iPhone6今年秋天刚刚走向市场,其对市场的影响力不言而喻。我们分析下面分析一下iPhone的前几代产品的份额趋势,来预测一下iPhone6上市后半年的市场保有情况。
 
图7  iPhone5s半年市场占有量
 
图8  iPhone5半年市场占有量
 
图9  iPhone4s半年市场占有量
也许这里有一个不算冲击的冲击,每代新产品都会占有所有移动设备20%左右的份额,而上一代产品的保有量开始产生下滑——很明显这是发烧玩家和铁粉在“赶潮流”的过程。而最看重手机使用价值的这部分用户还在用着隔代的产品。一台电脑的使用寿命是5-8年,一台手机的主板、芯片和电脑的工艺相差无几。排除掉电池和和硬件的问题,手机的使用寿命至少也应该有2-3年。苹果产品的更新迭代确是每年一次的。那么,你是换还是不换?
笔者的iPhone5在一个大雨的夜里进水了~主板没有烧坏,但是触摸屏和显示屏之间产生了重重的水雾,严重影响了使用体验和操作。因此赶了一波潮流,买了一台iPhone6。可是冷静下来想了一想,至于么?进水了大不了换个屏幕,趁机换个后盖和电池,翻新了不是?哈哈哈,我这里还有iPad的大量数据,还有一些销售数据比较庞杂,待我整理好了再写一写为啥一个做手机的公司能成为全球第一大!
最后来说一说这个okaycharts。现在做数据可视化的工具特别多,选用charts的原因就是它能嵌入web中,能嵌入App中,也可以实现动态刷新。这样的插件百度也做了,叫echarts。但百度的echarts用起来需要有编程基础,要写一些代码。Okaycharts多了一个设计器,操作起来比较简单,也能够提供JS代码和接口编辑,值得一看!


加载中
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部