D3 旭日弧尺寸

2024-05-12

我正在尝试根据以下示例创建 D3 旭日图:

https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099 https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099

我希望创建的弧线能够闭合整个圆,但它们没有。

为了测试目的和简单起见,同一深度中每个元素的大小之和等于 360。

遵循我的 jsFiddle:

https://jsfiddle.net/igasparetto/uz8rz13d/ https://jsfiddle.net/igasparetto/uz8rz13d/

有些东西告诉我问题出在这些方面:

var partition = d3.partition();

var arc = d3.arc()
.startAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x0))); })
.endAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x1))); })
.innerRadius(function(d) { return Math.max(0, y(d.y0)); })
.outerRadius(function(d) { return Math.max(0, y(d.y1)); });

Thanks


您的问题似乎是,当您执行以下操作时,会包含为父节点定义的大小变量root.sum创造价值。本质上,父值不仅设置为其子值的总和,而且还可以将父值添加为“可用空间”

https://github.com/d3/d3-hierarchy/blob/master/README.md#node_sum https://github.com/d3/d3-hierarchy/blob/master/README.md#node_sum

“每个节点的 node.value 属性设置为指定函数返回的数值加上所有后代的组合值。”

这是有效的,因为它忽略非叶节点大小值:

  root.sum(function(d) { return !d.children || d.children.length === 0 ? d.size :0; });

https://jsfiddle.net/uz8rz13d/2/ https://jsfiddle.net/uz8rz13d/2/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

D3 旭日弧尺寸 的相关文章

随机推荐

  • 选择排序,对于 Java

    我无法理解这个伪代码并将其实现到我的程序中 有人可以更好地解释它或向我展示代码的外观吗 谢谢 A an array containing the list of numbers numItems the number of numbers
  • 从 imread 返回的 ndims

    我正在从文件夹中选取图像 尺寸为128 128 为此 我使用以下代码行 FileName PathName uigetfile jpg Select the Cover Image file fullfile PathName FileNa
  • jquery 查找下一个带有类的元素

    我试图找到下一个具有 错误 类别的元素并碰壁 在查看 jQuery 网站上的演示时 这应该可以工作 但事实并非如此 button disabled next text this button is disabled div div
  • 更新 DynamoDB 中的多条记录

    如何在单个查询中更新 DynamoDB 中的多条记录 我有一个 csv 文件作为基于 csv 文件的输入 我必须更新数据库中的多条记录 只有一个属性 有可用的 API 吗 或者这可以使用批处理 Spring batch 来完成 Dynamo
  • Tess4j - Pdf 到 Tiff 到 tesseract - “警告:分辨率 0 dpi 无效。使用 70 代替。”

    我正在使用 tess4j net sourceforge tess4j tess4j 4 4 0 并尝试对 pdf 文件进行 OCR 因此 据我了解 我必须首先将 pdf 转换为 tiff 或 png 其中有任何建议吗 我这样做是这样的 t
  • 在discord.py中访问成员的横幅

    我正在制作图像配置文件命令 我想为此访问会员的横幅 我们有什么办法可以在discord py 中做到这一点吗 如果不清楚我所说的横幅是什么意思 那么蓝色背景的图像就是横幅 我想访问它 在discord py v2 0中你可以使用 You m
  • jquery 动态 iframe - !document.write 和 IE 问题

    为什么这在所有浏览器中都有效 除了 IE var iframe var doc iframe contents doc find head append 但是 如果我在 document write 中使用非 jquery 对象 它在 IE
  • 在打字稿中通过 this 从派生类型调用构造函数

    在我的打字稿中 我尝试通过基类中的方法创建 克隆子对象 这是我的 简化的 设置 abstract class BaseClass
  • 如何使用 ggplot2 绘制 NA 间隙

    在 R 的基本绘图中 如果数据系列 ggplot2 中存在 NA 则会绘制间隙 举个例子看看 df data frame x c 1 10 y c 1 10 df 5 7 NA plot df type l 但是 ggplot2 删除了缺失
  • 父属性是否可以设为最终属性,以便子属性无法覆盖

    是否可以使模块 pom 无法覆盖父 pom 中的属性 例如 如果模块 pom 说
  • 如何使用图像生成 SVG 二维码?

    我有一个用于生成 jpeg 和 png 格式的 qrcode 的代码 但也想在 PHP 中生成带有背景图像的 svg qrcode 我正在使用 qrlib php 生成 jpeg 和 png 格式 QRlib php 也支持 SVG 不是吗
  • 如何通过单个mysql查询更新多个表?

    我有两个表 tb1 和 tb2 我必须在用户级别更新两个表的公共列 我对两个表都有一个共同的标准 例如用户名 所以我想这样更新 UPDATE tb1 tb2 SET user level 1 WHERE username Mr X 但不知何
  • Extjs - 为选项卡生成唯一的 url

    据我了解 ExtJS 使用 AJAX 进行所有服务器端通信 并且理想情况下每个应用程序只有一页 但我正在探索为 ExtJS 选项卡生成唯一 URL 的可能性 然后用户可以从地址栏复制该 URL 以供以后使用 传统 Web 应用程序方法 使页
  • CentOS目录结构是树形的吗?

    CentOS 上有相当于树的东西吗 如果你的 Centos 系统上没有安装 tree 无论如何我通常建议服务器设置使用最小安装磁盘 你应该在命令行中输入以下内容 yum install tree y 如果没有安装 那是因为您没有正确的存储库
  • 如何通过Python访问Hive?

    https cwiki apache org confluence display Hive HiveClient HiveClient Python https cwiki apache org confluence display Hi
  • 当我在 Lwuit 移动应用程序中按 # 键时如何调用退出命令?

    Can I assign the Exit Command to the key in an Lwuit Application When I press the key the Exit command should be called
  • MySQL:更新所有行将字段设置为0,但将一行的字段设置为1

    是否有一种有效的方法将行字段的选择更新为 0 但根据 ID 将其中一行设置为 1 基本上 我在数据库中有多个对象 我想在其中一个 inuse 之间切换 因此查询将其中一行 按 id 设置为 inuse 1 将其他行设置为 inuse 0 谢
  • Android 动态创建表 - 性能不佳

    我希望你能帮助我 我想动态创建表 屏幕截图 我通过下面的代码创建了它 TableLayout tl TableLayout findViewById R id main table FOR 1 300 TableRow tr head ne
  • Android:如何将自定义字段/操作添加到联系人详细信息

    我会将自定义操作添加到 Android 的系统联系方式中 例如 Viber 请参阅随附的屏幕截图 和其他消息应用程序 当用户单击此类自定义操作时 我的应用程序将进行处理 有什么帮助吗 我怀疑这是否像听起来那么容易 据我所知 您需要在设备上创
  • D3 旭日弧尺寸

    我正在尝试根据以下示例创建 D3 旭日图 https bl ocks org maybelinot 5552606564ef37b5de7e47ed2b7dc099 https bl ocks org maybelinot 55526065