关键词：
摘要： D3是一个开源的JavaScript程序库。它对设计师来说很友好，因为它能让设计师使用SVG这种常见的图形格式进行创作。它对程序员来说也很合适，因为它是兼容Web标准的。下面让我们开启D3，聊聊这个在Web上实现数据可视化最牛的工具。 本文选自《图说D3：数据可视化利器从入门到进阶》。
D3，即“Data Driven Documents”（数据驱动文档）的缩写，是由才华横溢的Mike Bostock编写的一个JavaScript程序库。D3名副其实，能将数据绑定到Web文档，然后基于数据来操纵那些文档。酷吧，但是这又能做什么呢？
我们先从D3是JavaScript编程库这件事说起。D3不是像Adobe Illustrator那样需要下载下来使用的软件，也不是类似R语言那样可以通过命令行工具来分析和生成图表的开发环境，更不是像Google Charts或Tableau Public那样能让你登录一个站点、插入一些数字然后就能生成股票图形的工具。换言之，就像每个用其他语言开发的扩展包一样，D3完全就是一个开源的JavaScript扩展。D3扩充了JavaScript的能力，特别是在数据可视化方面非常有用。
如果你是一个编程新手，这个答案可能让你感到不太满意。什么是程序库？物理上这个库里面又包含了哪些东西？答案是：一堆函数和方法（非常像函数的东西）。函数和方法包含了代码的可用执行序列，可以被重用。库本质上就是一组函数的集合，函数之间被设计成可以互相协同调用。这些函数集为编程提供了一种新的方式。
D3作为一个程序库，正是一组函数或方法及其定义（具体命令的执行序列）的集合。这组函数或方法包含在具体的JavaScript文件中。只要你愿意，现在就可以对其一窥门径。访问http://d3js.org/d3.v3.js，D3现在已经是第3个版本，正如它所宣称的那样，是开源的。
应该怎么使用它呢？通过新建一个网页并引入和运行这个JavaScript文件即可。当你在浏览器里运行d3.v3.js时，浏览器会导出D3的所有函数和方法，这样你就可以在自己的代码里面直接使用这些函数和方法了。如果其他用户访问你的站点，他的浏览器一样会直接运行d3.v3.js，D3的函数同样会被导出。
这些函数非常有用。D3绝对是一个能让程序员完全改变编程方式的JavaScript程序库。
D3最大的亮点和它的名称一样——数据驱动文档。D3使数据绑定并操纵Web文档成为可能。从技术上来讲，能被浏览器访问并被其渲染的东西都可以称为Web文档，这包括任何HTML页面，但更为重要的还有SVG（可缩放矢量图形）及图片。
你以前可能用过SVG。如果你是一名设计师，那就100% 用过了。SVG是一种矢量图形格式：图形的分辨率能够根据缩放级别自我调节，所以从来不会失真。其背后的秘密就是使用了一种类似HTML的标记语言来编码这种Web图形文档。例如，< p >标签代表段落，< h1 >标签表示头部。SVG使用标签表示圆形，使用标签表示线条。
用户可以通过D3将数据植入SVG文档是D3擅长数据可视化的一个重要因素。这也意味着你可以将单个数据点和SVG图形元素（如圆形、矩形及路径等）进行连接，然后基于这些数据连接点来格式化或重定位图形元素。
为了确保说明要点，我打算再重复一遍。D3可以让你直接在SVG这种华丽的Web文档格式的图形元素上根据数据值来设置属性！使用D3，就是在使用数据直接控制浏览器所显示的内容。简而言之，这就是D3。
设计师为什么喜欢D3
如果你是一名设计师，有丰富的Adobe Illustrator或Inkscape使用经验，那么你一定会喜欢上D3，其创建、销毁和格式化SVG元素的方式是那么优雅。你肯定无数次从网上下载过SVG文件并粘贴到你的设计软件中。有了D3，你将来到SVG标签的内容深处，即使是第一次接触，也会发现其组成逻辑和命名方式似曾相识。对图形的内部着色称为“填充”，围绕边界的线条称为“笔触”。你可以将图形打包，然后统一运用渐变，剪切路径及改变对象的透明度。一旦学会其语法，其他的事情将水到渠成。
程序员为什么钟爱D3
如果你是一个程序员，你会钟爱D3，因为D3基于现有Web标准的HTML和SVG就能发挥强大的威力，根本不需要依赖任何第三方插件或专属框架。基于Web的可视化工具以前就有，如Protovis、Flare及JavaScript InfoViz工具集。所有这些工具都依赖一套自己特有的方式在页面上制图（用技术术语来讲，就是都在使用自己的场景结构）。D3与众不同，它与数据结合，提供一种直接操作Web的内置场景结构，即文档对象模型的方式。
D3也从其他JavaScript库中汲取了一些精华。例如，可以像jQuery那样进行链式方法调用。
D3的使用要点
你可以用D3来制作一些用以娱乐或赚钱的东西，而不用缴纳任何许可证费用，甚至不需要提到D3的名字。D3是完全开放的。并非所有浏览器都支持D3，这是因为并非所有浏览器都执行Web标准。被称为“现代浏览器”的Google Chrome、Mozilla Firefox、Opera、Safari和Internet Explorer 9及其以上版本都兼容D3。
任何使用D3开发的项目，如果用户能看到其外观，即表示能访问其数据。一般情况下，这种等级的数据透明度不会引起安全问题——既然你已经打算将数据可视化并公开，那么这份数据应该不用保密了吧。不过，这倒是提醒我们要时刻注意检查数据来源是否允许原始数据被散布出去。
本文选自《图说D3：数据可视化利器从入门到进阶》，点此链接可在博文视点官网查看此书。
想及时获得更多精彩文章，可在微信中搜索“博文视点”或者扫描下方二维码并关注。
本文出自 “博文视点官方博客” 博客，请务必保留此出处http://bvbroadview.blog.51cto.com/3227029/1902862
关于编程的思考
...？后做什么？遇到不同的情况，特殊的情况应该怎么做？程序员做为计算机的主人，要让计算机帮我们做事情，就要对事情有一定了解与思考，然后用编程语言写下程序，让计算机去执行程序，得到结果。比如：你爸妈只会让你... 查看详情
为什么diffusionmodels钟爱u-net结构？
...已经基本了解扩散模型的特点，细心的读者会有疑问，为什么现在绝大部分的diffusionmodels都是U-net结构呢？这个发源于医疗分割的网络结构，为何广受备受diffusionmodels这种生成式 查看详情
c/c++程序员是什么让你有如此优势？音视频开发该怎么学？
...c;各行各业都正在或即将发生翻天覆地的变化。C/C++程序员这行就更不用说了，开发技术的迭代更是日新月异。5G时代下的音视频开发回看2020，在疫情的重创之下，各个行业都苦不堪言，实体经济更是苦不堪... 查看详情
为什么diffusionmodels钟爱u-net结构？
...已经基本了解扩散模型的特点，细心的读者会有疑问，为什么现在绝大部分的diffusionmodels都是U-net结构呢？这个发源于医疗分割的网络结构，为何广受备受diffusionmodels生成式的喜爱呢？目录灵感从GANs中而来DDPM诞生之初与Unet的不... 查看详情
安云信息科技什么是设计记忆点
每个人都有这个习惯，身边的朋友更是如此，你怎么能记住身边的朋友呢？记得要记住他的一些个性特点，如幽默风趣，如喜欢吃，喜欢旅游等等；其实在做ui设计的改版上也是如此，我们需要一些设计上的记... 查看详情
是什么让测试工作如此辛苦？
大家好，我是小dao，下面来分享一篇文章《是什么让测试工作如此辛苦？》，希望此文能够让你有所收获，当然也希望能够结识一些在测试路上能够一起前行的朋友。因上周事情太多，上周的总结便偷懒了... 查看详情
钱宝事件，是什么让你们如此疯狂
刷新三观，央视，地方媒体，政府前前后后，让老百姓应该以后如何相信，多少家庭身家性命钱，相信政府，支持创新，为了优活家人有错吗?多少人是上有老下有小扛着新一代年轻人的压力，把一辈子积蓄投资合伙，为的不就... 查看详情
系统困境与软件复杂度，为什么我们的系统会如此复杂(代码片段)
简介：读APhilosophyofSoftwareDesign有感，软件设计与架构复杂度，你是战术龙卷风吗？作者|聂晓龙（率鸽）来源|阿里技术公众号读APhilosophyofSoftwareDesign有感，软件设计与架构复杂度，你是战术龙卷风吗... 查看详情
领域驱动设计，让程序员心中有码
1 从搬砖谈领域对象 有一个古老的故事，大概是这样的。作者问三个建筑工地上的工人他们在干什么？有一个没精打采的说，我在挖洞！而另一一个人却说，我在盖一座房子。还有一个人说，我在建立... 查看详情
钱宝事件，是什么让你们如此疯狂呢？
刷新三观，央视，地方媒体，政府前前后后，让老百姓应该以后如何相信，多少家庭身家性命钱，相信政府，支持创新，为了优活家人有错吗?多少人是上有老下有小扛着新一代年轻人的压力，把一辈子积蓄投资合伙，为的不就... 查看详情
猿团ytfcloud--5分钟自制app，开发从未如此简单
9月15日，YTFCloud将正式开启内测，这意味着猿团YTF框架产品线全面升级。同时，公测过后，YTFCloud的APP线上DIY服务将面向所有用户，让人人都能成为APP“开发商”。什么是YTFCloud?YTFCloud是由猿团科技推出的一款针对移动APP快... 查看详情
apmmonaco指环篇，哪一款是你钟爱的呢？
...大胆的设计理念，同时融入摇滚元素。这一系列不仅仅是设计师对于自由和巴黎的致意，更代表了现代女性对于自我的勇敢表达。虽然是以艳阳作为主设计理念，可是给人更加直观的感受不是仅仅只有艳阳，而是来自光线的明列... 查看详情
什么是app
...因为这两套系统语言代码不一样，所以开发团队会配合IOS程序员和Android程序员团队团队的设计者可能觉得界面的设计是相通的但是是往往并不是如此，一般设计人员部 查看详情
计算机基础
...么是编程？为什么要编程？ 1.编程语言：编程语言是程序员与计算机沟通的介质 2.编程：程序员基于某种编程语言的语法格式将自己脑子中的想要让计算机做的事写到文件中，所以编程的结果就是一堆文件，这一堆文件... 查看详情
什么是持续集成
...们派专人来负责管理和维护，这就是DBA。不幸的是，DBA与程序员似乎来自于不同的文化，他们讲的不是同一种语言。结果常常导致程序员基于自己对数据库的假设来开发程序，到了项目的后期才与真实数据库进行集成。这种假设... 查看详情
什么是t-sql
参考技术A简单来说：T_SQL是SQL语言（结构化查询语言）的增强版，他是一种编程语言，可以完成复杂的逻辑。如果再具体点的话：T-SQL：SQL程式设计语言的增强版，它是用来让应用程式与SQLServer沟通的主要语言。T-SQL提供标准SQL... 查看详情
译文为什么用户体验文案在产品设计中如此重要？
...经验。 用户体验文案是属于设计工作的范畴。为什么这么说？因为一份优秀的用户体验文案和一份优秀的UI设计同样重要。因此，当我谈论通常意义上所说的设计的时候，这里的设计涵指的其实是UI设计，用户体验以及... 查看详情
第十篇面向对象的程序设计
一面向对象的程序设计的由来二什么是面向对象的程序设计及为什么要有它三类和对象3.1什么是对象，什么是类3.2类相关知识3.3对象相关知识3.4对象之间的交互3.5类名称空间与对象/实例名称空间3.6小结四继承与派生4.1什么是继... 查看详情