D3.js 4.0 API中文翻译
今天打开D3的项目地址https://github.com/d3/d3 ,发现描述已经变成了:
Bring data to life with SVG, Canvas and HTML
比以前多个了Canvas
,也就是说D3.js的历史进入了新纪元。这是历经早期Protovis
只支持SVG
到后来d3.v3支持HTML
操作,如今又进入了一个崭新的阶段将支持Canvas
了。d3.v4的源码也有相当大的调整,最明显的是分成了很多小模块单独开发。模块化开发果然和预想的一样是要为支持Canvas
做准备,这确实是一件让人热血澎湃的好事。D3留给我们的想象空间还很大。好吧,为了更好地拥抱新技术!本项目将通过对D3 V4官方文档的翻译对d3.v4做个全面深入的了解。本文为保持原汁原味,会采用直译,希望成为帮助大家入门d3.v4的第一手资料。
-
2016-5-20日下午五点左右,D3的star数超过50000次,位列所有前端库第二(仅次于boostrap)。自从2013年关注D3以来,几乎都超过每个月1000的增幅上涨着。虽然距离排名第一的前端库boostrap有些差距,但D3的这种发展速度和受欢迎程度相信会继续给我带来更多的惊喜。
-
翻译D3 V4的API发现与D3 V3的差别很大,功能也更多更完善,就力导向图就从原来的12个功能函数增加到现在的42个(包含二级函数),这势必会给我们做数据可视化带来更多的便利。
-
路径这部分的API主要用来将Canvas命令转换为SVG路径的d属性的值。本质上最后还是用SVG画图。这一点可能跟我们想要的直接用Canvas画大数据量数据的需求不一样,看来以后还是得手动来实现了,这一点略微还是有些失望的~
-
D3 V4的大量API由原来的二级函数升级为一级函数(实际上就是把两级的单词合并,使用驼峰命名法重命名了),这样给使用者带来了一些记忆负担,其实以前的API设计得更好用点~
下面是译文,欢迎一起翻译,探讨~
D3 (或D3.js) 是一个用来使用Web标准做数据可视化的JavaScript库。D3帮助我们使用SVG, Canvas 和 HTML技术让数据生动有趣。D3将强大的可视化,动态交互和数据驱动的DOM操作方法完美结合,让我们可以充分发挥现代浏览器的功能,自由的设计正确的可视化界面。
更多参考? 见wiki。
案例见gallery 和 作者mbostock的博客bl.ocks.
现在主分支已经包含了D3 4.0预览版。4.0的API不是固定的并且发布前可能会改变。最近的稳定版 (3.5.17), 可以按照wiki里的 安装介绍 安装使用。如果你使用NPM, 可执行npm install d3@next
命令。不然的话可以下载最新版。 发布包支持AMD, CommonJS, 和 vanilla 环境。自定义编译可以使用 Rollup 或者其他打包工具。也可以直接从d3js.org引用:
<script src="https://d3js.org/d3.v4.0.0-alpha.40.min.js"></script>
非压缩版移除上面的.min
即可。
选择元素
数据类型
格式化
加载数据
数据映射
图形几何
布局
动态交互
D3 使用 语义命名。可使用d3.version获取当前版本号。
数组操作,排序,查找,汇总等。
计算基本汇总统计的一些方法。
- d3.min - 计算数组中的最小值。
- d3.max - 计算数组中的最大值。
- d3.extent - 计算数组的范围。
- d3.sum - 数组中所有元素求和。
- d3.mean - 计算数组的算术平均值。
- d3.median - 计算数组的中位数。
- d3.quantile - 计算一个数字数组排序后的分位数。
- d3.variance - 数组中数字的方差。
- d3.deviation - 数组中数字的标准差。
将离散样本分成连续的无重叠的间隔。
- d3.histogram - 创建一个新的直方图生成器。
- histogram - 对给定的样本数组计算直方图。
- histogram.value - 为每个样本指定一个值访问器。
- histogram.domain - 指定可观测值的间隔。
- histogram.thresholds - 指定值划分成不同箱的方法。
- d3.thresholdFreedmanDiaconis - Freedman–Diaconis装箱规则。
- d3.thresholdScott - Scott’s normal reference装箱规则。
- d3.thresholdSturges - Sturges’装箱准则。
检索数组中特定的值。
- d3.scan - 使用比较器线查找。
- d3.bisect - 二分查找排序数组中的值。
- d3.bisectRight - 二分查找排序数组中的值。
- d3.bisectLeft - 二分查找排序数组中的值。
- d3.bisector - 使用访问器和比较器二分查找。
- bisector.left - 使用给定的比较器的bisectLeft。
- bisector.right - 使用给定的比较器的bisectRight。
- d3.ascending - 升序排序。
- d3.descending - 降序排序。
转换数组并返回一个新的数组。
- d3.merge - 将多个数组合并成一个。
- d3.pairs - 创建一个相邻对数组。
- d3.permute - 安装指定的索引数组重排数组。
- d3.shuffle - 数组随机排序。
- d3.ticks - 从一个数组间隔生成有代表的值。
- d3.tickStep - 从一个数组间隔生成有代表的值。
- d3.range - 生成一组数值。
- d3.transpose - 数组转置。
- d3.zip - 转置多个数组。
人类可读的刻度轴。
- d3.axisTop - 创建一个上部轴生成器。
- d3.axisRight - 创建一个右部轴生成器。
- d3.axisBottom - 创建一个底部轴生成器。
- d3.axisLeft - 创建一个左部轴生成器。
- axis - 为给定的选择生成轴。
- axis.scale - 设置比例尺。
- axis.ticks - 自定义刻度的生成和格式化方式。
- axis.tickArguments - 自定义刻度的生成和格式化方式。
- axis.tickValues - 明确地指定刻度值。
- axis.tickFormat - 明确地指定刻度格式。
- axis.tickSize - 设置刻度的大小。
- axis.tickSizeInner - 设置内刻度的大小。
- axis.tickSizeOuter - 设置外刻度的大小。
- axis.tickPadding - 设置刻度和标签之间的间距。
便捷的数据结构,元素的键是字符串类型。
将对象转为数组的方法。
- d3.keys - 列举关联数组的键。
- d3.values - 列举关联数组的值。
- d3.entries - 列举关联数组的键值对实体。
类似ES6 Map,但是键时字符类型的,并且有点其他区别。
- d3.map - 创建一个空的map。
- map.has - 返回map中是否包含某个值。
- map.get - 获取值。
- map.set - 设置值。
- map.remove - 移除值。
- map.clear - 移除所有值。
- map.keys - 获取键数组。
- map.values - 获取值数组。
- map.entries - 获取键值对数组。
- map.each - 为每个元素调用一次指定的方法。
- map.empty - 返回map是否为空。
- map.size - 计算值的数量。
类似ES6 Set,但是键时字符类型的,并且有点其他区别。
- d3.set - 创建一个空的set。
- set.has - 返回set中是否包含某个值。
- set.add - 添加指定值。
- set.remove - 删除指定值。
- set.clear - 移除所有值。
- set.values - 获取值数组。
- set.each - 为每个元素调用一次指定的方法。
- set.empty - 返回set是否为空。
- set.size - 计算值的数量。
将数据组织成任意层次。
- d3.nest - 创建一个嵌套生成器。
- nest.key - 在嵌套层级中加一级。
- nest.sortKeys - 当前层级按键排序。
- nest.sortValues - 叶子层级按值排序。
- nest.rollup -为叶子层指定汇总函数。
- nest.map - 生成一个嵌套,返回一个map。
- nest.object - 生成一个嵌套,返回一个关联数组。
- nest.entries - 生成一个嵌套,返回一个键值对数组。
颜色操作和颜空间转换。
- d3.color - 解析给定的CSS颜色名。
- color.rgb - 计算该颜色的RGB值。
- color.brighter - 该颜色的高亮副本。
- color.darker - 该颜色的较亮副本。
- color.displayable - 如果该颜色在标准硬件上可以显示则返回true。
- color.toString - 将该颜色格式化为一个十六进制 RGB值字符串。
- d3.rgb - 创建一个RGB颜色。
- d3.hsl - 创建一个HSL颜色。
- d3.lab - 创建一个Lab颜色。
- d3.hcl - 创建一个HCL颜色。
- d3.cubehelix - 创建一个Cubehelix颜色。
解析和格式分隔符分隔的值(特别是TSV和CSV)
- d3.dsvFormat - 为指定的分隔符指定一个解析器和格式化器。
- dsv.parse - 解析给定的字符串返回一组对象。
- dsv.parseRows - 解析给定的字符串返回行数组。
- dsv.format - 格式化一组对象。
- dsv.formatRows - 格式化行数组。
- d3.csvParse - 解析给定的CSV字符串,返回一组对象。
- d3.csvParseRows - 解析给定的CSV字符串,返回行数组。
- d3.csvFormat - 格式化给定的CSV对象。
- d3.csvFormatRows - 格式化给定的CSV行数组。
- d3.tsvParse -解析给定的TSV字符串,返回一组对象。
- d3.tsvParseRows - 解析给定的TSV字符串,返回行数组。
- d3.tsvFormat - 格式化给定的TSV对象。
- d3.tsvFormatRows - 格式化给定的TSV行数组。
命名回调函数。
- d3.dispatch - 创建一个定制的事件分发器。
- dispatch.on - 注册或者解除注册事件监听器。
- dispatch.copy - 创建分发器副本。
- dispatch.call - 给注册的监听器分发事件。
- dispatch.apply - 给注册的监听器分发事件。
使用鼠标或触屏拖曳SVG,HTML 或 Canvas。
- d3.drag - 创建一个拖曳行为。
- drag - 对一个选择应用拖曳行为。
- drag.container - 设置坐标系统。
- drag.filter - 忽略一些初始的事件。
- drag.subject - 设置被拖曳对象。
- drag.x - 设置被拖曳对象的x-坐标。
- drag.y - 设置被拖曳对象的y-坐标。
- drag.on - 监听拖曳事件。
- event.on - 监听当前动作的拖曳事件。
用来平滑过渡的缓动函数。
- ease - 缓动给定的标准化时间。
- d3.easeLinear - 线性缓动,就是个恒等函数。
- d3.easePolyIn - 多项式缓动,加速到指定的速率。
- d3.easePolyOut - 逆多项式缓动。
- d3.easePolyInOut - 均匀多项式缓动。
- poly.exponent - 指定多项式的指数。
- d3.easeQuad - easeQuadInOut的别名。
- d3.easeQuadIn - 平方缓动。
- d3.easeQuadOut - 逆平方缓动。
- d3.easeQuadInOut - 均匀平方缓动。
- d3.easeCubic - easeCubicInOut的别名。
- d3.easeCubicIn - 立方缓动。
- d3.easeCubicOut - 逆立方缓动。
- d3.easeCubicInOut - 均匀立方缓动。
- d3.easeSin - easeSinInOut的别名。
- d3.easeSinIn - 正弦缓动。
- d3.easeSinOut - 逆正弦缓动。
- d3.easeSinInOut - 均匀正弦缓动。
- d3.easeExp - easeExpInOut的别名。
- d3.easeExpIn - 指数缓动。
- d3.easeExpOut - 逆指数缓动。
- d3.easeExpInOut - 均匀指数缓动。
- d3.easeCircle - easeCircleInOut的别名。
- d3.easeCircleIn - 圆形缓动。
- d3.easeCircleOut - 逆圆形缓动。
- d3.easeCircleInOut - 均匀圆形缓动。
- d3.easeElastic - easeElasticOut的别名。
- d3.easeElasticIn - 弹性缓动,类似松紧带。
- d3.easeElasticOut - 逆弹性缓动。
- d3.easeElasticInOut - 均匀弹性缓动。
- elastic.amplitude - 指定弹性振幅。
- elastic.period - 指定弹性周期。
- d3.easeBack - easeBackInOut的别名。
- d3.easeBackIn - 提早缓动。
- d3.easeBackOut - 逆提早缓动。
- d3.easeBackInOut - 均匀提早缓动。
- back.overshoot - 指定超调量。
- d3.easeBounce - easeBounceOut的别名。
- d3.easeBounceIn - 弹跳缓动,类似弹跳的小球。
- d3.easeBounceOut - 逆弹跳缓动。
- d3.easeBounceInOut - 均匀弹跳缓动。
力导向图使用velocity Verlet整合算法实现。
- d3.forceSimulation - 创建一个力模拟。
- simulation.restart - 重启力模拟。
- simulation.stop - 停止力模拟。
- simulation.tick - 将力模拟向前推进一步。
- simulation.nodes - 设置力模拟的节点。
- simulation.alpha - 设置当前的
α
值。 - simulation.alphaMin -设置
α
最小阈值。 - simulation.alphaDecay - 设置
α
指数衰减率。 - simulation.alphaTarget - 设置目标
α
。 - simulation.drag - 设置曳引系数。
- simulation.force - 添加或移除力。
- simulation.fix - 固定节点位置。
- simulation.unfix - 释放固定的节点。
- simulation.find - 查找给定位置最近的节点。
- simulation.on - 添加或移除事件监听器。
- force - 应用力模拟。
- force.initialize - 使用给定的节点初始化力布局。
- d3.forceCenter - 创建一个力中心。
- center.x - 设置中心的x-坐标。
- center.y - 设置中心的y-坐标。
- d3.forceCollide - 创建一个圆碰撞力。
- collide.radius - 设置圆的半径。
- collide.strength - 设置碰撞检测强度。
- collide.iterations - 设置迭代次数。
- d3.forceLink - 创建连接力。
- link.links - 设置连接数组。
- link.id - 连接数组。
- link.distance - 设置连接距离。
- link.strength - 设置连接强度。
- link.iterations - 设置迭代次数。
- d3.forceManyBody - 创建多体力。
- manyBody.strength - 设置力强度。
- manyBody.theta - 设置Barnes-Hut近似精度。
- manyBody.distanceMin - 当节点关闭限制力。
- manyBody.distanceMax - 当节点太远限制力。
- d3.forceX - 创建x-定位力。
- x.strength - 设置力强度。
- x.x - 设置目标x-坐标。
- d3.forceY - 创建y-定位力。
- y.strength - 设置力强度。
- y.y - 设置目标y-坐标。
用来可视化层次型数据的布局算法。
- d3.hierarchy - 从层次型的数据构造一个根节点。
- node.ancestors - 生成祖先数组。
- node.descendants - 生成后代数组。
- node.leaves - 生成层级数组。
- node.path - 生成到达另一个节点的最短路径。
- node.sum - 求和。
- node.sort - 排序所有后代的兄弟节点。
- node.each - 广度优先遍历。
- node.eachAfter - 后序遍历。
- node.eachBefore - 先序遍历。
- node.copy - 拷贝层次布局。
- d3.stratify - 创建一个层操作符。
- stratify - 从表格式的数据构造一个根节点。
- stratify.id - 设置节点ID访问器。
- stratify.parentId - 设置父节点ID访问器。
- d3.cluster - 创建一个新的簇(系统树图)布局。
- cluster - 将给定的层次数据排列到簇中。
- cluster.size - 设置布局大小。
- cluster.nodeSize - 设置节点大小。
- cluster.separation - 设置层间距。
- d3.tree - 创建新的整齐的树布局。
- tree - 将给定的层次数据排列到树中。
- tree.size - 设置布局大小。
- tree.nodeSize - 设置节点大小。
- tree.separation - 设置层间距。
- d3.treemap - 创建一个新的矩形填充树布局(简称矩形树布局)。
- treemap - 使用矩形填充树布局排列给定的层次数据。
- treemap.tile - 设置铺砌方法。
- treemap.size - 设置布局大小。
- treemap.round - 设置输出坐标是否是取整的。
- treemap.padding - 设置间距。
- treemap.paddingInner - 设置兄弟节点之间的间距。
- treemap.paddingOuter - 设置父子节点之间的间距。
- treemap.paddingTop - 设置父节点顶边缘和子节点的间距。
- treemap.paddingRight - 设置父节点右边缘和子节点的间距。
- treemap.paddingBottom - 设置父节点底边缘和子节点的间距。
- treemap.paddingLeft - 设置父节点左边缘和子节点的间距。
- d3.treemapBinary - 使用平衡二叉树铺砌。
- d3.treemapDice - 水平行铺砌。
- d3.treemapSlice - 垂直列铺砌。
- d3.treemapSliceDice - 水平和垂直交替铺砌。
- d3.treemapSquarify - 正方形铺砌。
- squarify.ratio - 设置期望的矩形长宽比。
- d3.partition - 创建新的分区布局(旭日图和冰柱图)。
- partition - 使用分区布局排列给定的层次数据。
- partition.size - 设置布局大小。
- partition.round - 设置输出坐标是否是取整的。
- partition.padding - 设置间距。
- d3.pack - 创建一个新的圆形填充布局(简称包布局)。
- pack - 使用包布局排列给定的层次数据。
- pack.radius - 设置半径访问器。
- pack.size - 设置布局大小。
- pack.padding - 设置间距。
- d3.packSiblings - 包装指定的圆数组。
- d3.packEnclose - 围住指定的圆数组。
插补数字,字符串,颜色,数组,对象等。
- d3.interpolate - 插补任意值。
- d3.interpolateArray - 插补任意值的数组。
- d3.interpolateNumber - 插补数组。
- d3.interpolateObject - 插补充任意对象
- d3.interpolateRound - 插补整数。
- d3.interpolateString - 插补嵌入数字的字符串。
- d3.interpolateTransformCss - 插补2D CSS变换。
- d3.interpolateTransformSvg - 插补2D SVG变换。
- d3.interpolateZoom - 两个视图之间平移和缩放。
- d3.interpolateRgb - 插补RGB颜色。
- d3.interpolateHsl - 插补HSL颜色。
- d3.interpolateHslLong - 插补HSL颜色(长整型)。
- d3.interpolateLab - 插补Lab颜色。
- d3.interpolateHcl - 插补HCL颜色。
- d3.interpolateHclLong - 插补HCL颜色(长整型)。
- d3.interpolateCubehelix - 插补Cubehelix颜色。
- d3.interpolateCubehelixLong - 插补Cubehelix颜色(长整型)。
- interpolate.gamma - 在插值过程中使用
γ
矫正。
将数字格式化为人类可读的形式。
- d3.format - enUs.format的别名。
- d3.formatPrefix - enUs.formatPrefix的别名。
- d3.formatSpecifier - 解析数字格式说明符。
- d3.formatLocale - 定义一个自定义的本地化。
- locale.format - 创建一个数字格式。
- locale.formatPrefix - 创建一个SI-前缀数字格式化。
- d3.formatCaEs - Catalan (西班牙) 本地化。
- d3.formatCsCz - Czech (捷克) 本地化。
- d3.formatDeCh - German (瑞士) 本地化。
- d3.formatDeDe - German (德国) 本地化。
- d3.formatEnCa - English (加拿大) 本地化。
- d3.formatEnGb - English (英国) 本地化。
- d3.formatEnUs - English (美国 ) 本地化。
- d3.formatEsEs - Spanish (西班牙) 本地化。
- d3.formatFiFi - Finnish (芬兰) 本地化。
- d3.formatFrCa - French (加拿大) 本地化。
- d3.formatFrFr - French (法国) 本地化。
- d3.formatHeIl - Hebrew (以色列) 本地化。
- d3.formatHuHu - Hungarian (匈牙利) 本地化。
- d3.formatItIt - Italian (意大利) 本地化。
- d3.formatJaJp - Japanese (日本) 本地化。
- d3.formatKoKr - Korean (韩国) 本地化。
- d3.formatMkMk - Macedonian (马其顿) 本地化。
- d3.formatNlNl - Dutch (荷兰) 本地化。
- d3.formatPlPl - Polish (波兰) 本地化。
- d3.formatPtBr - Portuguese (巴西) 本地化。
- d3.formatRuRu - Russian (俄罗斯) 本地化。
- d3.formatSvSe - Swedish (瑞典) 本地化。
- d3.formatZhCn - Chinese (**) 本地化。
- d3.precisionFixed - 计算定点表示法的小数精度。
- d3.precisionPrefix - 计算SI-前缀记号法的小数精度。
- d3.precisionRound - 计算有效数字。
序列化Canvas路径命令为SVG。
- d3.path - 创建一个新的路径序列化。
- path.moveTo - 移动到给定的点。
- path.closePath - 关闭当前的子路径。
- path.lineTo - 画一条直线段。
- path.quadraticCurveTo - 画一条二次贝塞尔曲线段。
- path.bezierCurveTo - 画一条三次贝塞尔曲线段。
- path.arcTo - 画一条三次贝塞尔曲线弧。
- path.arc - 画一条三次贝塞尔曲线弧。
- path.rect - 画一个矩形。
- path.toString - 序列化为SVG路径的data属性字符串。
二维多边形的几何操作。
- d3.polygonArea - 计算给定多边形的面积。
- d3.polygonCentroid - 计算给定多边形的中心。
- d3.polygonHull - 计算给定点集的凸包。
- d3.polygonContains - 测试点是否在多边形内。
- d3.polygonLength - 计算给定多边形的周长的长度。
二维递归空间细分。
- d3.quadtree - 创建一个新的空的四叉树。
- quadtree.x - 设置x访问器。
- quadtree.y - 设置y访问器。
- quadtree.add - 添加数据到四叉树中。
- quadtree.remove - 删除四叉树中的数据。
- quadtree.copy - 创建一个四叉树的副本。
- quadtree.root - 获取四叉树的根节点。
- quadtree.data - 从四叉树检索所有数据。
- quadtree.size - 计算在四叉树中数据的数量。
- quadtree.find - 在四叉树快速找到最接近的数据。
- quadtree.visit - 选择性地访问四叉树中的节点。
- quadtree.visitAfter - 访问四叉树中的所有节点。
- quadtree.cover - 扩充四叉树覆盖一个点。
- quadtree.extent - 扩充四叉树覆盖一个范围。
使用可配置的并发性评估异步任务。
- d3.queue - 管理异步任务的并发评估。
- queue.defer - 注册一个用来评估的任务。
- queue.abort - 中止任何活动任务,取消任何挂起任务。
- queue.await - 注册一个任务结束后的回调函数。
- queue.awaitAll - 注册一个所有任务结束后的回调函数。
生成不同分布的随机数。
- d3.randomUniform - 均匀分布。
- d3.randomNormal - 正态分布。
- d3.randomLogNormal - 对数正态分布。
- d3.randomBates - 贝茨分布。
- d3.randomIrwinHall - Irwin-Hall分布。
- d3.randomExponential - 指数分布
XMLHttpRequest的简便封装。
- d3.request - 创建一个异步请求。
- request.header - 设置请求头。
- request.user - 设置用来认证身份的用户名。
- request.password - 设置用来认证身份的密码。
- request.mimeType - 设置MIME类型。
- request.timeout - 设置超时时长(以秒为单位)。
- request.responseType - 设置响应类型。
- request.response - 设置响应函数。
- request.get - 发送GET请求。
- request.post - 发送POST请求。
- request.send - 设置请求。
- request.abort - 中断请求。
- request.on - 监听请求事件。
- d3.csv - 获取CSV文件。
- d3.html - 获取HTML文件。
- d3.json - 获取JSON文件。
- d3.text - 获取文本文件。
- d3.tsv - 获取TSV文件。
- d3.xml - 获取XML文件。
映射抽象数据为可视化表示所需要的形式。
将连续的,数量的定义域映射为连续的值域上。
- continuous - 计算对应于给定的定义域的值域。
- continuous.invert - 计算对应于给定的值域的定义域。
- continuous.domain - 设置输入的定义域。
- continuous.range - 设置输出的值域。
- continuous.rangeRound - 设置取整后的值域
- continuous.clamp - 启用闭合。
- continuous.interpolate - 设置输出插值器。
- continuous.ticks - 计算定义域中有代表性的刻度值。
- continuous.tickFormat - 格式化刻度值。
- continuous.nice - 优化定义域。
- continuous.copy - 创建比例尺的副本。
- d3.scaleLinear - 创建定量线性比例尺。
- d3.scalePow - 创建定量幂比例尺。
- pow - 计算对应于给定的定义域的值域。
- pow.invert - 计算对应于给定的值域的定义域。
- pow.exponent - 设置幂指数。
- pow.domain - 设置输入的定义域。
- pow.range - 设置输出的值域。
- pow.rangeRound - 设置取整后的值域
- pow.clamp - 启用闭合。
- pow.interpolate - 设置输出插值器。
- pow.ticks - 计算定义域中有代表性的刻度值。
- pow.tickFormat - 格式化刻度值。
- pow.nice - 优化定义域。
- pow.copy - 创建比例尺的副本。
- d3.scaleSqrt - 创建一个幂比例尺,指数是0.5。
- d3.scaleLog - 创建定量对数比例尺。
- log - 计算对应于给定的定义域的值域。
- log.invert - 计算对应于给定的值域的定义域。
- log.base - 设置对数基底。
- log.domain - 设置输入的定义域。
- log.range - 设置输出的值域。
- log.rangeRound - 设置取整后的值域
- log.clamp - 启用闭合。
- log.interpolate - 设置输出插值器。
- log.ticks - 计算定义域中有代表性的刻度值。
- log.tickFormat - 格式化刻度值。
- log.nice - 优化定义域。
- log.copy - 创建比例尺的副本。
- d3.scaleIdentity - 创建定量恒等比例尺。
- d3.scaleTime - 创建时间线性比例尺。
- time - 计算对应于给定的定义域的值域。
- time.invert - 计算对应于给定的值域的定义域。
- time.domain - 设置输入的定义域。
- time.range - 设置输出的值域。
- time.rangeRound - 设置取整后的值域
- time.clamp - 启用闭合。
- time.interpolate - 设置输出插值器。
- time.ticks - 计算定义域中有代表性的刻度值。
- time.tickFormat - 格式化刻度值。
- time.nice - 优化定义域。
- time.copy - 创建比例尺的副本。
- d3.scaleUtc - 创建UTC时间的线性比例尺。
将连续的,数量的定义域映射为连续的,固定的颜色渐变。
- d3.scaleViridis - 暗到明的颜色组合。
- d3.scaleInferno - 暗到明的颜色组合。
- d3.scaleMagma - 暗到明的颜色组合。
- d3.scalePlasma - 暗到明的颜色组合。
- d3.scaleWarm - 色相环颜色组合。
- d3.scaleCool - 色相环颜色组合。
- d3.scaleRainbow - 循环的色相环颜色组合。
- d3.scaleCubehelix - 暗到明的色相环颜色组合。
将连续的数量的定义域映射为离散的值域。
- d3.scaleQuantize - 创建一个均匀的量化的线性比例尺。
- quantize - 计算对应于给定的定义域的值域。
- quantize.invertExtent - 计算对应于给定的值域的定义域。
- quantize.domain - 设置输入的定义域。
- quantize.range - 设置输出的值域。
- quantize.nice - 优化定义域。
- quantize.ticks - 计算定义域中有代表性的刻度值。
- quantize.tickFormat - 格式化刻度值。
- quantize.copy - 创建比例尺的副本。
- d3.scaleQuantile - 创建一个分位数的量化的线性比例尺。
- quantile - 计算对应于给定的定义域的值域。
- quantile.invertExtent - 计算对应于给定的值域的定义域。
- quantile.domain - 设置输入的定义域。
- quantile.range - 设置输出的值域。
- quantile.quantiles - 设置分位数的阈值。
- quantile.copy - 创建比例尺的副本。
- d3.scaleThreshold - 创建一个任意的量化的线性比例尺。
- threshold - 计算对应于给定的定义域的值域。
- threshold.invertExtent - 计算对应于给定的值域的定义域。
- threshold.domain - 设置输入的定义域。
- threshold.range - 设置输出的值域。
- threshold.copy - 创建比例尺的副本。
定义域和值域都是离散的。
- d3.scaleOrdinal - 创建一个序数比例尺。
- ordinal - 计算对应于给定的定义域的值域。
- ordinal.domain - 设置输入的定义域。
- ordinal.range - 设置输出的值域。
- ordinal.unknown - 设置未知输入域的输出值。
- ordinal.copy - 创建比例尺的副本。
- d3.scaleImplicit - 隐域的一个特殊的未知值。
- d3.scaleBand - 创建序数段比例尺。
- band - 计算对应于给定的定义域的值域。
- band.domain - 设置输入的定义域。
- band.range - 设置输出的值域。
- band.rangeRound - 设置输出的值域并取整。
- band.round - 取整。
- band.paddingInner - 段间距。
- band.paddingOuter - 外边距。
- band.padding - 设置间距(段间距和外边距)。
- band.align - 设置段对齐。
- band.bandwidth - 获取每段宽度。
- band.step - 开始相邻段之间的距离。
- band.copy - 创建比例尺的副本。
- d3.scalePoint - 创建序数点比例尺。
- point - 计算对应于给定的定义域的值域。
- point.domain - 设置输入的定义域。
- point.range - 设置输出的值域。
- point.rangeRound - 设置输出的值域并取整。
- point.round - 取整。
- point.padding - 外边距。
- point.align - 设置点对齐。
- point.bandwidth - 返回0。
- point.step - 开始相邻点之间的距离。
- point.copy - 创建比例尺的副本。
- d3.scaleCategory10 - 10种分类颜色。
- d3.scaleCategory20 - 20种分类颜色。
- d3.scaleCategory20b - 20种分类颜色。
- d3.scaleCategory20c - 20种分类颜色。
通过选择元素和加入数据来转换DOM。
- d3.selection - 选择根文档元素。
- d3.select - 从文档中选择一个元素。
- d3.selectAll - 从文档中选择多个元素。
- selection.select - 选择每个选中元素的一个后代元素。
- selection.selectAll - 选择每个选中元素的多个后代元素。
- selection.filter - 基于数据过滤元素。
- selection.merge - 合并两个选择。
- d3.matcher - 测试一个元素是否匹配选择器。
- d3.selector - 选择一个元素。
- d3.selectorAll - 选择多个元素。
- d3.window - 得到节点的所有者窗口。