【问题标题】:Waiting for rendering a chart till data has loaded等待渲染图表直到数据加载
【发布时间】:2023-03-29 04:50:01
【问题描述】:

我使用 D3.js 制作了一个小图表。

  1. 对于不同类型的输入数据类型,有 3 种不同类型的加载函数。

  2. 我的图表可以在任何这些数据集上呈现,一次一个基于传递给渲染函数的参数。

  3. 数据加载代码是异步的,这会产生问题,因为我的渲染函数甚至在数据完全加载之前就开始绘制。

  4. 我给出了单独的加载函数,而不是在渲染函数中调用它们,因为用户可能只想先加载数据集,然后再渲染图表。

  5. 我想在开始绘制之前等待一个标志,并在所有数据集上传后设置这个标志,但在我看来很难看,因为无限循环。

在设计方面有什么想法可以用来完成这项工作吗?

    var visualization = new  Chart()
                          .width(1000)
                          .height(1000)
                          .loadDissimilarityMatrix('dataSet1.csv')
                          .loadAdjacencyMatrix('dataSet2.csv')
                          .loadLaplacianMatrix('dataSet3.csv')
                          .render('Dissimilarity')
                          // .render('Adjacency') for using the adjacency dataset.

【问题讨论】:

  • 是的,您不能这样做,您需要将 d3 代码放在您的 csv 回调中。

标签: javascript design-patterns asynchronous d3.js


【解决方案1】:

我想出了一个解决方案。

我意识到数据加载部分应该留给 API 用户。我应该只要求直接数据,而不是要求 URL 来加载文件。显示“忙碌屏幕”等的责任都应由 API 用户承担。

当数据集完全加载时,他应该在他的回调中调用图表创建和渲染代码。我的图表可以直接渲染,不用担心数据还在加载中。

我检查了一些 API,但没有找到负责解析和加载数据的 API。

附:欢迎提出建议。

【讨论】:

    猜你喜欢
    • 2021-04-27
    • 1970-01-01
    • 2016-11-22
    • 2017-10-29
    • 2020-11-23
    • 1970-01-01
    • 2016-01-24
    • 2020-04-02
    • 1970-01-01
    相关资源
    最近更新 更多