大数据培训新三板挂牌机构 股票代码:837906 | EN CN
阿里巴巴菜鸟级数据产品经理半年回顾总结篇
干货教程:如何绘制业务流程图(二)
干货教程:如何绘制业务流程图(一)
技术贴:如何在数据库中秘密地查询隐私数据
攻略教程:信息图(infographic)是怎么做出来的?
分析师一定要看!用数据讲故事的五个步骤
技术篇:怎样玩转千万级别的数据?
北漂书生:大数据时代SEO数据如何搜集和分析
干货,从十大问题重新认识并读懂互联网
相似图片搜索、算法、识别的原理解析(下)
相似图片搜索、算法、识别的原理解析(上)
制作信息图时请遵循这10条原则
提高表格可读性的一些技巧,适用于Excel、PPT等数据报表
实用教程:如何让Excel图表更具“商务气质”?
一张数据信息图是这样制作完成的
菜鸟读财报,如何从上市公司财报中挖情报?
北大数据分析老鸟写给学弟们一封信
如何一步一步制作出高品质数据信息图?
总结:海量数据分析处理的十个方法
【实战经验】数据分析师如何了解老板真正想法?
零售业数据分析那些事儿
数据分析时l常用电子表格公式【大全】
用数据来告诉你 上市公司财报的秘密
这12个数据能 帮你搞定淘宝店铺
首席工程师揭秘:LinkedIn大数据后台是如何运作的?(四)
首席工程师揭秘:LinkedIn大数据后台是如何运作的?(三)
首席工程师揭秘:LinkedIn大数据后台是如何运作的?(二)
首席工程师揭秘:LinkedIn大数据后台是如何运作的?(一)
淘宝网店从激活到挽留,4步走玩转数据营销
文案怎样写才有意思、不空洞、打动人?
入门级扫盲贴:数据分析的步骤有哪些?
关系即数据,论社交媒体的关系转换
数据的力量,苹果教你用数据鄙视竞争对手
谁说文科生不能做数据分析?数据分析入行→技能提升→优势
产品运营数据分析——SPSS数据分组案例
如何追踪iPhone和iPad等移动设备的用户行为数据?
阿里巴巴中国站:用户满意度指标权重计算方法
广告中的AdNetwork、AdExchange、DSP、SSP、RTB和DMP是什么?
信息图制作教程:关于数值的表现
为什么大数据会如此轰动?(值得深度的文章)
多图技术贴:深入浅出解析大数据平台架构
面板数据分析中标准误的估计修正——根据Peterson (2009)的归纳
财务官、投资人、CIO看过来:给企业数据定价
推荐系统中常用算法 以及优点缺点对比
探索Weotta搜索引擎背后的大数据技术
如何识别虚假数据?
为什么我们像驯化小狗那样驯化算法
程序员必须知道的10大基础实用算法及其讲解
电子商务:最影响转化率的九大要素
如何迅速成为一名数据分析师?
想从事大数据、海量数据处理相关的工作,如何自学打基础?
如何用亚马逊弹性MapReduce分析大数据?
译文:机器学习算法基础知识
给hadoop新手的一封信:Hadoop入门自学及对就业的帮助
从入门到精通,我是这样学习算法的
小商家,从老客户身上获取的数据才更有意义
13页PPT讲述:大数据下网站数据分析应用
40页PPT详解:京东大数据基础构架与创新应用
67页PPT解密搜索引擎背后的大技术:知识图谱,大数据语义链接的基石
营销洞察力——10个营销度量指标
技术篇:前端数据之美如何展示?
董飞:美国大数据工程师面试攻略【PPT】
easel:如何制作好的信息图——来自专家的顶级技巧
大数据实操:以3D打印机为例,如何知道卖点有没有市场需求?
大数据建模 需要了解的九大形式
用户画像数据建模方法
从规划开始,公司or企业如何入手和实施大数据?
干货:商品信息数据分析和展现系统的设计与开发
高手教你用Excel制作百度迁徙数据地图
50篇干货:淘宝店/电子商务如何玩转数据分析?
精华索引:大数据实际应用案例50篇
验证最小化可行产品 (MVP) 的 15 种方法
干货:数据分析师的完整知识结构
大数据技术Hadoop面试题,看看你能答对多少?答案在后面
用SPSS做数据分析?先弄懂SPSS的基础知识吧
怎样做出优秀的扁平化设计风格PPT? 扁平化PPT设计手册#3
解答│做大数据过程中遇到的13个问题
40页PPT│社交网络发展的新动力:大数据与众包
以Amazon、豆瓣网为例,探索推荐引擎内部的秘密#1
怎样做出优秀的扁平化设计风格PPT?#2
怎样做出优秀的扁平化设计风格PPT?#1
36页PPT│大数据分析关键技术在腾讯的应用服务创新
如何丰满地做SWOT分析?
【35页PPT】TalkingData研发副总阎志涛:移动互联网大数据处理系统架构
27页PPT|以珍爱网为例,如何构建有业务价值的数据分析系统?
国外数据新闻资源分享
21页PPT重磅发布:Mariana——腾讯深度学习平台的进展与应用
从0到100——知乎架构变迁史
PPT解读:百度大数据质量保障方案探索
45页PPT|大数据环境下实现一个O2O通用推荐引擎的实践
从数据看豆瓣兴衰
深度学习系列:解密最接近人脑的智能学习机器——深度学习及并行化实现(四)
重磅推荐:129页PPT讲述移动时代创业黄金法则 via:腾讯企鹅智酷
重磅推荐:大数据工程师飞林沙的年终总结&算法数据的思考
OpenKN——网络大数据时代的知识计算引擎
大数据下城市计算的典型应用
技术贴:大数据告诉你,如何给微信公众号文章取标题?
你的QQ暴露了你的心——QQ大数据及其应用介绍PPT
如何从企业报表看企业的生存能力?
实用的大数据技巧合集
技术帝揭秘:充电宝是如何盗取你的个人隐私的?
重磅!50页PPT揭秘腾讯大数据平台与推荐应用架构
原创教程:饼图之复合饼图与双层饼图(1)
PPT:大数据时代的设计特点——不了解这个你做不了今天的设计
教程贴:如何用方程式写春联?
原创教程:如何用Excel制作简易动态对比图
深度译文:机器学习那些事
教程帖:数学之美——手把手教你用Excel画心(动态图)
董老师走进斯坦福,聊聊硅谷创业公司和大数据的事儿(附课件PPT下载)
【限时】年度钜献,108个大数据文档PDF开放下载
董飞专栏:大数据入门——大数据相关技术、Hadoop生态、LinkedIn内部实战
亿级用户下的新浪微博平台架构
一张图了解磁盘里的数据结构
浅析数据化设计思维在阿里系产品的应用
美团推荐算法实践
一个P2P创业公司有哪些部门,都是做什么的?
一个P2P平台的详细运营框架是怎样的?
机器学习中的算法——决策树模型组合之随机森林与GBDT
神经网络简史
58页PPT看懂互联网趋势,大数据/物联网/云计算/4G都有了
广点通背后的大数据技术秘密——大规模主题模型建模及其在腾讯业务中的应用(附PPT)
微信红包之CBA实践PPT——移动互联网海量访问系统设计
一文读懂机器学习,大数据/自然语言处理/算法全有了……
搜狐新闻客户端的背后大数据技术原理——推荐系统(PPT)
原创教程:用Excel做动态双层饼图
半小时读懂PMP私有广告交易市场
怎样分析样本调研数据(译)
PPT:支付宝背后的大数据技术——DataLab、Higo的实践及应用
大数据技术人员的工具包——开源大数据处理工具list(限时下载)
计算机视觉:随机森林算法在人体识别中的应用
24页PPT:机器学习——支持向量机SVM简介(附下载)
互联网高手教你如何搜集你想要的信息
深度:对地观测大数据处理、挑战与思考
原创教程:用Excel做饼图之复合饼图与双层饼图(2)
移动大数据时代: 无线网络的挑战与机遇(附pdf下载)
Excel使用技巧——25招必学秘技
【年度热门】加上这些 Excel 技能点,秒杀众人(多图)
原创教程:用Excel做纵向折线图
知识图谱——机器大脑中的知识库
何明科专栏:用数据化的方式解析投资条款
DT时代,如何用大数据分析创造商业价值(23页PPT)
MIT牛人梳理脉络详解宏伟现代数据体系
你的老婆是怎么算出来的?揭秘佳缘用户推荐系统
飞林沙:商品推荐算法&推荐解释
PPT:如何成为真正的数据架构师?(附下载)
开源大数据查询分析引擎现状
董飞专栏:打造数据产品必知秘籍
译文:如何做强大又漂亮的信息图
如何使用Amazon Machine Learning构建机器学习预测模型
如何运用数据协助货架管理(内附26张PPT)
SVM算法
主流大数据系统在后台的层次角色及数据流向
PPT:阿里全息大数据构建与应用
人脸识别技术大总结——Face Detection & Alignment
教程:用Excel制作成对条形图
易观智库:大数据下的用户分析及用户画像(18页PPT附下载)
技术向:如何设计企业级大数据分析平台?
电商数据分析基础指标体系
IBM SPSS Modeler 决策树之银行行销预测应用分析
拓扑数据分析与机器学习的相互促进
基于 R 语言和 SPSS 的决策树算法介绍及应用
用php做爬虫 百万级别知乎用户数据爬取与分析
另类新浪微博基本数据采集方法
以10万+阅读的文章为例 教你做微信公众号的运营数据分析
破解数据三大难题:变现?交易?隐私?
微店的大数据平台建设实践与探讨
阿里巴巴PPT:大数据基础建议及产品应用之道
基于社会媒体的预测技术
人工智能简史
技巧:演讲中怎样用数据说话
马云和小贝选谁做老公?写给非数据人的数据世界入门指南
掘金大数据产业链:上游资源+中游技术+下游应用
原创教程:手把手教你用Excel做多层折线图
销售分析:如何从数据指标发现背后的故事
如何一步步从数据产品菜鸟走到骨干数据产品
也来谈谈微博的用户画像
行走在网格之间:微博用户关系模型
如何拍出和明星一样美爆的自拍照?斯坦福大学用卷积神经网络建模告诉你
运营商如何玩转大数据? 浙江移动云计算和大数据实践(PPT附下载)
大数据分析的集中化之路 建设银行大数据应用实践PPT
腾讯防刷负责人:基于用户画像大数据的电商防刷架构
创业提案的逻辑
友盟分享 | 移动大数据平台架构思想以及实践经验
寻路推荐 豆瓣推荐系统实践之路
“小数据”的统计学
重磅!8大策略让你对抗机器学习数据集里的不均衡数据
小团队撬动大数据——当当推荐团队的机器学习实践
微博推荐架构的演进
科普文 手把手教你微信公众号数据分析
信息图制作的六个注意点
【权利的游戏】剧透新玩法:情理之中?意料之外
推荐系统(Recommender System)的技术基础
核心算法 谷歌如何从网络的大海里捞到针
Quora数据科学家和机器学习工程师是如何合作的
阿里巴巴PPT:大数据下的数据安全
数据建模那点事儿
全民拥抱Docker云–Lhotse系统经验分享
实时股票分析系统的架构与算法
架构师必看 京东咚咚架构演进
什么叫对数据敏感?怎样做数据分析?
推荐系统基础知识储备
刘德寰:数据科学的整合与细分 数据科学的七个危险趋势(视频)
实际工作中,如何做简单的数据分析?
分布式前置机器学习在威胁情报中的应用(附PPT下载)
数据科学 怎样进行大数据的入门级学习?
扛住100亿次请求 如何做一个“有把握”的春晚红包系统?(PPT下载)
从 LinkedIn 的数据处理机制学习数据架构
大数据会如何改变管理咨询公司(I)
优秀大数据GitHub项目一览
生硬的数字和数据新闻:这么近,那么远
经典大数据架构案例:酷狗音乐的大数据平台重构(长文)
揭秘中兴大数据在银行领域的系统部署
基于大数据的用户画像构建(理论篇)
【R】支持向量机模型实现
数据图处处有陷阱?五个例子教你辨真伪
如何用R绘制地图
你确定你真的懂用户画像?
数据模型需要多少训练数据?
【接地气】01 数据报表的颜色怎么配
游戏价值和数据分析新思路
【R】异常值检测
快的打车架构实践
豆瓣还是朋友圈:大数据、新方法和日常问
PPT数据图表,怎么做才好看?
大道至简的数据体系构建方法论
数据的误区及自身业务
新浪微博的用户画像是怎样构建的?
面试干货!21个必知数据科学面试题和答案part1(1-11)
易观智库:中国大数据产业生态图谱2016(附下载)
Airbnb的数据基础架构
50PB海量数据排序,谷歌是这么做的
大数据时代工程师如何应对–今日头条走进硅谷技术讲座
D3.js教学记(下)
D3.js教学记(上)
飞林沙:企业级服务公司如何赚钱?只有平台级产品才有大数据的理论
一个母婴电子商务网站的大数据平台及机器学习实践
7大板块 组成数据分析师的完整知识结构
干货:SaaS领域如何分析收入增长?
学术 | 词嵌入的类比特性有实用意义吗?
6个用好大数据的秘诀
一个数据库外行眼中的微信优化 (附专家补充)
大数据调研,如何实现快全准?
数据大师Olivier Grisel给志向高远的数据科学家的指引
数据堂肖永红:数据交易的是使用权或数据的增值,而不是数据本身(PPT附下载)
淘宝商品详情平台化思考与实践
刘译璟:百分点大数据理念和实践(图文+PPT下载)
如何快速搞定一份看起来还不错的演示文档?
【BABY夜谈大数据】决策树
数据驱动设计:数据处理流程、分析方法和实战案例
美图数据总监:Facebook的法宝,我们在产品中怎么用?
树的内核:量化树结构化数据之间的相似性
拿到用户数据之后,LinkedIn怎么赚钱?
GrowingIO张溪梦:增长黑客的核心 企业应该重视产品留存率(附PPT下载)
[译]Airbnb是如何使用数据理解用户旅行体验的?
微博推荐数据服务代理: hyper_proxy的设计和实现
星图数据谷熠:消费领域DaaS 大数据重构未来商业游戏规则(附PPT下载)
鲍忠铁:TalkingData大数据技术与应用实践(PPT下载)
【干货教材】数据分析VS业务分析需求
九枝兰专访:数字营销的核心—企业如何使用数据管理平台(DMP)进行精准营销
我们的应用系统是如何支撑千万级别用户的
R应用空间数据科学
Excel进行高级数据分析(上)
Excel进行高级数据分析(下)
国内各大互联网公司2.0版技术站点收集
网站数据分析思路导图
大数据分析报表设计开发要素
大数据需要的12个工具 推荐
YARN/MRv2 Resource Manager深入剖析—NM管理
YARN/MRv2 Resource Manager深入剖析—RMApp状态机分析
Hadoop 1.0与Hadoop 2.0资源管理方案对比
Hadoop 2.0中单点故障解决方案总结
Hadoop 2.0 (YARN)中的安全机制概述
Hadoop 新特性、改进、优化和Bug分析系列1:YARN-378
Hadoop 新特性、改进、优化和Bug分析系列2:YARN-45
Hadoop 新特性、改进、优化和Bug分析系列3:YARN-392
Hadoop版本选择探讨
探究提高Hadoop稳定性与性能的方法
《Effective C++》读书笔记(第一部分)
Hadoop分布式环境下的数据抽样
Hadoop计算能力调度器算法解析
如何编写Hadoop调度器
数据结构之红黑树
Hadoop pipes设计原理
《C++ Primer plus》学习笔记之”类”
《C++ Primer plus》学习笔记之”类继承”
《C++ Primer plus》学习笔记之”C++中的代码重用”
《C++ Primer plus》学习笔记之”异常”
《C++ Primer plus》学习笔记之”RTTI”
Hadoop pipes编程
Hadoop Streaming高级编程
《C++ Primer plus》学习笔记之”标准模板库”
《C++ Primer plus》学习笔记之”输入输出库”
Linux Shell 命令总结
算法之图搜索算法(一)
awk使用总结
素数判定算法
《C++ Primer plus》学习笔记之“函数探幽”
使用Thrift RPC编写程序
如何在Hadoop上编写MapReduce程序
怎样从10亿查询词找出出现频率最高的10个

D3.js教学记(上)

于2017-04-01由小牛君创建

分享到:


D3.js教学记由Lynn Cherny授权数据新闻网编译

原文请见http://blogger.ghostweather.com/2016/01/teaching-semester-of-d3js.html

翻译:佳昕

之前的一个学期我在迈阿密大学新闻专业开设D3.js课程;疯狂的是,我要同时负责教授以及评分。哇哦,这一学期的教课真的很不易。教写代码,特别是教非计算机专业背景的学生真是一种特别的挑战。不过很幸运的是, 这第一学期的教学班规模很小,小白鼠学生们非常有耐心,而且很有积极性。

这堂课是为作品网站制作者们设计的,重点在于交互式可视化的新闻制作。 第一学期我们用了联合国儿童基金会(UNICEF)的数据,详情可见作品案例中。接下来这一学期就没有那么多新闻专业学生了,也就是说我们会做一些内容上的调整,这一过程我会在repo中再做梳理。这篇博客中,我会聊聊我们的经验以及挑战。下一篇博客中会具体展示学生们的作品。

网页交互以及新闻可视化

为何要教D3? 不止一个教过新闻专业学生的朋友跟我说过他绝对不会再做这件事了。就在我开启这次冒险之前我听到了这句话。但是,这堂课意在做数据交互的可视化,也就是说,一个图表不只是像一个静止的柱状图那样,读者们也不只是盯着那些柱状图看这么简单。我有一组关于交互式可视化设计的幻灯片, 里面我用到的绝大多数例子也是用D3建起来的,这就是业内现状的主要特点。

目前为止,在数据交互可视化设计的适配度以及和DOM页面交互上,还没有比D3更好的工具。我讲过Highcharts,第一周的一个作业就是用Highcharts来做几个图表。但是D3中的动画过渡效果(以及开放式的具有设计选项的模板)就是它的卖点,所有的学生都想在期末作品中做出很具想象力的艺术动画效果:动画地图,动画线条,地图上的动画线条,可以和地图同步变化的线条,你可以想象出的包含线条和地图的所有形式。(这同时也是对我自己施加压力,帮助他们做出可以想象出的效果。)

在我努力地学习D3的时候,我就很想知道怎样能更好地将图表和页面设计联动起来,但是现有的书籍未深入到任何酷炫的设计,大多数还停留在如何制作独立的静态图。然而静态图用其他D3以外的工具制作起来会更加容易(除非要做一种非比寻常的图表)。所以,在我的课上就更加注重D3代码的页面交互上。D3可以做很多活泼的 效果,像关系网络、平行坐标、桑基图等等。不过这堂课我还是重点放在一些基本的新闻可视化上面:

  1. 表格和热力图
  2. 横纵条形图
  3. 线形图,包括操作多重线形图
  4. 流图/面积图
  5. 分段/分组条形图
  6. 散点图
  7. 多倍制图
  8. 地图

我们也会涵盖一些重要的交互效果,比如转呈、置换数据库来动画出一张新图,如何联动(像选择菜单、按钮、滑动器这样的页面交互元素),制作复杂的提示框,用切换开关、点击鼠标或是鼠标悬停来连接两个独立的图表,标识特殊的数据点,加图例。在JavaScript中,重要的数据概念包括排序,取前十组(或前N组) 数据,导出可估计的变量。

设置工具:GITHUB以及服务器,噢我的天

让大家在第一天设置好服务器和GITHUB真是个 挑战,但是幸运的是,他们中大部分之前多多少少都会一点。不过,大部分学生都不知道怎么使用命令行,他们中的两个人用的Windows系统,所以这对包括 我在内的每个人都是个“挑战”。(我完全忘了不是所有人都自发地就会Unix和Windows命令行。这真把我绕得团团转。)在他们遇到困难的时候,我或 许过分吹嘘了“git stash”的用处,但是我毫不遗憾。不久,他们每周都可以运用自如地git pull(上传)作业,学会怎样使用gist了。

Gist 以bl.ocks的形式给用户构建属于他们自己的作品页面,是D3家族中的关键组成部分。同时,对我而言它们对于评分和除错也非常必要——尤其是在Ian Johnson (@enjalot) 已经发布了 blockbuilder.org之后,这让除错变得容易多了。

某种原因上来 讲,使用服务器确实让编程新手很难以适应。(在看到大家的挣扎之后,我上传了一些给新手看的d3常见问题系列的说明。)只习惯于做一些静态页面设计的人就 不是很理解你为何要使用服务器来观察及运行代码。大家没有意识到,单纯地双击文件会大大花费浏览时间。不,网址行一定要显示”localhost://” 而不是 file://。 前几周的很多问题都出在学生没有把他们的文件上传到服务器上,即使在他们已经设置了服务器之后。(要注意的是:这同样是另一个问题的例子,那就是远程电邮 来调试代码要比在他们身边直接检查难得多。这种例子比比皆是,因而我的办公室时间总是门庭若市。)

用D3来做JavaScript

这 堂课的必修前提是HTML以及CSS,但并没有怎么提及到JavaScript。 很捉急,这就是很多人怎样开始学习D3的,那么就让我们这样开始吧! 像我一样,很多走过这条路的人都知道JavaScript是帮你一点点掌握D3的重要途径,即便在你拿到了D3范例之后也不例外。但就理解D3范例(例如 Mike Bostock的例子)这点来讲就需要对JavaScript的深度理解。

对于所有的数据可视化来讲,数据处理都很困难,有时 候就是卡在数据设置的部分。你可以使用JavaScript以外的工具来处理数据(我比较推荐使用Excel),但是某种程度上讲,你需要掌握直接利用代 码本身来处理数据的能力。重组数据,在界面设计交互上能够得到一些特定数值是相当重要的。将数据库融合来做运算,或者了解并使用像forEach和 maps这样的函数代码来生成子数据组,这些事情对每个人都很难,即便对那些有着编程背景的学生来说亦是如此。我布置过一些纯JavaScript的作业,像调试代码、处理数据,但是坦白来讲,我应该多布置一些这样的作业。(另一方面,评分会更难一些,因为这通常需要很认真地观察每一位学生的代码…… 唔。)

同样,我也应该早一点开始教学生如何使用处理数据的工具。之前,我并没有立刻就教大家使用d3.nest,当时我帮一个可怜的学生 (说你呢,Luis!)写了一个非常麻烦的loop来嵌套他的数据。一小时后,我意识到,“要教他们所有的工具。要教他们nest()。”学生们需要了解 那些辅助性的函数,这会帮他们在这条路上节省很多时间。接下来就是做嵌套数据的作业了。在接下来的春季学期中我也会讲授lodash.js这一块知识。

缺少“复杂”的教学案例

很多现有的D3实例、书籍以及教材都非常基础,甚至是个“玩偶”(从现实框架中提取,未使用真实数据。)对于基础学习,最好的入门书是Scott Murray简单而不可怕的初级读本,Interactive Data Vis for the Web。当然,我们也就是从这里开始,但是当我们接触到更加复杂的动画和转呈元素的时候,里面可以在课堂上使用的优秀案例以及教材就越来越少了。

Jim Vallandingham 和 Nathan Yau在 Flowing Data上的教程是一个很重要的例外;同时,他们也都在各自网站上做新闻可视化教程。我从他们的网站中借用并调改了几个例子,比如多倍制图和地图制作。 Jim的代码会更“高级”一些,我做了一定程度的简化,对此我感受复杂,可忽略。对于Nathan的代码,我有时候会在她用了一些老D3方式或者可以更加 有效的时候我会做一些更新。我同时也会对Scott Murray的例子做一些更新,使用更多D3常用的语言(比如使用更多margin对象话语,去除for-loop)。

即便看到了如何在 D3中使用函数来更新模板,当大家开始做各自作品的时候,每个人又在整理代码这一块十分纠结。当我要求学生们只是把三个图表汇集在一张网页上,在全局范围 (global scope)互相冲突的部分局面大乱。我很了解,这些作品是要以用户端体验而非代码质量来作为评判标准的,代码结构问题让学生们在调代码过程中更加困难。 因而这学期我会更加注重代码结构这一块的讲解。

不幸的是,网络上有更多例子是使用Angular或者React而不是 JavaScript来构架大的作品的。显然,那些框架就解决了整理架构代码的问题,但我觉得这对于每一个教D3的人来说都是一个难题。我不想因框架问题 让那些只是学习JavaScript和D3的学生困惑不已 。

找寻数据故事很不易

选修这门课的大部分学生都修过 (Alberto Cairo)的静态信息图课程,但实际上,在数据中找寻故事是不易的,这堂课并不涵盖这部分内容。我给一些在选题上比较困难的学生推荐用Excel和 Tableau来挖掘数据内容,示范。幸运的是,有一些学生已经有使用Tableau的经验了。(我用PowerBI做了简单尝试,印象深刻!)不过,他 们作品中的数据故事直到学期尾声才流露出来。众所周知,给非真实的数据做“设计”是非常困难的(如果手动画草图就只能这样),不能熟练使用探究数据工具就 会给学生们带来障碍。

而接下来这一学期的课就没有那么强的新闻性,我会扩展对作品的评分要求,对于数据驱动的故事不做强求,允许更宽泛的数据可视化。我也会用数据探索作为开端来拓展设计过程,然后在推展到界面设计的草图,之后再进入阶段性开发以及反馈的循环中。

调试代码也很艰辛

我意识到我应该教一些调试代码的知识,我也这么做了,但是我觉得只能点到为止。看着别人做这个工作非常无聊,但是这很有必要。让学生学会如何使用谷歌浏览器JavaScript控制台的断点是无可避免之灾害,因为这是一点点堆叠跟踪的过程。

调试代码里更难的步骤是你必须要很熟练地知晓哪一部分容易出错,能够猜出来这一次会是哪里出错了。在这上面会花费大量时间。这部分很难教,它需要实践练习时间。

学生们会找到并且复制你的所有错误

因为学习D3的一个自然而然的常规性做法就是找例子然后模仿修改它们来适配到你自己的数据上,我也打算这样来教授这门课。由我来做一些例子,然后学生们使用 他们的数据(最好的情况是他们刚好可以把这些联系运用到最后的作品中)。这就意味着,可能我写代码过程中的马虎、错误和一些不好的习惯就会被学生们一遍一 遍地复制开来,包括不尽如人意的界面设计,有一个例子就是有一个线条图用了不尽如人意的颜色组合被复制应用到了若干个作业当中。

而我的作业就是,修复repo中上述所有错误,努力不把它们带到更多的作品中。

鸣谢我借鉴、联系或修改过的一些内容:

如下各位的repo对这门课贡献卓著: Mike Bostock, Scott Murray, Jim Vallandingham, Nathan Yau, Mike Freeman, Ian Johnson。

课程材料:

课程所用repo(接下来的这学期我会继续改良)在这。我希望会加更多的案例,像canvas,crossfilter/dc.js,可能还会有一些其他的设计。甚至可能会有一些数据“艺术”。我会在接下来一周左右的时间把学生作品的链接和例子公布出来。

via:jdchina

End.