欢迎访问 这里 查看更多关于大数据平台建设的原创文章。
一.抛出需求：折线图-下钻功能
最近接到领导的一个需求:说是想在原来的月份数据的折线图上，点击某个月份后能显示一个该月份对应的每一天的一个折线图。
欢迎大家访问我的微信公众号: 全栈在路上
来查看更多文章
折线图图一如下：
领导的意图是:比如，点击201609月份这个点后,能够出现一个新的折线图，显示的是201609月份的每一天的数据。
需求看到这里,相信以前接触或使用过highcharts的童鞋就知道了，这是一个下钻的功能。
我的项目现在使用的是echarts3，以前是用过highcharts
二.highcharts的下钻功能
1.看图表
我们来看highcharts官网的一个例子,显示的是各个主流浏览器的一个数值比重，我这里截图如图二所示：
然后点击随意的一个柱子，会出现一个新的图表,如下图图三:(我点击的是第一个柱子:IE浏览器)：
从图三可以看出：
- 显示的是 IE浏览器的各个版本使用率的占比.
- 点击圈红的后退按钮，可以返回上一级的图表.
2.看API
看一下API对钻取的支持,如下图四：
3.疑问
既然highcharts对下钻功能支持那么好，那么echarts在这一块做的怎么样呢？
三.echarts的下钻功能-drilldown
1.看图表
翻了半天，只找到一个矩形树图的例子，类似有那么点下钻的意思，感觉很鸡肋。想了解的点这里。
2.看API
只找到了series的type=treemap类型，如图五：
感觉好鸡肋呀，折线图，柱状图的这些都不支持下钻。。。
3.echarts项目issue区域
去github的echarts项目issue区域看了看，发现已经有了好几条关于钻取的问题，如图六:
然后点最下面的一条件进去看了看，发现是echarts的作者林峰的回复，哈哈，终于看见大神了。如下:
4.翻译一下
好吧，翻译一下：大概意思就是告诉我们echarts不会提供什么钻取的接口，大家要想使用钻取功能，请使用万能的setOption吧。。。
四.总结
看到这里你大概会想说：
- BB了那么久，怎么还不入正题呢？
- echarts的折线图究竟怎么来实现下钻(drilldown)功能呢？
五.未完待续
- 不要着急，本篇主要讲了一下遇见需求后分析问题和解决问题的一些思路。
- 下篇 我会从代码的角度详细介绍怎么一步一步来实现，敬请关注!
- 代码可从github上下载: https://github.com/phping1/ec...
码字不易，转载请注明出处!
最近结合hexo和github pages又搭建了一个新的博客，我会慢慢的将sae博客的文章逐渐迁移过去，欢迎大家访问。
欢迎大家访问我的新系列文章，主要是讲用最新版的express怎么去开发一个简单的blog.
目前已经更新两篇：手把手教你开发nodejs微博网站-开站篇
,手把手教你开发nodejs微博网站-首页篇。
最近在学习nodejs，欢迎大家在看过后踊跃拍砖。
六.欢迎大家关注微信公众号
欢迎访问更多关于webpack系列的原创文章：
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。