上海疫情区域查询网站 (上海疫情区域划分等级)
javascript
// script.jsvar map;
var sidebar;
var addressInput;
var resultElement;function initMap() {map = new google.maps.Map(document.getElementById("map"), {zoom: 12,center: { lat: 31.2304, lng: 121.4737 },});sidebar = document.getElementById("sidebar");addressInput = document.getElementById("address");resultElement = document.getElementById("result");var infowindow = new google.maps.InfoWindow();// 加载区域划分数据$.getJSON("data.json", function (data) {for (var i = 0; i < data.length; i++) {var region = data[i];// 创建多边形覆盖物var polygon = new google.maps.Polygon({paths: region.coordinates,strokeColor: getColorByLevel(region.level),strokeOpacity: 0.8,strokeWeight: 2,fillColor: getColorByLevel(region.level),fillOpacity: 0.3,});polygon.setMap(map);// 添加事件监听器polygon.addListener("click", function () {infowindow.setContent(region.name);infowindow.setPosition(this.getCenter());infowindow.open(map);});}});
}function getColorByLevel(level) {switch (level) {case "无风险区域":return "00FF00";case "低风险区域":return "FFFF00";case "中风险区域":return "FF8C00";case "高风险区域":return "FF0000";default:return "FFFFFF";}
}addressInput.addEventListener("keypress", function (event) {if (event.key === "Enter") {var address = addressInput.value;if (address) {resultElement.innerHTML = "正在查询...";geocoder = new google.maps.Geocoder();geocoder.geocode({ address: address }, function (results, status) {if (status === google.maps.GeocoderStatus.OK) {var location = results[0].geometry.location;var latlng = { lat: location.lat(), lng: location.lng() };for (var i = 0; i < data.length; i++) {var region = data[i];if (google.maps.geometry.poly.containsLocation(latlng, region.polygon)) {resultElement.innerHTML =region.name + "：" + region.level + "区域";console.log(region);break;}}} else {resultElement.innerHTML = "找不到该地址";}});}}
});
版权声明
本文仅代表作者观点，不代表上海桑拿立场。
本文系作者授权发表，未经许可，不得转载。
