在家太无聊，写了个武汉肺炎的广州疫情分布地图

武汉加油！！

由于看到了不少城市都作了个确诊病例的分布地图，发现广州尚未因此作了一个，但愿给你们作个参考

代码在 github.com/chenguojun/… 查看效果

如下是截图

数据来源

位置信息大多发布在城市的卫生健康委员会官网，能够百度找到相关的疫情通报，广州的分布通知就在广州市卫生健康委员会官网

数据处理

由于数据只有地址，也没有详细的数据资料，因此数据要自行录入

数据存储上我使用了腾讯地图的数据云，能够节省带宽，并且能够搜索

地图上能够选择其余的地图，如百度地图、高德地图，其开放平台都有所须要的接口

或者选择在数据库上保存也能够的，看我的选择

数据只有文字，可是在地图上展现须要用到经纬度，为了方便处理，我使用了腾讯地图的数据云建立数据接口，能够在数据云上像数据库那样保存地点并查询调用

只须要提交地址（注意拼接城市名和区名，提升转换的准确度）便可自动转换为坐标并新建数据，数据处理的后端代码： github

若是数据保存在本身的数据库中则可使用地址解析接口把地址转换为地图坐标后存入本身的数据库

全部数据都提交以后能够在控制台看到这个效果

前端

数据处理完以后就是在前端展现数据了，这里依然是使用腾讯的地图

也能够选择高德地图或者百度地图，可是要注意不一样地图使用的坐标格式不同，若是是在腾讯地图上获取的坐标要在百度地图上用就须要坐标转换

网页加载地图完成以后调用后端接口获取数据，并计算距离后在网页上展现出来

这一块并不难，并且我作的比较简陋，因此花的时间大多在数据处理上

同时也要在地图上使用标记点标记地点，这样比较直观

后端

后端我使用的是php环境，须要调用接口获取在数据准备时保存的数据，我使用的是数据云的区域搜索接口，能够按区县来对刚刚保存了的数据进行搜索

php搜索数据的代码

<?php $lng = $_GET['lng']; //参数传入用户当前坐标 $lat = $_GET['lat']; //这里是由于须要在地图上展现当前位置，可是GPS获取的是GPS坐标，须要把GPS坐标转换为腾讯地图用的坐标格式 if($_GET['action']){ echo curl_get("https://apis.map.qq.com/ws/coord/v1/translate?locations=$lat,$lng&type=1&key=地图的key"); die(); } //area是区县名，用于区域搜索，若是不传入则为在城市内搜索 $area = $_GET['area']; echo curl_get("https://apis.map.qq.com/place_cloud/search/region?table_id=数据准备时新建表的id&key=地图的key&region=广州市,$area&filter=x.area=$area&orderby=distance($lat,$lng)"); 复制代码

数据提交的代码

<?php //area为区县，list为区县内的列表 $data = [ ["area"=>"增城区","list"=>["新塘镇富丽园二街","位置二"]] ["area"=>"白云区","list"=>["黄石街白云尚城","黄石花园"]] ]; //转为数据云所需数据的格式 $newDataList = []; foreach ($data as $area){ foreach ($area['list'] as $location){ $newDataList[] = ["title"=>trim($location),"address"=>"广州市".$area["area"].trim($location),"x"=>["area"=>$area["area"]]]; } } $result = curl_post("https://apis.map.qq.com/place_cloud/data/create",json_encode(["key"=>"地图的key","table_id"=>"数据准备时新建表的id","data"=>$newDataList])); echo($result); 复制代码

若是是使用数据库上的，能够在保存数据时加上区县的字段用于搜索

其实整个网页基本上没有技术含量，可是数据处理上要有点耐心，你们若是有更方便的方法但愿能够分享一下