我创建了一个脚本,它从 API 获取数据、格式化数据并使用 DataMaps http://datamaps.github.io/使用它。
在我的 .js 文件中,我可以简单地调用:
var map = new Datamap({element: document.getElementById('container')});
它将在选定的 div 中呈现地图。问题是,如果我在异步函数中使用它从 API 获取数据并渲染填充有 API 数据的地图,我会收到此错误:
Uncaught (in promise) TypeError: Cannot read property 'select' of undefined
at Datamap.drawSubunits (datamaps.all.js:184)
at draw (datamaps.all.js:789)
at Datamap.draw (datamaps.all.js:768)
at new Datamap (datamaps.all.js:730)
...
如果我只是在异步函数中以这种方式调用地图,我什至会收到此错误,因此数据不是问题:
async function fetchData() {
try {
const response = await fetch('https://corona.lmao.ninja/v2/countries?yesterday=&sort=');
const data = await (response.json());
var map = new Datamap({element: document.getElementById('container')});
return data;
} catch (error) {
console.error(error);
}
}
fetchData();
如果我把var map = new Datamap({element: document.getElementById('container')}); 在它工作的功能之外。我对此一无所知。
任何帮助,将不胜感激。第一篇文章和英语不是我的主要语言。