D3（Data-Driven Documents 或 D3.js）是一个 JavaScript 库，用于使用 Web 标准将数据可视化。D3 帮助你使用SVG、 Canvas 和 HTML 将数据变为现实。D3 将强大的可视化和交互技术与数据驱动的DOM操作方法相结合，让你拥有现代浏览器的全部功能，并可以自由地为您的数据设计合适的可视化界面。
D3.js 正在参加 2020 年度 OSC 中国开源项目评选，请投票支持！
D3.js 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票，请投票支持！
-
概览
-
资讯
-
博客
-
问答
软件简介
代码
发表于大前端专区
2020/08/28 07:39
D3（或者叫 D3.js）6.0 稳定版已发布，距上个大版本 5.0 更新已过去两年多。 主要变化 D3 6.0 引入了部分不向后兼容的变化。 d3-array 现在使用原生集合(Map and Set)来代替对象字典，并且支持接受任何可迭代项(for-of)而不仅仅是数组。d3.group 和 d3.rollup 目前是强大的新聚合函数，它们取代了 d3.nest，并且与 d3-hierarchy 和 d3-selection 形成良好的搭配使用。此外还有很多新的数组辅助工具，比如 d3.greatest、d3.quic...
发表于大前端专区
2018/03/23 08:19
D3.js 5.0.0 发布。D3 5.0 仅引入了一些非向后兼容的更改。 D3现在使用 Promises 而不是异步回调来加载数据。承诺简化异步代码的结构，特别是在支持异步和等待的现代浏览器中。 例如加载V4 CSV文件： d3.csv("file.csv", function(error, data) { if (error) throw error; console.log(data); }); 在 v5 版本中用 promises: d3.csv("file.csv").then(function(data) { console.log(data); }); D3现在使...
发表了资讯
2016/06/29 00:00
D3.js 4.0.0 发布，更新如下： 颜色，插值器 和 秤 Colors now have opacity (rgba, hsla, etc.). New Cubehelix color space. New sequential color scales, including Viridis and cyclical Rainbow. New point and band scales replace ordinal.rangeBands and ordinal.rangePoints. New basis spline interpolators (e.g., continuous ColorBrewer schemes). 形状 和 布局 Shapes (e.g., lines, areas, arcs) can now rend...
发表了资讯
2015/12/29 00:00
D3.js 3.5.12 发布，此版本是个 bug 修复版本，修复了 scale.nice，保证与 scale.ticks 的一致性。 下载：d3.zip D3 是最流行的可视化库之一，它被很多其他的表格插件所使用。它允许绑定任意数据到DOM，然后将数据驱动转换应用到Document中。你可以使用它用一个 数组创建基本的HTML表格，或是利用它的流体过度和交互，用相似的数据创建惊人的SVG条形图。D3-js D3JS...
发表了资讯
2013/08/23 00:00
D3.js 3.3 发布了，D3 是最流行的可视化库之一，它被很多其他的表格插件所使用。它允许绑定任意数据到DOM，然后将数据驱动转换应用到Document中。你可以使用它用一个数组创建基本的HMTL表格，或是利用它的流体过度和交互，用相似的数据创建惊人的SVG条形图。 改进记录包括： Add selection.interrupt for immediately interrupting the current transition. Add brush.event for programmatic brushing, including transitions ...
发表了资讯
2012/12/22 00:00
可视化 JS 库 D3 发布了全新的版本 3.0 ，如果你正在使用 2.x 版本，可参考 Upgrading to 3.0 来升级到最新版本。 D3 包括一个强大的新地理投影系统，提供更多的投影效果插件，完整的介绍和列表请看发行说明。 D3.js 是最流行的可视化库之一，它被很多其他的表格插件所使用。它允许绑定任意数据到DOM，然后将数据驱动转换应用到Document中。你可以使用它用一个数组创建基本的HMTL表格，或是利用它的流体过度和交互，用相似的数据...
没有更多内容
加载失败，请刷新页面
发表了博客
2012/10/31 10:30
D3.js是一个基于数据的操作文档的JavaScript库，可以让你绑定任何数据到DOM，支持DIV这种图案生成，也支持SVG这种图案的生成（如果你对SVG不熟悉，请先看一下这篇文章，它介绍了SVG、VML和Canvas）。D3帮助你屏蔽了浏览器差异，做出来图案的效果可以说是炫目得一塌糊涂，可是代码却很简洁。在我第一次听人介绍D3的时候，确实被其示例震撼到了，大量的例子在这里可以找到。 这是D3以数据为核心的一个示意图，可以简单这样来解释：...
发表于大前端专区
2017/09/07 10:23
主要分享一下关于学习D3的知识库和学习资料 1、入门简单学习，适合国内的新手看的，简单易懂，上手轻松，深度学习需要另外考虑 主页：http://www.ourd3js.com/ 这是CSDN：http://edu.csdn.net/lecturer/687 http://blog.csdn.net/lzhlzz 新的网址: http://d3.decembercafe.org/ 2，进阶学习，配合前端环境，面向对象封装 直接给git地址：https://github.com/aendrew/learning-d3 https://github.com/aendrew/learning-d3-v4.gi...
2020/05/31 14:51
d3的布局，实际上是一个转换函数，将 原始数据 转换为 该布局需要的数据。 并不能直接通过布局生成图形，仍然需要自己根据数据去添加图形。 1.常用布局有12种 直方图（Histogram） 饼状图（Pie） 力导向图（Force） 弦图（Chord） 捆图（Bundle） 堆栈图（Stack） 层级图（Hierarchy） --集群图（Cluster） --打包图（Pack） --分区图（Partition） --树状图（Tree） --矩阵树图（Treemap） 这 12 个布局中，层级图（Hierarchy...
发表于大前端专区
2015/03/13 15:26
<!DOCTYPE html> <meta charset="utf-8"> <style> .brush{fill:#FF0;} .brush .extent{fill-opacity: .825;} .brush .background: {fill: red;} </style> <body> <script src="d3.v3.js"></script> <script> var x = d3.scale.linear() .domain([100, 1000])//这里使用的数值作为输入，如果用时间作为输入，可用d3.time.scale()函数 .range([0, 860]);//可刷的像素范围 var brush = d3.svg.br...
2020/05/22 15:57
1. 选择集 d3.select() //选择第一个 d3.selectAll() //选择全部 2. 绑定数据 datnum() //绑定一个数据到选择集上 data() //绑定一个数组到选择集 3. 输出数据 var body = d3.select("body"); var p = body.selectAll("p"); p.datnum(str); p.text((d,i) => console.log('数据：' + d + ' 索引: ' + i) 4. 插入元素 append() //选择集末尾插入元素 insert() //选择集前面插入元素 5. 删除元素 remove()...
2019/03/05 17:15
核心操作：https://blog.csdn.net/kriszhang/article/details/70174410 Update、Enter、Exit 简练详细说明：http://www.cnblogs.com/koto/p/5980646.html D3.nest（类似于groupby,比如想对数据进行上卷或下钻等数据立方的操作，可以瞅一下这个链接）的使用：https://blog.csdn.net/gdp12315_gu/article/details/51721988 JS的模块化说明（看懂第三方js库的入门blog）：https://my.oschina.net/chenzhiqiang/blog/129783 二分图源...
2019/08/17 14:57
本篇简单介绍d3 mouseover添加tips的实现 绘制曲线 以前几篇的d3曲线为例 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="test-svg"> </div> </body> <script src="https://d3js.org/d3.v5.js"></script> <script> window.onload = function() { // 数据 var data = [{ date: new Date(2019, 3, 24), value: 23.24 }, { date: new D...
发表于大前端专区
2015/06/11 14:33
# d3-pie-demo --- a data visualization of some data from the library, using the pie layout of the d3 library including some tips of using the pie layout ##Description: 这是一个D3实线饼状图的demo,效果图如下,数据是一个人在图书馆的借书数据,内圈把所有借过的书进行童妓,表示的是不同类别的书所占比例的大小,外圈表示按时间顺序排列下来的借书记录,按月分,灰色部分表示没有借书的时间段,其他颜色表示各个类别的书 ...
没有更多内容
加载失败，请刷新页面
发表了问答
2015/05/26 09:34
公司最近成立数据可视化专项(d3.js方向);让数据演绎更精彩的世界，欢迎各位前端大牛的加入。 此项目部分版式可开源,可共享; 你的付出会更有意义！ 联系邮箱 comger@163.com
2014/10/30 13:31
现在大数据可视化与原来的报表有什么不同？ 是否就是把那些chart之类的图的东西又搬到大数据的概念里？ 有专门的公司专攻大数据可视化吗？
发表于大前端专区
2019/09/04 14:46
有没有针对D3.JS的开发工具，或者针对D3的代码提示
发表于大前端专区
2019/04/25 11:34
数据未核实，只是样式，版本d3.V.3.5；每一帧的动画，是鼠标放置某处的状态。 数据格式：JSON 主要应用交互关系方面的大数据 备注：这不是UI设计出来，而是d3.v.3.5进行逆向思维编程而实现出来。 博客：https://my.oschina.net/niuzaibeijing/blog/3042231
发表了问答
2016/12/25 18:34
从后台返回的这种格式的数据 {"nodes":[{"name":"\u6b66\u6c49\u94a2\u94c1(\u96c6\u56e2)\u516c\u53f8"},{"name":"\u94f6\u534e\u57fa\u91d1-\u519c\u4e1a\u94f6\u884c"},{"name":"\u4e2d\u6b27\u57fa\u91d1-\u519c\u4e1a\u94f6\u884c"}] "links":[{"source":1,"target":0},{"source":2,"target":1},{"source":3,"target":1}]} 如何将其转化为以下两条数据 var nodes = [{ name: "桂林" }, { name: "广州"},{ name: "厦门"} ];...
发表了问答
2016/12/04 18:48
在一个点不是很多的力导向图中，如何调整节点密度？就是说，全部节点之间的距离都显得长一些。
发表了问答
2016/11/08 13:06
知道a和b的坐标，圆的半径。 如何算c点的坐标
发表了问答
2016/10/25 13:31
svg画布无法加载到地图图层上去，不知道是不是投影方式和坐标系建立不正确导致的
发表了问答
2013/11/08 10:14
运用d3.js绘制中国地图，可是总是读取了china.json数据的最后一个城市进行绘制，不知道是哪里出了问题，麻烦会的同志们给点提示，我的代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>China</title> <script type="text/javascript" src="http://d3js.org/d3.v3.js"></script> <script type="text/javascript" src="http://d3js.org/queue.v1.min.js"></script> <script type="text/javasc...
发表了问答
2016/01/19 18:08
2015/12/24 21:51
想绘制一个3D效果的饼状图，不知道d3.js能绘制吗？？或者能绘制 椭圆形的饼状图也可以，求指导
2014/09/09 10:39
d3画力学图，有时节点较少，力学图在展示时可能出现在边框以外（限制了拖动功能），怎么怎么把图限制在边框内。
发表了问答
2014/08/13 23:13
文件路径为：http://www.sencha.com/forum/remote_topics/index.php d3.js如何加载这个url下面的文件呢？ d3.csv(url, function(error, data){});貌似不行，难道只能将数据保存为。csv文件才行？
2014/05/22 19:22
我想用d3.js实现一个节点树，但数据是通过连接mysql得到的，官网上是处理的json文件，在不使用json文件的情况下，怎么实现这种效果http://mbostock.github.io/d3/talk/20111018/tree.html
2013/03/12 17:16
@钛元素 你好，想跟你请教个问题： 最近了解D3，从官网上下载了ZIP，里面基本上没有html，只有一堆js，这样的例子如何看啊？
发表了问答
2013/01/17 10:20
@彭博 你好，想跟你请教个问题：d3.js的样例库很不错啊，怎么调用，如何使用，样例里面的源码在哪里啊，不知道在哪里下载啊？官网找了很久
没有更多内容
加载失败，请刷新页面
软件作者
深圳市奥思网络科技有限公司版权所有
粤ICP备12009483号
评论 (7)