
D3 数据可视化 - 入门系列
文章平均质量分 76
D3 是当前流行的数据可视化开发工具。本专栏从零开始,提供 D3 的入门教程。
DecemberCafe
这个作者很懒,什么都没留下…
展开
-
【 D3.js 入门系列 — 11 】 入门总结
前面各章节加起来,文章总数已有22篇,对于D3.js的入门来说已经足够了,特此总结。原创 2014-09-17 13:43:07 · 55767 阅读 · 11 评论 -
【 D3.js 入门系列 — 10.3 】 GeoJSON 和 TopoJSON 文件有什么不同?
GeoJSON 文件和 TopoJSON 文件都是描述地理信息的文件,它们有什么区别和联系呢?原创 2014-09-12 09:58:53 · 14778 阅读 · 1 评论 -
【 D3.js 入门系列 --- 10.2 】 可拖动的地图
本文是结合地图和力学图制作的一个可拖动的地图。用户可以自由的用手拖动中国的各省。原创 2014-09-03 10:35:43 · 14596 阅读 · 11 评论 -
【 D3.js 入门系列 --- 10.1 】 简化 GeoJSON 文件
GeoJSON 文件有时候太大,读取颇费时间,通常我们并不需要那么精确,因此简化文件的大小很重要。原创 2014-08-30 12:05:15 · 10984 阅读 · 1 评论 -
【 D3.js 入门系列 --- 10 】 地图的绘制
本节学习用 D3 制作地图的方法。需要用到 GeoJSON 文件,这个文件的获取比较困难,我花了一些时间制作好了,希望能与大家分享。本文使用中国地图的数据进行绘制。原创 2014-08-21 20:33:08 · 32461 阅读 · 19 评论 -
【 D3.js 入门系列 --- 9.6 】 打包图的制作
本节介绍打包图( pack )的制作过程,和前面几节一样,使用 D3 提供 layout 来转换数据,并进行绘制。原创 2014-08-20 22:04:31 · 7407 阅读 · 3 评论 -
绽放数据可视化之美
大数据时代的意义在哪?本文搜集了几个应用了数据可视化技术的经典网站,其图形绚丽无比,赏心悦目,即便不知道它是什么也是非看不可。原创 2014-08-18 12:10:45 · 13121 阅读 · 2 评论 -
【 D3.js 入门系列 --- 9.5 】 树状图的制作
这一节学习树状图的制作。树状图的制作和集群图完全相同,经过这两种 layout 转换后的数据也很相似。原创 2014-08-14 17:46:35 · 27610 阅读 · 7 评论 -
【 D3.js 入门系列 --- 9.4 】 集群图的制作
这一节学习用 D3 绘制集群图( Cluster )。初始数据保存于 JSON 文件中,我们使用 D3 读取文件,用 Layout 转换成适合于集群图的数据,再进行绘制。原创 2014-08-05 13:48:55 · 14865 阅读 · 9 评论 -
数据可视化是什么
数据可视化( Data Visualization )起源于18世纪,William Playfair 在他出版的书籍《 The Commercial and Political Atlas 》中第一次使用了柱形图和折线图。当时是为了表示国家的进出口量,在今天依然这么使用。19世纪初,他出版了《 Statistical Breviary 》一书,里面第一次使用了饼状图。这三种都是至今最常用的最著名原创 2014-07-31 10:45:34 · 8501 阅读 · 1 评论 -
【 D3.js 入门系列 --- 9.3 】 弦图的制作
本节介绍在 D3 中如何使用 layout 转换数据再绘制弦图,弦图用于表示两个节点之间的联系。原创 2014-07-30 15:04:21 · 11716 阅读 · 1 评论 -
【 D3.js 入门系列 --- 9.2 】 力学图的制作
本节介绍在 D3 中如何制作力学图,我们用 Layout 将普通数据转换成作图需要的数据。原创 2014-07-23 12:54:27 · 10497 阅读 · 1 评论 -
【 D3.js 入门系列 --- 9.1 】 饼状图的制作
本章介绍如何用 D3 做一个饼状图。初始数据是几个整数,用 Layout 将这几个整数转换成饼状图使用的数据。原创 2014-07-22 10:56:17 · 19624 阅读 · 10 评论 -
【 D3.js 入门系列 --- 9 】 常见可视化图形
Layout 是 D3 中 “制作常见图形的函数”,用 Layout 可以轻松地对输入数据进行转换,使得它能容易地适应可视化图形使用的需要。原创 2014-07-13 10:39:05 · 14284 阅读 · 1 评论 -
【 D3.js 入门系列 --- 8 】 对话操作(事件)
这一节介绍如何进行对话的操作,如鼠标单击,鼠标滑过等。原创 2014-07-10 13:38:46 · 15550 阅读 · 4 评论 -
【 D3.js 入门系列 --- 7 】 理解 update, enter, exit 的使用
当被选择元素和数据数量不一致时该如何处理呢,这一节将涉及 update, enter, exit 的使用。原创 2014-07-04 14:06:58 · 22716 阅读 · 2 评论 -
【 D3.js 入门系列 --- 6 】 如何让图表动起来
这一节学习让图表动起来,前面几节的图表都是静态的,不能体现D3的优势。原创 2014-06-30 10:13:40 · 13893 阅读 · 6 评论 -
【 D3.js 入门系列 --- 5.1 】 做一个带坐标轴和标签的图表
前面几节讲解了图标、坐标轴、比例等等,这一节整合这些内容做一个实用的图表。原创 2014-06-25 13:36:15 · 19665 阅读 · 2 评论 -
【 D3.js 入门系列 --- 5 】 如何添加坐标轴
这一节将讲解如何做一个坐标轴,如何定义坐标轴的样式,如何调用坐标轴原创 2014-06-24 10:19:24 · 25614 阅读 · 2 评论 -
【 D3.js 入门系列 --- 4 】 如何使用scale(比例)
在上一节中使用了一个很重要的概念 — scale (这个不知道翻译成什么,暂且叫它比例)。本节将重点介绍它的相关使用方法。原创 2014-06-20 15:13:00 · 23594 阅读 · 4 评论 -
【 D3.js 入门系列 --- 3 】 做一个简单的图表!
本节介绍如何使用D3.js制作棒状图。通过在SVG中添加元素的方法进行绘制。原创 2014-06-20 07:53:41 · 9949 阅读 · 3 评论 -
【 D3.js 入门系列 --- 2.1 】 关于如何选择,插入,删除元素
本章介绍在D3.js中关于如何选择,插入和删除元素。原创 2014-06-09 09:43:17 · 13123 阅读 · 2 评论 -
【 D3.js 入门系列 --- 2 】 如何使用数据和选择元素
本章介绍如何使用数据,和选择元素。原创 2014-05-29 14:31:36 · 9929 阅读 · 0 评论 -
【 D3.js 入门系列 --- 1 】 第一个程序HelloWorld
下面开始用D3.js处理第一个简单问题,先看下面的代码: HelloWorld Hello World 1 Hello World 2 如果你学习过HTML,应该知道会在屏幕中输出两行文字,如下图: 如果想用原创 2014-05-27 13:59:38 · 10965 阅读 · 0 评论 -
【 D3.js 入门系列 --- 0 】 简介和安装
D3的全称是(Data-Driven Documents),顾名思义可以知道是一个关于数据驱动的文档的javascript类库。如果你不知道什么是javascript,请先学习javascript的相关知识。 说得简单一点,D3.js主要是用于操作数据的,它通过使用HTML、SVG、CSS来给你的数据注入生命,即转换为各种简单易懂的绚丽的图形。原创 2014-05-27 12:34:14 · 12781 阅读 · 2 评论