原文:D3.js学习笔记(二)——使用绑定在DOM上的数据

简单例子 在这个例子中,你将会使用D .js来将数据绑定到DOM元素上。然后再使用D .js利用绑定到DOM元素上的数据来更新网页。 在上一章中,我们以下面这个页面作为开始的: 然后我们又使用JavaScript控制台把数据绑定到HTML元素上: 于是,我们得到了: 到此 我们已经把数据绑定到DOM元素上了。 然而,我们真正想要的是取回我们的数据,并把它们显示在我们的初始网页示例。 换句话说,我们 ...

2014-01-11 11:18 2 3302 推荐指数:

查看详情

d3.js学习笔记

入门好文:http://www.ourd3js.com/wordpress/?p=51 d3.jsd3.min.js内容一样,后者是压缩过的,适合发行版本,前者适合开发人员。 1.选择集(满足css选择符的要求)主要和数据绑定一起使用 d3.select() d ...

Wed Jun 08 02:02:00 CST 2016 0 2540
d3.js学习笔记(五)——将数据结构化为D3.js可处理的

目标 在这一章,你将会理解如何对数据进行结构化,来更好的使用D3.js。 我们将会回顾我们之前已经学习的,学习D3.js如何使用选集(selections),JavaScript对象基础,以及如何最优的结构化数据。 到目前我们已经学到了哪些? 到目前,我们使用D3.js完成的例子都包含一个 ...

Mon Jan 13 18:54:00 CST 2014 2 3850
D3.js学习笔记(三)——创建基于数据的SVG元素

目标   在这一章,你将会使用D3.js,基于我们的数据来把SVG元素添加到网页中。这一过程包括:把数据绑定到元素上,然后在使用这些元素来可视化我们的数据。   注意:不同于前几章,我们从一个完整的代码开始,然后去一步步理解它,从这一章开始,我们将会从零开始构建我们的数据可视化 ...

Sun Jan 12 00:57:00 CST 2014 1 5654
D3.js学习笔记(四)—— 使用SVG坐标空间

目标   在这一章,你将要使用D3.js基于一些数据把SVG元素添加到你想要的坐标位置上。   我们的目标就是使用下面的数据集:   并使用D3.js来对这些数据进行可视化: 数学/图形 坐标空间(Mathematical/Graph Coordinate Space ...

Mon Jan 13 01:40:00 CST 2014 0 5091
D3.js学习(五)

上一节我们已经学习了如何设置填充区域,其实理解了他的实现原理还是非常简单了。这一节中, 我们主要学习多条曲线的绘制,以及给不同的曲线指定不同的纵坐标。 新的数据 由于我们要画两条曲线,所以我们要在原来的基础上新增一组测试数据,现在我们的数据是这样的: date close ...

Thu Oct 17 19:31:00 CST 2013 6 3121
D3.js学习(二)

上一节中我们已经画出了一个基本的图表,不过忘了给坐标轴添加标签了,所以在本节中我们要给坐标轴加上标签,目标效果如下 给X轴添加标签 很明显,标签是不是一个text内容块啊,所以我们只要在svg ...

Tue Oct 15 01:09:00 CST 2013 2 5461
D3.js学习(三)

上一节中,我们已经画出了图表,并且给图表添加了坐标轴的标签和标题,在这一节中,我们将要学习几个绘制线条不同特性的几个函数,以及给图表添加格栅。ok,进入话题! 如何给线条设置绘制的样式? 这个其实非常简单,在我们之前定义的valueline基础上加一个.interpolate(“样式”)就行 ...

Tue Oct 15 19:21:00 CST 2013 1 5189
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM