家是我的个人博客: http://www.ourd3js.com/  ,csdn博客首页为:http://blog.csdn.net/lzhlzz/。转载请注明出处,谢谢。

D3的全称是(Data-Driven Documents),顾名思义能够知道是一个关于数据驱动的文档的javascript类库。假设你不知道什么是javascript。请先学习javascript的相关知识。

说得简单一点,D3.js主要是用于操作数据的,它通过使用HTML、SVG、CSS来给你的数据注入生命,即转换为各种简单易懂的绚丽的图形。

先看一个简单的样例。

如今有一组数据。 【  4 , 32 , 15 。 16 , 42 , 25   】 。如今我希望让人一眼就看出他们的大小关系,怎么办?当然这里的数据不算多。有那眼疾手快的家伙站出来说我能一眼看出来!

但更直观的是用图形显示。例如以下图:

通过图形的显示,能非常清楚地知道他们的大小关系。当然,D3能力远不止如此,这仅仅是一个非常小的应用。通过D3的使用,你能把枯燥乏味复杂的数据,用非常easy明了的形式显示出来,这也叫数据可视化。 



    学习D3.js最好的地方是: http://d3js.org/  ,当然里面都是英文的。

以下说一下怎么使用安装使用D3.js,方法有两种: 

    1.下载D3.js的文件

解压后。在html,jsp之类的文件里包括相关的js文件就可以 

     

    2.还能够直接包括网络的链接。这样的方法较简单

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

但使用的时候要保持网络连接有效。不能再断网的情况下使用。

行,你可以开始D3游。

版权声明:本文博主原创文章。博客,未经同意不得转载。

【 D3.js 入门系列 --- 0 】 简介及安装的更多相关文章

  1. 【 D3.js 入门系列 --- 0 】 简介和安装

    D3的全称是(Data-Driven Documents),顾名思义可以知道是一个关于数据驱动的文档的javascript类库.如果你不知道什么是javascript,请先学习javascript的相 ...

  2. 【 D3.js 入门系列 — 11 】 入门总结

    D3 新专题首页 一转眼,这个入门系列已经积累了二十二篇文章之多,我想作为 D3.js 这款数据可视化工具的入门来说已经足够了.相信仅仅要看完本系列.以后全然能够在辅以查询的情况下完毕大部分可视化工作 ...

  3. 【 D3.js 入门系列 — 1 】 第一个程序 HelloWorld

    记得以前刚上大一学 C 语言的时候,写的第一个程序就是在控制台上输出 HelloWorld .当时很纳闷,为什么要输出这个.老师解释说所有学编程入门的第一个程序都是在屏幕上输出 HelloWorld, ...

  4. 【 D3.js 入门系列 --- 5.1 】 做一个带坐标轴和标签的图表

    前面几节讲解了图标.坐标轴.比例等等,这一节整合这些内容做一个实用的图表.结果图如下: 代码如下所示: <html> <head> <meta charset=" ...

  5. 【 D3.js 入门系列 --- 5 】 如何添加坐标轴

    第3节中做了一个图标,但没有为它添加一个相应的坐标轴,这样不知道每一个柱形到底有多长.这一节做一个坐标轴. D3中的坐标轴都是以 svg 图的形式出现的,这也是为什么在第3节中要使用 svg 的方法做 ...

  6. 【 D3.js 入门系列 --- 3 】 做一个简单的图表!

    前面说了几节,都是对文字进行处理,这一节中将用 D3.js 做一个简单的柱形图. 做柱形图有很多种方法,比如用 HTML 的 div 标签,或用 svg . 推荐用 SVG 来做各种图形.SVG 意为 ...

  7. 【 D3.js 入门系列 --- 1 】 第一个程序HelloWorld

    下面开始用D3.js处理第一个简单问题,先看下面的代码: <html> <head> <meta charset="utf-8"> <ti ...

  8. 【 D3.js 入门系列 — 3 】 做一个简单的图表!

    图1. 柱形图 1. 柱形图 前几章的例子,都是对文字进行处理.本章中将用 D3 做一个简单的柱形图.制作柱形图有很多种方法,比如用 HTML 的 <div> 标签,或在 SVG 上绘制 ...

  9. 【 D3.js 入门系列 --- 5 】 怎样加入坐标轴

    本人的个人博客为: www.ourd3js.com csdn博客为: blog.csdn.net/lzhlzz 转载请注明出处.谢谢.      第3节中做了一个图标.但没有为它加入一个对应的坐标轴. ...

随机推荐

  1. 就目前市面上的面试整理来说,最全的BAT大厂面试题整理在这

    原标题:就目前市面上的面试整理来说,最全的BAT大厂面试题整理在这 又到了面试求职高峰期,最近有很多网友都在求大厂面试题.正好我之前电脑里面有这方面的整理,于是就发上来分享给大家. 这些题目是网友去百 ...

  2. Android内存优化杂谈

    Android内存优化是我们性能优化工作中比较重要的一环,这里其实主要包括两方面的工作: 优化RAM,即降低运行时内存.这里的目的是防止程序发生OOM异常,以及降低程序由于内存过大被LMK机制杀死的概 ...

  3. POJ 1384 Piggy-Bank (ZOJ 2014 Piggy-Bank) 完全背包

    POJ :http://poj.org/problem?id=1384 ZOJ:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode ...

  4. Nutch的日志系统 分类: H3_NUTCH 2015-02-17 20:14 261人阅读 评论(0) 收藏

    一.Nutch日志实现方式 1.Nutch使用slf4j作为日志接口,使用log4j作为具体实现.关于二者的基础,请参考 http://blog.csdn.net/jediael_lu/article ...

  5. php替换空格(php函数的设计思路)

    php替换空格(php函数的设计思路) 一.总结 1.替换和也是先查找了再替换,截取的话就是先查找到再截取 2.设计函数的时候按照的是缺省参数在后,核心东西在前的思路来设计函数的:查找的话是$sear ...

  6. Linux下多线程查看工具(pstree、ps、pstack),linux命令之-pstree使用说明, linux 查看线程状态。 不指定

    0.最常用 pstree:[root@iZ25dcp92ckZ temp]# pstree -a|grep multe  |       |   `-multepoolser  |       |   ...

  7. x265探索与研究(四):怎样编码视频?

    怎样编码视频?           本文介绍x265中的两种编码视频方法,一是採用命令行的方法.二是GUI的方式.   1.命令行的方法   (1).第一种方式生成*.265格式的视频文件       ...

  8. Windows7-32位系统下R语言链接mySQL数据库步骤

    安装R和MySQL在此就不再多说了.网上有非常多教程能够找到.以下直接进入到odbc的安装流程. 1.下载安装mysql-connector-odbc-5.x.x-win32.msi 下载地址:htt ...

  9. LinearLayout的一些注意事项 分类: H1_ANDROID 2013-10-26 23:01 856人阅读 评论(0) 收藏

    1.orientation的默认值为horizontal,即从左向右排列.由于一般从上向下排列,所以必须指定orientation属性. 2.layout_gravity与gravity的区别: (1 ...

  10. mycat主从读写分离范例

    1.mycat二进制包安装 tar -zxvf Mycat-server-1.6.5-release-20180122220033-linux.tar.gzcd mycatmv mycat /opt/ ...