百度前端技术学院是一个为大学生创办的免费的前端技术实践、分享、交流平台。由百度校园招聘组、百度校园品牌部、百度前端技术部以及多个百度的前端团队联合创办。学院组织了一批百度在职工程师,精心编写了数十个实践编码任务,将技术知识点系统有机地串联在各个充满趣味与挑战的任务中,同学们通过实际地编码练习来掌握知识,再辅以互相评价、学习笔记等方式,加深对于学习内容的理解。在过去的三年中,百度前端技术学院累积吸引了上万名同学参加,并且有数十名同学在学习后,顺利加入了百度,成为了百度的前端工程师。

ECharts No.4 - 可视化前的数据预处理

进阶

人数68人在学习该课程,有35人已经完成该课程

时间平均用时2.3

关键词echartsdata数据可视化数据预处理

课程概述

作业提交截止时间:04-24

任务目的
  • 学会使用 Node.js 将获取的 csv 格式的数据转换成能够用 echarts 展现的格式。
  • 为什么要『数据预处理』?
    • 我们拿到数据,或者自己整理数据,常使用『电子表格』(例如微软的 Excel、苹果的 Numbers)。csv 是这些电子表格软件都能识别的文件格式,这种格式很简单(只用逗号和换行符分隔数据)。而图表库一般都有自己的数据格式要求。例如 JavaScript 图表库要求数据的输入是 JSON 或者 JavaScript Array 格式:
      [
        [20090821, A, 25.6, 25.61, 25.22, 25.55, 34758],
        [20090824, A, 25.64, 25.74, 25.33, 25.5, 22247],
        [20090825, A, 25.5, 25.7, 25.225, 25.34, 30891]
      ]
      
      于是我们在使用 echarts 前,需要把 Excel 中的数据转换为 JSON 格式,从而图表库能够读取。
    • 除了格式转换外,假如原始数据的结构可能不适合与图表展现,也可以在转换中按需做一些处理。
任务描述
  • 这里 有一份从 http://pages.swcp.com/stocks/ 获取的 csv 格式的股票数据。
    数据大体长成这样:
      20090821,A,25.6,25.61,25.22,25.55,34758
      20090824,A,25.64,25.74,25.33,25.5,22247
      20090825,A,25.5,25.7,25.225,25.34,30891
      ...
    
    其中,各个列依次分别表示每天的:Date, Ticker, Open, High, Low, Close, Volume
  • Node.js 处理数据成 echarts 可接受的 JSON 或者 JavaScript Array 格式
  • K 线图 结合 折线图柱状图 展现这些数据。
任务注意事项
学员提交的作业 (-)
学员名称提交时间提交的代码预览效果评价数平均得分操作
课程优秀学习笔记
标题发布时间浏览量点赞量
K线图的实现2017-02-26 20:45232611
点击查看更多课程优秀笔记