问题标签 [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 回答
498 浏览

javascript - 如何将 InfoVis Sunburst Label 拆分为多行

我创建了一个测试文件:

http://www.ivangasparetto.com/jit-test/donut.html

在此处输入图像描述

我希望标签进入多行。

我尝试使用来自 https://groups.google.com/forum/?fromgroups=#!topic/javascript-information-visualization-toolkit/IMOYhzlJmr4的建议, 但标签放置不正确并且缺少旋转。

0 投票
1 回答
1209 浏览

svg - D3 Sunburst 文本的剪辑路径

我正在尝试基于旭日形图实现 d3 可视化,并且我找到了一个几乎完美的在线示例,我已经开始使用
http://tributary.io/inlet/4127332/

在此处输入图像描述

我的主要问题是我还需要将文本剪辑到片段中,我尝试使用 svg 剪辑路径,但我微薄的 d3 技能让我失望了。对此的任何帮助表示赞赏。

0 投票
2 回答
1841 浏览

highcharts - Highcharts - 森伯斯特分区

我想知道使用 Highcharts 创建向下钻取旭日形分区的最佳方法?我最初的方法是渲染所有系列,并根据所选系列动态更改系列(隐藏内部系列并更改其余系列的大小/内部大小)。

但是对于我无法隐藏它们的甜甜圈派,我将工作样本用于派,并修改为甜甜圈以向您展示我的意思:http: //jsfiddle.net/abdPj/

也不是 100% 确定可以即时更改大小和内部大小,我是否每次都必须重绘所有可见系列?

0 投票
0 回答
202 浏览

javascript - 森伯斯特动画故障

我从默认的Sunburst 示例开始,并尝试在单击时添加动画 - 单击楔形会使该楔形成为中心元素。除了在少数情况下,这很有效——看起来如果深度超过 2(基于 0),那么一些楔子的动画效果不正确;他们似乎在错误的地方开始动画,但最终在正确的地方结束。

以下是我认为的相关代码,希望对其他人有用:

因为我的代码与深度没有任何关系,我预计问题出在其他地方,但我一直无法找到它。该故障似乎影响了所有浏览器(至少 Chrome、Firefox 和 IE)。

所以,我的问题是:问题是什么,我该如何解决?

0 投票
1 回答
1702 浏览

python - 创建 Protovis Sunburst 图表:以 json 格式创建数据集的 Python 脚本(或)父 - 子 json

帮助!!!作为一名生物学家,我只对可视化和显示我的数据感兴趣,而且我对编程非常陌生。在这里,我在一个 excel 文件中有一组数据,看起来像这样 -

我想在 Protovis 中使用Sunburst图表显示我的数据集非常完美。

但我一直坚持准备数据,这些数据必须是 json 格式。如果您注意到数据的结构是分层的(父 - 子层次结构)。在编程方面不太好(只知道一点 Python)很难继续前进。

我需要一个可以读取我的excel文件并生成上面指定的json的python脚本。

我的 excel 数据文件有名为 L1、L2、L3、L4、L5、GENE_NAMES 的列,其中包含数据并且存在父子关系。L1 是 L2 的父级,L2 是 L3 的父级,依此类推...

  • L1(父母)- L2(儿童)
  • L2(父母)- L3(儿童)
  • L3(家长)- L4(儿童)
  • L4(家长)- L5(儿童)
  • L5 (PARENT) - GENE_NAME (CHILD)

希望我能以上述格式可视化我的数据集。但我的数据集应该是这里指定的 json 格式

任何形式的帮助表示赞赏。

0 投票
1 回答
1324 浏览

javascript - 如何使用 d3.js 向我的图表添加标签?

我正在制作一个交互式工具,用于使用 d3.js、svg 和 JQuery创建像这样的 Sunburst 图。绘制图表的代码来自该页面,稍作修改。我正在尝试在图表的各个部分上绘制文本标签,但尽管元素显示在 Web Inspector (Chrome) 中,但它们在屏幕上不可见。我试图从这里调整代码,并且在某种程度上这已经奏效(Web Inspector 说元素存在),但我对为什么元素本身没有出现感到困惑。这是我的代码 - 用于绘制标签的部分靠近底部。我只会使用带有标签的示例页面中的代码,但布局非常不同,我必须从头开始。

0 投票
1 回答
2465 浏览

javascript - 如何旋转我的文本标签,使它们不能倒置 (SVG)?

我正在使用 d3.js 制作一个旭日形图创建工具,并且我正在尝试复制此页面上的标签方式上标签翻转的方式,以便它们永远不会倒置。问题是我会使用rotatetransform属性,但它已经用于定位标签。这是我目前的代码:

我找到了tspan rotate属性,但结果证明这是一条红鲱鱼,因为它旋转了各个字母。我的图表基于此页面

提前致谢!

0 投票
1 回答
1406 浏览

javascript - Infovis JIT:将点击侦听器添加到边缘

我正在尝试在旭日形图的边缘捕获点击事件。我已经捕获了节点上的点击事件。这就是我正在尝试的:

但这仅捕获节点点击。怎么了?先感谢您。

0 投票
1 回答
608 浏览

javascript - d3 sunburst 不使用内联 json 绘制

我一直在尝试画一个旭日形内联,但结果总是一个空块。有人可以看看并提示我为什么吗?非常感谢你的帮助!

基本上它是示例代码,我只尝试将 json 加载更改为内联 json,以便我更容易解析数据。

0 投票
0 回答
582 浏览

d3.js - d3 带有附加文本的动画路径

我按照http://strongriley.github.io/d3/ex/sunburst.html的示例创建了一个旭日形图:

在此处输入图像描述

一切都很好,在将文本附加到图表时(通过 text 和 textPath 元素使用xlink:href指向弧的 ID 的属性)。动画(打开/关闭效果)没有附加文本的图表时相同(如示例所示)。只要附加了文本,动画就会减慢(拖动行为)。这只发生在 iPad 上,而不是在桌面上。我以为是因为平板电脑的webkit。也许我错过了一些东西。

注意:由于文本附加到弧上,因此不会对文本元素应用任何过渡,仅使用以下方法对路径进行动画处理:

使用这种方法,路径上的文本(附加)可以在网络上流畅地制作动画,但在 iPad 上则不行。