D3.js v3 到 v4 刷机改动

2023-11-23

我希望从 d3v3 迁移到 d3v4。 特别是我在迁移画笔时遇到困难。

有人可以查看下面的链接并让我知道更改吗?http://bl.ocks.org/zanarmstrong/ddff7cd0b1220bc68a58

我发现了一些变化:

d3.time.format -> d3.timeFormat

d3.time.scale -> d3.scaleTime

迁移中面临的问题:

d3.svg.brush -> d3.brushX

感谢和问候,

Naishav


迁移快速指南d3-brush从 D3 v3 到 D3 v4(以 BrushX 为例)

  1. Replace d3.svg.brush() with d3.brushX().
  2. Rename brushstart事件至start, brushend to end.
  3. 不要将规模传递给.x(xScale),现在缺少这个方法。将画笔边框传递为.extent([[xScale.range()[0], 0], [xScale.range()[1], brushHeight]]).
  4. 在事件处理程序中,您可以选择如下d3.event.selection,为了获取选定的值,请使用d3.event.selection.map(xScale.invert).
  5. 要设置选择,请执行以下操作:.move(brushContainer, selectedDomain.map(xScale))。要清除选择,请执行以下操作.move(brushContainer, null)。请注意,这将触发事件处理程序。
  6. .empty()现在缺少方法,请使用d3.event.selection === null.
  7. 更新你的CSS,.extent is now .selection, .resize is .handle并成为一个rect代替g含有rect.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

D3.js v3 到 v4 刷机改动 的相关文章

  • Angular svg 或 canvas 使用颜色渐变

    我正在使用 Angular 和 d3 创建一个甜甜圈 在指令中 我可以非常简单地给填充区域指定颜色 在这个 plunker 中它是蓝色 但我想做的是让 SVG 平滑地改变其颜色 0 33 3 red 33 4 66 66 orange 66
  • d3.js:是否可以通过键而不是索引来进行转换?

    我有不同长度的数据数组 x值 年 是有限年数的一部分 例如 var data Year 2008 Value 5 Year 2009 Value 6 or var data Year 2007 Value 8 Year 2009 Value
  • NVD3 - 更新数据时不均匀的刻度

    当我更新现有 NVD3 图表中的数据时 沿 x 轴的刻度不以固定间隔呈现 我正在创建一个multiBarChart数据来源于d3 json 数据表示某个日期范围内的点击次数 我有一个单独的日期范围选择器 可以更新图表的数据 我有以下内容来创
  • 数据与线的日期和时间转换

    我使用 D3 V5 创建了此图表 另外 我已在小提琴上附加了示例数据 您可以点击此处查看 https plnkr co edit pINxcS9yt9AuJmSk02Fs p preview 我已经包括了tick函数代码块 它在向左滑动的路
  • 使用不同颜色的 dc.js 显示原始(有条件)拉丝未拉丝交叉过滤器条

    假设我们有以下 crossfilter dc js 应用程序 虽然这很好 但用户在刷牙时会失去对人群的 参考 我想要图表x y z and a在刷其他图表时保留 基础 柱 也许是不同的颜色 如下所示 我相信这可能需要更新dc renderA
  • 寻找一种重构 D3.js 风格的方法链接模式的方法

    在学习 D3 js 时 我遇到了博客文章 http bost ocks org mike chart 解释其可重用代码单元背后的主要设计模式 我复制了下面的相关代码 下面呈现的模式的方式正是在 D3 代码库和插件中使用的方式 example
  • d3.js V4 按钮缩放实现表现得很奇怪

    我正在尝试实现 d3 平移和缩放功能 默认的平移和缩放工作正常 但要求是我们还需要放大和缩小按钮 我还实现了缩放按钮 它也有效 奇怪的是 当我第一次移动图像并单击缩放按钮时 图像会移回到以前的位置 不仅是当我第一次用鼠标缩放并使用按钮再次开
  • 如何在 d3.scale.ordinal() 中指定域?

    var W 100 var H 200 var data v 4 v 8 v 15 v 16 v 23 v 42 var x d3 scale linear domain 0 max x range 0 W var y d3 scale o
  • NVD3/D3改变y轴最小值

    我目前正在使用 NVD3 制作一些折线图 我想知道是否可以使 y 轴刻度始终从 0 开始 目前它始终从最低的 y 值开始 我尝试过使用tickValues 但我不想更改其他值 我还尝试添加值为 0 的数据点 但这似乎是一种解决方法 它会影响
  • d3 地理投影从正交到 X 的过渡

    我正在开发一个教育地图项目 其中显示不同的地图投影 我想在选择不同投影之间实现变形过渡 我找到了一个很好的例子来实现它 并且我没有遇到太多的麻烦来重新创建它 不幸的是 我还需要裁剪投影的功能 这与目标状态完美配合 但在改变投影时则不然 当选
  • 如何使用 d3.v4 中的 JSON 数据创建树布局 - 不使用 stratify()

    我正在尝试将一些 d3 代码从 v3 更新到版本 4 我有一个使用 JSON 数据的树形图 d3 v4 示例展示了如何使用 stratify 将表格数据 例如flare csv 转换为分层数据https bl ocks org mbosto
  • D3:如何在Groups of Force布局节点上绘制多个凸包?

    我试图在力布局中的所有组上绘制凸包 但我只画出了一半的凸包 当 D3 尝试绘制其余的船体时 控制台返回错误 元素尚未创建 然而 当我检查控制台中的 groups 变量时 所有组数据都在那里 x y 数据都设置得很好 见下图 我什至尝试在ti
  • 使用 D3.js 解析时间序列数据

    是时候寻求帮助了 我已经学习 D3 js 几个星期了 我才开始觉得我理解了其中的 10 哈哈哈 我正在尝试生成一个非常简单的线图 只要数据非常简单 我就可以做到这一点 但我的原始数据源具有 UTC 时间戳和实数 小数 这会导致任何超出简单范
  • 将元素添加到 D3 圆包节点

    我正在尝试制作一个可缩放的圆形包装图 我希望每个子圆圈包含一个较小的图表 该图表始终具有相同的结构 即 4 列 只有条形的高度会改变 我尝试添加一个简单的rect到目前为止我的图表 但矩形没有添加到圆圈中并且是静态的 JS var marg
  • D3 旭日弧尺寸

    我正在尝试根据以下示例创建 D3 旭日图 https bl ocks org maybelinot 5552606564ef37b5de7e47ed2b7dc099 https bl ocks org maybelinot 55526065
  • 元素不适应 Firefox 上的

    使用 ES6 ish D3js 模块运行 Angular 6 应用程序会导致 Firefox 出现问题 Chromium Chrome Safari 和 IE Edge 工作正常 伪代码看起来类似于 生产代码可以在下面找到
  • 需要帮助绘制多元线之间的区域 - 而不是从轴到线

    我是 d3 js 的新手 我正在努力填充多元百分位数图中线条之间的区域 我不希望在最底线下方或最顶线上方填充任何区域 第一列始终位于图表的底部 第 5 个百分位 最后一列将始终位于图表的顶部 第 95 个百分位 我需要每条线之间单独的区域段
  • GeoJson 世界数据库 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在开发一个项目 需要使用 d3 js 显示国家和城市的地图 实际上 D3支持GeoJson格式 通常
  • 如何使 d3 饼图响应式?

    我有一个 PIE 图表 它工作正常 但我无法使其具有响应能力和可调整大小 我需要它与移动浏览器和 iPad 等兼容 div div
  • D3 将现有 SVG 字符串(或元素)追加(插入)到 DIV

    我到处寻找这个问题的答案 并找到了一些我认为可能有用的资源 但最终没有让我找到答案 这里有一些 外部SVG http bl ocks org mbostock 1014829 嵌入SVG https stackoverflow com qu

随机推荐

  • JsonNullable 没有与 Jackson 序列化其值

    我正在尝试使用JsonNullable
  • .NET core 将命令行参数从 Program.cs 传递到 Startup.cs

    我正在尝试配置 kestrel 以便当它处于原始模式时它可以在特定端口上运行 然而 要做到这一点 launchsettings json 似乎需要传递命令行参数来执行此操作 因为没有直接选项 并且它始终在端口 5000 上运行 如果您有需要
  • 使用 Node.js 和 WebSocket 传输二进制文件

    我已经在谷歌上搜索这个并在 stackoverflow 上搜索了一段时间 但还没有找到解决方案 因此发表了这篇文章 出于好奇 我正在尝试使用 Node js 和 WebSockets 我正在尝试将一些二进制数据 mp3 传输到客户端 到目前
  • PHP读取cookie文件

    是否有任何帮助程序库可以读取 php ini 中的 cookie 文件 我的本地磁盘上有一个 cookie 文件 我想要一种更好的方式来读取它 我目前只是按行读取文件并解析出值 如果您打算阅读 Netscape 的格式 例如 curl 以这
  • 在调用堆栈中显示特殊的原始函数

    这个问题提示如下问题 有没有办法查看特殊原语调用堆栈中的函数 例如 创建一个在退出时返回调用堆栈的函数 myFun lt function obj on exit print sys calls return obj 调用此函数并将其结果分
  • 领域驱动设计自动递增实体键

    刚开始领域驱动设计 我了解到您应该使模型保持有效状态 并且在创建类的新实例时 建议将所有必需的属性作为构造函数参数 但是 当使用自动递增键时 当我从持久层调用 Add 方法时 我只会获得这个新 ID 如果我在没有密钥的情况下实例化我的对象
  • 捕获重复键插入异常

    我有一个带有唯一主键列的表 称为id 有时当我执行INSERT查询我收到错误 因为id值已被使用 我可以捕获这个特定错误吗try and catch 看起来 mysql 正在为重复的主键抛出 1062 错误代码 您可以检查 sql 异常的错
  • Angular 2,使用 href='#' 处理锚链接

    单击任何带有href Angular 路由器路径 path component NologinComponent pathMatch full 是匹配的 我应该如何处理这些锚链接以便锚与href 停留在同一页面 即什么都不做 锚标记示例 a
  • 是否可以在 Azure 应用服务上安装字体?

    我们正在使用 MigraDoc PDFsharp GDI 它依赖于将字体安装到系统中以便进行渲染 我们尝试过嵌入字体 但 MigraDoc 的 GDI 版本似乎不支持此功能 尝试将此组件移动到 Azure 应用服务时 它找不到字体 有没有办
  • 如何在 PyCharm 的运行/调试配置中将环境变量作为命令行参数传递?

    我正在尝试学习 PyCharm 需要将环境变量作为命令行参数传递给我的进程 例如执行相当于myScript py u myVar在 Linux 上 或者myScript py u myVar 在 Windows 上 如何在 PyCharm
  • 如果从静态构造函数启动并等待空的 .NET 任务,为什么不会完成?

    我不明白为什么下面的代码不起作用 var task new Task gt task Start if task Wait 10000 logger Info Works else logger Info Doesn t work 超时后
  • UIBarButtonItem 图标通过 IB 添加时为白色,以编程方式添加时为黑色

    当我将图标添加到UIBarButtonItem通过 Interface Builder 该图标显示为白色 当我以编程方式将相同的图标文件添加到另一个图标文件时UIToolbar 图标显示为黑色 为什么 UIImage image UIIma
  • Tesseract OCR:是否可以强制使用特定模式?

    我正在使用 Tesseract 我想开发一个能够识别字符序列的应用程序 我取得了不错的成绩 但并不出色 我想读取的字符序列有always一个特定的模式 比方说 数字数字数字字符字符 例如 123AB 有没有办法 告诉 ocr引擎结构始终是固
  • C# 理论:将 JMP 写入 asm 中的 codecave

    假设我已经使用以下命令分配了放置我的 codecave 的地址VirtualAllocEx 它返回地址 我使用以下命令将代码写入该地址WriteProcessMemory 这是问题 如何编写跳转到我的 Codecave 的跳转 我知道跳跃开
  • 按钮显示内联CSS

    我有以下 CSS 和 HTML http jsfiddle net 47w0h73r 6 one padding 20px background f00 two padding 20px background 00f a button fo
  • Jenkins 主/从配置

    我一直在阅读有关 Jenkins 主 从配置的信息 但我仍然有一些问题 是不是从机 Jenkins 并没有像主机 Jenkins 那样实际安装和启动 我假设我会以相同的方式安装一个主詹金斯和另一个从詹金斯 然后主詹金斯将控制从詹金斯 例如通
  • Visual Studio 2015 输出窗口丢失

    缺少显示 Visual Studio 中所有构建消息的输出窗口 我无法使用视图菜单将其恢复 我尝试了安全模式和诊断模式 然后重新启动了一切 怎样才能把窗户找回来 去引用MSDN 在 Visual Studio Express 版本中 输出
  • Rtti 访问复杂数据结构中的字段和属性

    正如已经讨论过的Delphi 2010 中的 Rtti 数据操作和一致性可以通过使用一对 TRttiField 和实例指针访问成员来达到原始数据和 rtti 值之间的一致性 对于仅具有基本成员类型 例如整数或字符串 的简单类 这将非常容易
  • 具有属性包装器的不可用属性

    我正在开发一个支持 iOS 14 及更高版本的应用程序 但我想使用一些 SwiftUI 3 属性包装器 例如 FocusState 我该如何解决这个问题Stored properties cannot be marked potential
  • D3.js v3 到 v4 刷机改动

    我希望从 d3v3 迁移到 d3v4 特别是我在迁移画笔时遇到困难 有人可以查看下面的链接并让我知道更改吗 http bl ocks org zanarmstrong ddff7cd0b1220bc68a58 我发现了一些变化 d3 tim