spContent=软件开发中的数据可视化。D3，JavaScript，Python+Flask+MySQL。自编教材《数据可视化原理与实例》（京东、当当等有售）。
从数据可视化的原理、到D3.JS的原理，到学生的可视化作品，是一个逐步渐进的过程。
如果你想学前端Web开发和可视化，那么一定收获很大。
期待你们的创新创意的佳作。
软件开发中的数据可视化。D3，JavaScript，Python+Flask+MySQL。自编教材《数据可视化原理与实例》（京东、当当等有售）。
从数据可视化的原理、到D3.JS的原理，到学生的可视化作品，是一个逐步渐进的过程。
如果你想学前端Web开发和可视化，那么一定收获很大。
期待你们的创新创意的佳作。
—— 课程团队
课程概述
课程面向数据科学与大数据技术专业、计算机专业，新媒体专业和数据新闻等专业，以当前流行的数据可视化技术D3.JS为主要开发API，在阐明原理的基础上，通过实例分析，讲述软件中的数据可视化。全书分为12章，首先以直方图和二叉树为例简单回顾HTML、CSS、JS和SVG的基本语法，之后阐述了D3.JS可视化API的本质，以对比和实例展示了常用的几种布局，包括：饼图环图和南丁格尔图、力导向图、词云图、地图，最后介绍了JS数据可视化的一些外延实例，包括：交互与动画、音乐可视化、简单图像处理、网络爬虫、分词技术、Python Flask Web开发框架。特色定位：原理清楚、案例实用、兼顾周边问题、围绕软件开发讨论数据可视化。
课程大纲
Javascript可视化基础
课时目标：1-基于JavaScript的绘图原理2-SVG的直方图绘制
课时1 Javascript直方图
课时2 Javascript直方图-2
课时3 JavaScript利用SVG绘制直线
课时4 数据可视化课程内容概述PPT版视频
课时5 JavaScript的SVG绘图-直方图&二叉树&文字树PPT视频
JavaScript绘制二叉树&文字树
课时目标：1-SVG的线段绘制2-SVG的文字绘制和旋转（基于0-360度数）
课时6 SVG递归二叉树绘制
课时7 随机型SVG递归二叉树绘制
课时8 SVG文字旋转
课时9 由SVG二叉树到文字树的绘制
课时10 SVG文字树的修饰
D3基础篇-直方图与饼图类（环图饼图玫瑰图）
课时目标：1-D3.JS绘图原理2-直方图绘制（批量数据绑定；匿名函数的使用）3-饼图类绘制（布局和绘制分开；路径path；d3.arc，d3.pie）
课时11 D3直方图
课时12 D3直方图修饰
课时13 路径Path三角形与弧形绘制
课时14 基于起止角度的环图绘制
课时15 原生数据饼图环图
课时16 D3饼图类绘制概述PPT视频-饼图&环图&玫瑰图
课时17 原生数据饼图环图-添加文字
D3重力篇-力导向图可视化（帅哥键盘手）
课时18 基本力导向图
课时19 力导向图-添加节点文字
课时20 路径上的文字
课时21 基于Path的力导向图
课时22 基于Path的力导向图添加文字
D3的层次树图绘制（New!!!）
课时目标：共9种布局（大同小异）参考网站-----http://vega.github.io/vega/examples/tree-layout/http://treevis.net/http://cuc.yingshinet.com/V7/CH6/TreeMap.htm（本课程的代码网站）---------------------------------0-层次数据的分析d3.hierarchy(data)1-潮汐树图TideTree：使用d3.tree（横向、纵向）2-叶节点对齐的树图：使用d3.cluster（横向、纵向）3-极坐标的d3.tree和d3.cluster4-面积树图d3.pack，d3.treemap，d3.partition
0-层次数据的分析d3.hierarchy(data)
1-潮汐树图TideTree：使用d3.tree
2-叶节点对齐的树图：使用d3.cluster
3-极坐标的d3.tree和d3.cluster
4-面积树图d3.pack，d3.treemap，d3.partition
D3.V7等高线、密度图和动态图表（New!!!）
课时目标：等高线绘制密度图绘制类似GapMinder的动态图表http://www.gapminder.org/
1-等高线d3.contour()
2-密度图d3.contourDensity()
3-图像的灰度值等高线绘制d3.contour()
4-动态图表（时间+多维）setInterval()
音乐可视化
课时目标：对音乐和声音数据的可视化
0-音频数据的获取
var audioCtx = new (window.AudioContext || window.webkitAudioContext)()
;var analyser = audioCtx.createAnalyser(); //分析音频数据
1-音乐频谱直方图
基于Three.js的三维可视化（New!!!）
课时目标：三维可视化：场景、摄像机和渲染三维的世界我们一无所有，都需要程序来创建
0-Three.js三维可视化概述
1-场景、摄像机和渲染
2-Dat.gui.js
3-轨道控制器、光照和阴影
4-基于圆柱体的直方图绘制
Python Flask Web开发基础
课时27 Python Flask 框架概述
课时28 Python Flask 框架概述-HelloWorld代码演示
课时29 Python Flask 框架Jinja2模板
课时30 Python Flask 框架Jinja2模板-代码演示
课时31 Python Flask 框架Jinja2模板-BootStrap代码演示
Python Flask链接MySQL数据库和表单
课时32 Flask-SQLAlchemy链接数据库
课时33 Flask-SQLAlchemy链接数据库-代码演示建表
课时34 Flask-SQLAlchemy链接数据库-代码演示-增删改查操作
课时35 Flask WTForms表单操作
课时36 Flask WTForms表单操作-代码演示
课时37 Flask-SQLAlchemy链接数据库+WTForms表单
Python Flask Web开发中的数据可视化
课时38 Python Flask Web开发中的数据可视化-查询MySQL中的表
课时39 Python Flask Web开发中的数据可视化-查询MySQL代码演示
课时40 Flask 工程文件结构-Blueprint
课时41 Flask 工程文件结构-Blueprint-代码演示
词云图绘制与JSP链接MySQL数据库
课时42 来自数组数据的词云图
课时43 JSP链接MySQL数据库
课时44 JSP链接MySQL数据库将查询结果可视化为词云图
展开全部
预备知识
零基础学数据可视化。但是最后有HTML、CSS、JavaScript基础，后面的Python+Flask+MySQL需要有Python基础，没有也能学。
证书要求
为积极响应国家低碳环保政策， 2021年秋季学期开始，中国大学MOOC平台将取消纸质版的认证证书，仅提供电子版的认证证书服务，证书申请方式和流程不变。
电子版认证证书支持查询验证，可通过扫描证书上的二维码进行有效性查询，或者访问 https://www.icourse163.org/verify，通过证书编号进行查询。学生可在“个人中心-证书-查看证书”页面自行下载、打印电子版认证证书。
完成课程教学内容学习和考核，成绩达到课程考核标准的学生（每门课程的考核标准不同，详见课程内的评分标准），具备申请认证证书资格，可在证书申请开放期间（以申请页面显示的时间为准），完成在线付费申请。
认证证书申请注意事项：
1. 根据国家相关法律法规要求，认证证书申请时要求进行实名认证，请保证所提交的实名认证信息真实完整有效。
2. 完成实名认证并支付后，系统将自动生成并发送电子版认证证书。电子版认证证书生成后不支持退费。
参考资料
https://www.w3school.com.cn/
https://cuc.yingshinet.com/ 教师个人主页的代码。提交作业要加载你感兴趣的数据，即真实数据，贴图上传。不要复制粘贴代码，那样老师会伤心滴：），各位同学学习的收获也大打折扣。
浙公网安备 33010802012594号
