问题标签 [nivo-react]

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 回答
66 浏览

javascript - 在嵌套对象中显示键的函数?

我这里有一个图表组件,其中包含简单的数据、日期和温度。我想要表格函数做的是在控制台上仅注销结果数组(最好只使用 Date 键)。

table 函数被传递到图表组件上的 OnCLick 上,因此当单击一个条时,一个对象会记录到控制台上。我只需要缩小结果数组并只注销日期位

我的函数在第 52 行:https ://codesandbox.io/s/floral-violet-822vg?file=/src/chart.js

这是单击栏时当前正在登录到控制台的内容:

在此处输入图像描述

我只是将结果数组登录到控制台。先感谢您

0 投票
1 回答
775 浏览

reactjs - 在 Nivo 折线图中显示日期从第 1 天开始

我尝试使用 Nivo 库实现折线图。

我想显示的只是按天提交的数组。我的数组看起来像:

我如何配置图表:

它渲染(第一个元素是在 2 月 28 日),它是否具有日期格式(最后,我放了它如何渲染的屏幕截图):

在此处输入图像描述

0 投票
0 回答
292 浏览

reactjs - 在反应中将 D3 缩放功能添加到 Nivo 热图

我有一个使用 Nivo 的响应式热图的反应应用程序。我无法从 d3 实现缩放功能。我尝试了以下示例Example1Example2。据我所知,Nivo 会生成一个 SVG,但是当我在 SVG 上单击/鼠标滚动时,缩放功能甚至不会运行。有什么我做错了吗?将不胜感激任何建议。

results.js:第 33 -50 行

第 393 -396 行

heatmap.js:第 272-396 行

0 投票
1 回答
160 浏览

javascript - 尝试使用图表中的数据显示表格

我正在尝试根据所选内容(选择哪个栏)呈现具有两列的表格。每个条是一个日期数组。

因此,如果单击最后一个栏,我想要一个月份表,其中包含该月在该数组中出现的次数。

例如,在最后一个栏中,这是显示在控制台中的数组,该数组由第 62 行中的函数创建:

ETC..

功能:

我正在使用状态,我只是想使用带有这个数组和计数的 JSX 来呈现一个表

所以我想要一张表,其中一列中有月份,另一列中有计数 - 像这样:

这是完整沙箱的链接:https ://codesandbox.io/s/nice-meitner-o70m1

0 投票
1 回答
416 浏览

reactjs - 未显示 React nivo/line 适当的彩色标签/工具提示

我正在使用 react v17 和 nivo.rocks 图表进行可视化工作。我项目中的 ResponsiveLineCanvas 组件表现得很奇怪。根据这个数据:

有了这个组件,

我期待Leads锚点/标签应该上升,因为其他ID's值为 0。但令人惊讶的是,该栏Rejected在顶部显示了 Id 的标签。请看下面的图片。 在此处输入图像描述

在这里,我期望绿色标签/条应该向上(而不是紫色线),其余的应该像其他值一样向下。

我知道描述有点乱,你可以询问你需要的任何细节。非常感谢这方面的任何帮助。

0 投票
1 回答
79 浏览

javascript - 显示表数据时不断获取“未定义的地图”,React 挂钩

我正在尝试使用 State 将输入更改为“年”时显示年份,但我遇到了问题。

当使用此地图方法单击年份时,我正在尝试显示不同的数据:

我不断收到错误'TypeError: Cannot read property 'map' of undefined'

这是完整的沙盒代码:https ://codesandbox.io/s/wizardly-clarke-szge3?file=/src/data.js

0 投票
1 回答
38 浏览

javascript - 过滤器数组方法不适用于reduce方法

我不断收到 TypeError: countYear.filter 不是最后一行的函数,但我不明白为什么。我只想输出年份并计算(仅 2014 年)。这是原始代码的沙箱:https ://codesandbox.io/s/wizardly-clarke-szge3

0 投票
2 回答
117 浏览

javascript - 将对象数组转换为分层数据结构

我有一个原始数组,我想将它绘制在需要分层数据结构的 Sunburst 地图中。

期望的结果

任何人都可以帮我解决这个问题,我尝试使用 reduce 方法,但我无法获得所需的结果。

PS:如果有人可以提出一个可以处理以逗号分隔的 n 个 id 的答案,那将非常有用。例如:这里我们有 3 个用逗号分隔的 id 层次结构,如果有 4 或 5 个深度数据会发生什么。

0 投票
1 回答
1473 浏览

javascript - 如何在 nivo 图表设置中添加自定义颜色主题

我在我的一个项目中使用 Nivo 图表,并且我已经实施了 nivo 图表设置,因为他们已经在他们的网站中实施了这些设置。但是,除了 nivo 提供的内容之外,我还想添加一些我自己的自定义颜色主题选项。为了更清楚起见,我附上此屏幕截图 在此处输入图像描述

现在,我们从 nivo 包中导入颜色为

现在我在某处读到我们可以将自定义对象注入为颜色主题,谁能帮我展示一下如果我想添加名称为 CustomTheme 的新主题,颜色为“#000, #fff,#ff0000 ”。我们将如何做到这一点,任何帮助都会有所帮助。提前致谢

0 投票
0 回答
204 浏览

javascript - 如何将 Nivo 图表下载为 png

我正在尝试制作一个按钮以将 Nivo 图表下载为图像,但似乎没有明显的方法可以做到这一点

我试过使用 react-download-svg 库,但这似乎不起作用