问题标签 [react-d3]

我目前在 react-d3-tree 中使用我的数据时遇到问题。来自服务器的数据与 react-d3-tree 接受的格式不兼容。

有人告诉我，对每个​​项目使用一个函数来完成这个过程foreach会起作用，但我认为这会非常慢，尤其是当数据太大时。

现在的数据（如我的控制台所示）是这样的：

我想实现这个结构：

这只是示例数据，稍后，我可能会转换更多孩子的数据。有没有可以提供帮助的 npm 包？

I need to create a line chart using React and D3 as shown below. The line chart i need to create

I already have this chart with the code i have written Line chart till now

The code till now is -

Now i need to add functionality that circles come around all the points and intitially there is area with dotted lines for one of the points with values displayed inside the rectangle. then when user hovers over other point the dotted lines corresponds to that points. How can i achieve this functionality using d3 in react. I am unable to come up with a solution?

我已经尝试使用 [react-d3-tee][1] 但它不允许我在 onclick 中调用组件，所以请帮助我在某些条件下如何在 onclick 上调用组件，我在上面的代码中提到了

我想在 onclick 上调用组件，我在某些条件下编写了 onclick 函数

我是 React 路由器和状态的新手，我不知道为什么如果我使用下面的条件/步骤，我的简单 D3 图表不显示

1. 使用 Promise.all 在应用程序上加载数据并存储在 State 中（我在这里加载数据的原因是因为我尽量避免在每个图表页面上加载数据）

2. 使用导航从应用程序调用仪表板页面

3. 第一次它将使用我的条形图加载仪表板页面

4. 当我单击下一个菜单以显示条形图时，它不显示

5. 如果我再次单击同一菜单，它将再次显示我的条形图

是因为异步函数（Promise.all）吗？如何解决？

字母表.csv 样本数据

字母，频率 A，0.08167

B,0.01492

C,0.02782

D,0.04253

E,0.12702

这里有人使用库 react-d3-graph 吗？ https://danielcaldas.github.io/react-d3-graph/docs/index.html 我正在尝试找到一种方法来给我的节点起始位置，我不确定它们的位置现在是如何在渲染时设置的。知道该怎么做吗？

谢谢

我有一个向客户端提供数据的 WebSocket，并且我在使用 D3 反应的图表中显示它（数据），所以我希望我的图表根据数据进行更改，但要更改图表组件的状态，我必须从定义 onMessage 事件的父组件访问它，我的问题是图表没有更新：

父组件：

子组件：

谢谢

首先，我查看了react-d3-tree github上的第40和95号问题，我 在 StackOverflow 上没有看到任何对我有帮助的东西。我正在尝试实现 parseJSON 方法，以便可以从项目文件夹中获取自己的 JSON 文件，然后生成树形图。

让我们从我一开始所做的开始。我复制粘贴了在崩溃前工作了 2 秒的示例代码。原因？服务器端渲染。太好了，所以我从 NextJS 中找到了这个，它允许我为某些组件禁用 SSR。嘿，现在示例代码正在运行。让我们试试他们使用外部数据的示例代码！不，它找不到 parseJSON 方法。我不知道该怎么做，找不到任何东西来解决这个问题。我正在尝试导入这个与 SSR 有一些问题的函数，但因为它不是一个组件，我无法使用动态导入它，并且我无法正常导入，因为它会导致“未定义窗口”错误因为SSR。以下是我的主要两个文件。

DynamicComponent.js [版本 1]

DynamicComponent.js [版本 2]

图/index.js

我在版本 1 中遇到的错误

我在版本 2 中遇到的错误

请 StackOverflow，你是我唯一的希望。

我想在 React 应用程序中构建动态树，为此我正在使用带有外部源（CSV 文件）的D3库。

这个 CSV 文件是动态更新的，问题是这个文件位于 React 源文件夹中，所以每次文件更改时，整个应用程序都会重新加载。我只希望树重新加载它，因为我在重新加载时丢失了所有其他输入的信息。

有人能帮我吗？

所以我有这个 JSX 元素，我试图在 Class 组件中呈现。它本质上是 D3 的 React 库提供的视觉效果。但是，我在尝试渲染 D3 视觉对象时收到此错误：

Unhandled Rejection (Error): Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

以下是发生错误的一些相关代码片段：

将所有必要的道具传递给 D3 库的构建器函数

渲染图形和界面的 HO 类组件

为 BarStackChart 设置数据的 REST API 调用（在默认类 Component 中）

类 Component 的渲染方法

除了设置“this.state.visual”JSX 元素并在渲染方法中调用它之外，肯定有更好的方法来实现这一点，尽管我对 React（大约一个月前开始学习）和 JS（大约 3 个月前开始）我不太了解两者的所有常见做法；只是它们如何工作的一般理论。

这个界面和我的作品集托管在joshuabaroni.github.io。我试图改进的界面是“项目”部分下的 NaiveBayes 项目界面

任何建议将不胜感激！整个 JS 文件可根据要求提供。

在过去的三个小时里，我一直在为此挠头，如果有人可以帮忙，请帮忙。我不太擅长将 D3 与 React 结合使用。

所以，基本上，我在后端 Flask 应用程序中运行了一个异常检测器算法，它以字典的形式返回值（然后通过 json.dumps() 转换为 json 对象），进一步，使用 D3 在我的 React 应用程序上绘制.

最初，我认为问题出在我的数据库上，因为该应用程序在代码沙盒和我之前的所有版本中都能完美运行。

这就是 console.log(data) 的样子：

有人告诉我，A_Epoch(3) 和 Time_Epoch(151) 的不同数据点可能存在问题。解决了也无济于事。

这是代码的样子：

这部分是抛出错误。