vue3搭配ts和echarts实现疫情地图自配接口，省级可以进二级市区右侧可查看高低。

axios

.get(https://geo.datav.aliyun.com/areas_v3/bound/100000_full.json)

.then((res: any) => {

// 存一次数据 用来找子级

mapData.value = res.data;

// registerMap 注册一个地图   mapData 地图的数据包 根据不同的数据渲染不同的地图

echarts.registerMap(“china”, res.data);

// 这个调用是进行地图的渲染

mapRender();

});

​

// 首次 请求疫情的数据 因为接口 设计到跨域 所以要进行 proxy 进行代理

axios

.get(“/api/news/wap/fymap2020_data.d.json?_=1580892522427”)

.then((res: any) => {

// 将数据备份一次 用来查找子级

mapEpidemic.value = res.data.data.list;

// 这个调用是疫情数据的渲染 mapRender 处理数据的函数

let data = mapRender(res.data.data.list);

// option 数据传入进去 设置数据

map.setOption(data);

});

});

​

// 处理数据的函数 以及 echarts 的option 数据配置 这个函数非常重要

const mapRender = (data: any = [], mapData: any = []) => {

let mapLocal: any