问题标签 [d3heatmap]

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 投票
1 回答
35 浏览

r - 在 d3heatmap 中绘制时间序列数据的树状图

我正在尝试使用 d3heatmap 库绘制时间序列数据的树状图。

现在,我无法使用以下代码生成带有树状图的漂亮热图:

树状图结果

这是可重现的数据:

我目前有一个没有树状图功能的瓷砖地图。我想用当前的tilemap显示一个树状图特征,如下所示:

顶部需要树状图

0 投票
0 回答
38 浏览

angularjs - D3 热图工具提示错误 ~ 鼠标悬停时光标变为文本光标图标

热图光标错误

热图光标正确

第一个链接显示鼠标悬停时光标会发生什么,这只有时会发生,而不是在框的整个区域上发生。第二个链接是应该发生的事情。我不确定我的错误或为什么会发生这种情况。我认为这可能与在工具提示中选择正文有关,但是当我选择图表 ID(“#chart_svg”)时,鼠标悬停时工具提示根本不显示。下面是我在 d3 热图上的工具提示代码。有没有人遇到过这个问题或知道可能发生了什么?

作为参考,我在自己的组件文件中的 AngularJS 应用程序上构建它。html 仅显示整个组件。

谢谢!

0 投票
0 回答
22 浏览

d3.js - 无法在 D3 角度库中的单元格之间添加填充

在这种情况下,填充对于单元格中的单个值工作正常。

见样机:

在此处输入图像描述

当我们在一个单元格中添加多个值并且我们根据它的值在单元格中显示不同的颜色时,填充不起作用。

见样机:

在此处输入图像描述

我们试图这样做

但它没有按预期工作,所以请给一些建议谢谢。

0 投票
0 回答
51 浏览

javascript - D3 热图添加新行删除旧

我试图在每个新的一周在热图的顶部添加一个新行。最终发生的事情如下图所示。

刻度正确更新。但由于某种原因y()在更新热函数中updateHeatOnEvent()——生成下一个最小的行号赋值*模拟的周数,去掉最小的。这最终将行堆叠在一起,从顶部开始,直到所有行都如图所示并且不再变化,即使使用生成的 rand 数据Math.rand()来模拟 z 的变化。

请记住,不会添加任何新行。

图片发生在 10 个模拟周过去后。

我已经尝试过输入/合并/退出的每种组合| 追加/加入我可以想出,足够我没有在这里包括它们。也许我不正确地使用它们?在这种情况下,您将如何正确使用它们?

唯一有效的是生成新rect的,删除所有旧的,并通过添加新的.join()

我错过了什么???

在此处输入图像描述

设置 1:

设置 2:

设置 3:

设置 4: