将旧geo适配到D3 v5，如何表达一个Promise的队列？

Posted 2023-03-23

【中文标题】将旧geo适配到D3 v5，如何表达一个Promise的队列？

【英文标题】：Adapt old geo to D3 v5, how to express a queue of Promise?

【发布时间】：2020-02-23 08:22:23

【问题描述】：

我正在使old version D3 map visualization 适应现代 D3v5：第一步，到 D3v4，正在运行 with this source，但到最后一步，我需要从旧队列转换 Promise，

d3.queue().defer(d3.json,"file.json").(ready);

到现代的v5风格... 如何用v5风格表达？好像是这样的

var brMap = d3.json("file.json");
Promise.all([brMap]).then(ready)    

但不工作。

---

PS：v5 简单示例在哪里？

【问题讨论】：

这应该可以，看看my answer here。究竟是什么问题？

嗨@GerardoFurtado，谢谢。也许这些线索解决了我的问题......我只有语法/结构问题。我会尽快测试，回话

@PeterKrauss 因为你只有一个任务——即d3.json—要等待，你的代码可以进一步简化为d3.json("file.json").then(ready)；在这种简单的情况下，不需要使用Promise.all()。

@PeterKrauss 除了上述简化之外，我怀疑您仍在使用示例中回调函数的旧签名：function ready(error, shp)，对吗？请注意，.then() 的签名与以前版本的 D3 使用的 Node.js 回调样式 function(error, data) 略有不同...

@PeterKrauss ...现在，没有error 参数，这会将加载的数据存储在第一个参数中（现在误导性错误命名为error）留下第二个参数@987654336 @一直都是undefined。您可能想看看我的 answer 以更详细的方式解释如何处理这个问题。

【参考方案1】：

感谢@GerardoFurtado 和@altocumulus，答案在他的cmets 上，这里合并了所有。

---

有一些全局变量（也许不是最佳实践）

var g;

在“页面加载后”上下文运行

svg = d3.select("etc..")
g = svg.append("g")
// ...
d3.json("file.json").then(ready);

函数ready() 是这样的

function ready(shp) 
  var data1 = topojson.feature(shp, shp.item1);
  //... draw map appenging features to global g

查看解决方案的最终结果here。