问题标签 [sunburst-diagram]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
643 浏览

javascript - d3js和弦图多级 - 级别,子级,子子级

我想通过一些想法或文档帮助我完成一个小型个人项目。我想使用d3.js创建一个带有级别和子级别(层次结构)的和弦图。

所有的例子都只解释了一个层次。

我想我想要的是sunburst的组合,但是从边缘到中心以及中心和弦图中的层次结构。

有什么建议么?

0 投票
1 回答
2207 浏览

javascript - 将图像添加到 D3.js Sunburst 示例

我想扩展这个 D3.js sunburst 示例,使其可以显示图像而不是文本。http://www.jasondavies.com/coffee-wheel/

在此处输入图像描述

js 示例代码的有趣部分如下:

问题是如何在这种情况下用图像替换文本。

非常感谢你。

0 投票
0 回答
229 浏览

javascript - 鱼眼失真的 D3js 插件未出现在树布局和森伯斯特分区中

我正在尝试在Tree Layout & Sunburst Partition中为 d3js 实现鱼眼插件。给出的示例是针对力布局的。我尝试了他们提到的 fisheye方式。但我觉得有一些基于布局的支持,因此大多数/其他布局不支持它。但我不确定我的分析是否正确。

所以我需要一些关于“如何实现放大镜效果的鱼眼失真”的建议/提示。

任何机构都可以帮助我吗???

0 投票
0 回答
2001 浏览

javascript - d3.js 序列 Sunburst __data__ null

我正在尝试对我拥有的一些数据使用“sequence-sunburst”风格的 d3 可视化。首先,我决定简单地重新创建 d3 网站 ( http://bl.ocks.org/kerryrodden/7090426 ) 上给出的内容。

在此处输入图像描述

正是在这里,我遇到了一些问题:

在“sequence.js”的第 85 行,我收到以下错误:

Cannot read property '__data__' of null

第 85 行代码如下:

totalSize = path.node().__data__.value;

同样,要开始,我已经逐字复制了 js 和 csv!我不知道为什么这不起作用。

进一步说明:

  • 我正在使用最新版本的 Chrome
  • 我正在运行 Chrome 设置为--allow-file-access-from-files
  • 我正在使用 python 的 SimpleHTTPServer 打开我的 html 文件(也逐字复制!)。端口被正确引用。

帮助表示赞赏。

0 投票
1 回答
785 浏览

javascript - d3.js 中的奶酪图

您将如何使用 d3.js 实现这一点:

在此处输入图像描述

我从旭日形图开始,但是如何处理圆形的图片?如何旋转它们?等(假设每个奶酪都有它的png图片)

0 投票
1 回答
2031 浏览

javascript - 发布标签 d3 sunburst

我正在开发 d3 sunburst 类型。

一切正常,它正确地采用了耀斑 JSON,但是,当我去标记路径时,看看发生了什么:

在此处输入图像描述

代码如下:

旋转代码是:

该脚本适用于所有其他 d3,但我必须为每条路径添加这些颜色。

问题出在哪里?

问候。

更新:d3 sunburst 小字体:

在此处输入图像描述

更新:我想要这样的东西:

在此处输入图像描述

更新:看看内部标签:

在此处输入图像描述

0 投票
0 回答
385 浏览

d3.js - D3 - 朝阳图的鱼眼

我正在尝试为 Sunburst 图表实现 Fisheye。我无法让它工作。我尝试了类似于以下示例的方法。

http://jsfiddle.net/g88S7/

有人可以告诉我我是否遗漏了什么吗?

0 投票
2 回答
2858 浏览

javascript - 在 D3 可缩放朝阳中,如何使标签取决于缩放级别?

我正在尝试使用可缩放的旭日形图来可视化一个大型数据库。我的 json 的较低层级有太多子级,因此文本标签在外边缘非常混乱且不可读。

我可以根据绝对深度级别打开或关闭标签,但这意味着这些标签永远不会显示,即使我放大。

我的问题是,如何计算特定缩放级别的“相对”深度,然后根据它显示标签?

据我所知, d.depth 仅表示绝对水平。

0 投票
11 回答
102839 浏览

javascript - d3 未定义 - ReferenceError

我正在尝试使用在http://bl.ocks.org/kerryrodden/7090426找到的“精美图” :

在此处输入图像描述

我这样做的方法是下载代码并简单地编辑 CSV 文件以匹配我的数据。然后我只需在 Firefox 中打开 .html 文件即可查看交互式图表。但是,在另一台计算机上使用它会出现以下错误:

ReferenceError:d3未定义sequences.js:25

ReferenceError: d3 未定义 index.html:28

由于我对 d3 或 javascript 几乎一无所知,我有点迷茫。你们中的任何人都可以给我提示导致错误的原因以及我应该如何更正代码吗?

我对代码进行了一次更改,使其如下:

Javascript:

HTML:

0 投票
1 回答
2970 浏览

javascript - D3:在森伯斯特示例中的第三个和第四个四边形中旋转标签

按照http://bl.ocks.org/mbostock/http://bl.ocks.org/mbostock/4063423的示例,我第一次使用 D3 和 javascript 来绘制旭日形。第三个和第四个四边形中的标签是颠倒的。我在这里找到了咖啡轮示例http://www.jasondavies.com/coffee-wheel/并尝试将其合并到我的示例中,但未能成功旋转标签。我确实在这里找到了类似的帖子How to proper rotate text labels in a D3 sunburst diagram,但由于其中一个链接不起作用,无法解决问题。

ex.json