本教程共包含 6 个视频,目的是为了帮助初学者快速入门,以便阅读本站其他文章。

本教程的名称为“飞速入门”,是为初学者准备的,其中包括了 D3 开发中最基础的知识。对 D3 掌握得较好的朋友不必观看本教程。本系列的具体内容如下,点击标题即可进入百度云页面观看。如果百度云网盘的在线播放中出现清晰度不足的情况,请下载后再观看。

1. 第一个D3程序

D3的简介和安装、服务器软件的安装、初学者应注意的问题、一个简单的D3程序。

源代码:src.zip

2. 制作柱形图

选择集、数据绑定、柱形图。源代码:src.zip

3. 为柱形图添加坐标轴

比例尺、坐标轴、完整的柱形图。

源代码:src.zip

4. 用生成器制作折线图

读取文件、线段生成器、折线图。

源代码:src.zip

5. 有动态效果的散点图

过渡效果、散点图、数据更新时的操作。

源代码:src.zip

6. 布局的简单应用

饼状图布局。

源代码:src.zip

结束语

谢谢各位朋友观看本视频教程,如对视频内容存有疑问请在下方留言。

文档信息

【 D3.js 视频系列 】 飞速入门的更多相关文章

  1. 【 D3.js 进阶系列 】 进阶总结

    进阶系列的文章从去年10月开始写的,晃眼又是4个多月了,想在年前总结一下. 首先恭祝大家新年快乐.今年是羊年吧.前段时间和朋友聊天,聊到十二生肖里为什么没猫,我张口就道:不是因为十二生肖开会的时候猫迟 ...

  2. 【 D3.js 进阶系列 — 4.0 】 绘制箭头

    转自:http://www.ourd3js.com/wordpress/?p=660 [ D3.js 进阶系列 — 4.0 ] 绘制箭头 发表于2014/12/08 在 SVG 绘制区域中作图,在绘制 ...

  3. D3.js的v5版本入门教程(第十三章)—— 饼状图

    D3.js的v5版本入门教程(第十三章) 这一章我们来绘制一个简单的饼状图,我们只绘制构成饼状图基本的元素——扇形.文字,从这一章开始,内容可能有点难理解,因为每一章都会引入比较多的难理解知识点,在这 ...

  4. D3.js的v5版本入门教程(第十二章)—— D3.js中各种精美的图形

    D3.js的v5版本入门教程(第十二章) D3中提供了各种制作常见图形的函数,在d3的v3版本中叫布局,通过d3.layout.xxx,来新建,但是到了v5,新建一个d3中基本的图形的方式变了(我也并 ...

  5. D3.js的v5版本入门教程(第十一章)——交互式操作

    D3.js的v5版本入门教程(第十一章) 与图形进行交互操作是很重要的!所谓的交互操作也就是为图形元素添加监听事件,比如说当你鼠标放在某个图形元素上面的时候,就会显示相应的文字,而当鼠标移开后,文字就 ...

  6. D3.js的v5版本入门教程(第九章)——完整的柱状图

    D3.js的v5版本入门教程(第九章) 一个完整的柱状图应该包括的元素有——矩形.文字.坐标轴,现在,我们就来一一绘制它们,这章是前面几章的综合,这一章只有少量新的知识点,它们是 d3.scaleBa ...

  7. D3.js的v5版本入门教程(第八章)—— 坐标轴

    D3.js的v5版本入门教程(第八章) D3中没有现成的坐标轴图形,需要我们自己用其他组件拼凑而成.D3中提供了坐标轴组件,使得我们在SVG中绘制一个坐标轴变得像添加一个普通元素那样简单 为了表绘制一 ...

  8. D3.js的v5版本入门教程(第七章)—— 比例尺的使用

    D3.js的v5版本入门教程(第七章) 比例尺在D3.js中是一个很重要的东西,我们可以这样理解d3.js中的比例尺——一种映射关系,从domain映射到range域(为什么会是domain和rang ...

  9. D3.js的v5版本入门教程(第五章)—— 选择、插入、删除元素

    D3.js的v5版本入门教程(第五章) 1.选择元素 现在我们已经知道,d3.js中选择元素的函数有select()和selectAll(),下面来详细讲解一下 假设我们的<body>中有 ...

随机推荐

  1. SVN--从本地检出项目至服务器报错--禁止访问

    错误描述: 原因:这是访问权限限制引起的. 查看/svn/test目录的权限--之前我修改过的 现在添加一个user就好了--这个添加的developer是我之前导入本地项目时已经验证过的,所以再导入 ...

  2. java 使用 comet4j 主动向客户端推送信息 简单例子

    [背景] 今天,一个前端的师弟问我怎样做实时聊天窗口,我毫不犹豫地说:在前台定时访问服务端呀!师弟默默地百度了一番,最后告诉我,有一种技术是后服务端动推送信息给客户端的,这种技术的名字叫comet,我 ...

  3. 【BZOJ】【1927】【SDOI2010】星际竞速

    网络流/费用流 比较简单的一题,对于每个星球,将它拆成两个点,然后二分图建模:左部结点与S相连,流量为1费用为0:右部结点与T相连,流量为1费用为0:对于每条航道x->y,连边x->y+n ...

  4. powerdesigner使用之——从“概念模型”到“物理模型”

    现实问题在计算机上的解决,需要我们从现实问题中抽象出实体模型,然后再将实体模型对应到数据库关系表中. 例如,我们在思考学生选课,这件事情上,实体模型就是“学生”和“课程”两个 此时,我们使用power ...

  5. LoadAssetAtPath 与 Load 的区别

    一.官方的文档 Resources.LoadAssetAtPath Returns a resource at an asset path (Editor Only). This function a ...

  6. 使用shell脚本获取虚拟机中cpu使用率(读/proc/statc)

    #!/bin/bash interval= cpu_num=`-] -c` start_idle=() start_total=() cpu_rate=() cpu_rate_file=./`host ...

  7. Java垃圾收集器

    概述 说起垃圾收集(Garbage Collection,GC),大部分人都把这项技术当做Java语言的伴生产物.事实上,GC的历史远远比Java久远,1960年诞生于MIT的Lisp是第一门真正使用 ...

  8. HDU 2473 Junk-Mail Filter(并查集+删点,设立虚父节点/找个代理)

    题意:有N封邮件, 然后又两种操作,如果是M X Y , 表示X和Y是相同的邮件.如果是S X,那么表示对X的判断是错误的,X是不属于X当前所在的那个集合,要把X分离出来,让X变成单独的一个.最后问集 ...

  9. hdu 1271 整数对

    看了别人的解题报告a了, 大致思路就是 A=a+b*10^k+c*10^(k+1) B=a+c*10^k (在A中取出一位数后) N=A+B=2*a+b*10^k+11*c*10^k 这样就好做了,再 ...

  10. Biba模型简介

    上周上信息安全的课,老师留了个Biba模型的作业.自己看书了解了一下,记录如下. 参考资料:石文昌<信息系统安全概论第2版> ISBN:978-7-121-22143-9 Biba模型是毕 ...