学会数据可视化,老板给我涨薪了(附原型文档)

揭开数据可视化的神秘面纱,升职加薪指日可待!

揭开数据可视化的神秘面纱,升职加薪指日可待!

敲黑板!「数据可视化」 就是让领导,在看数据这件事上,获得更爽体验的办法。

领导爽到了,自然升职加薪也就水到渠成。所以咱们今天就来一起揭开数据可视化的神秘面纱。

1 先看看实战效果

  • 动态折线图
  • 动态柱形图
  • 动态环形图
  • 动态条形图

2 教练我要学可视化

百度一下可视化图表,难免有很多神仙跳出来说这个简单那个简单。见仁见智吧,毕竟条条大路通罗马。

这个玩意不简单,「CSDN的Jin.Lv作者」提到,实现上述动态可视化图表的关键是:

最重要的是axhub用自己编写的Js进行了「前端渲染」,才得以有图表及其动效

Js代码如下:

!function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="/",e(e.s=4)}([function(t,e,n){!function(e,n){t.exports=n()}("undefined"!==typeof self&&self,function(){return function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=331)}([function(t,e,n){var ......

看不懂没关系,咱们合理借力即可。文末有原型文档附件,谢谢大家的投币三连!

3 聊聊可视化图表的类型

简单的咱们可以按照「常用」「不常用」来划分可视化图表。

上面画了脑图,所以就不一个一个去细说了。值得一提的是,「柱状图」「条形图」的概念很有意思,小伙伴们可以自己琢磨下。

在和同事的友好切磋之后,我们得出一个结论:争论概念本身是无意义的,用户(老板)说什么就是什么,over。


0条评论 添加新讨论

登录后参与讨论
Ctrl+Enter 发表