如何设计类似于 WHO Coronavirus Disease (COVID-19) Dashboard 的 React 组件？

Question

我想设计一个类似于

的地图组件

WHO Coronavirus Disease (COVID-19) Dashboard map component. for a particular country, where different regions can be selected based on a prop.

WHO Coronavirus Disease (COVID-19) Dashboard

any references or guidance would be much helpful. I have no clue to do it. don't downvote it

Answer 1

首先，您需要像 https://d3js.org/ 这样的图表库才能绘制图表。我发现 D3js 是所有库中最灵活的。

然后您可以将数据库中的数据集成到库提供的绘图方法中

D3js 绘图示例：

1. https://observablehq.com/@d3/bubble-map
2. https://observablehq.com/@d3/spike-map

其他绘图库

1. Google 图表：https://developers.google.com/chart/interactive/docs/gallery
2. Highcharts：https://www.highcharts.com/demo/maps
3. JS charting:https://jscharting.com/examples/chart-types/geographic-map/
4. 剧情：https://plotly.com/javascript/