import nextTick from "dai-js/tools/nextTick"; // 封装了地图相关函数,兼容天地图、腾讯地图常用api export default function init(ele, position, params) { const mapType = typeof window.TMap !== "undefined" ? "qq" : "td"; this.mapType = mapType; this.map = null; this.marker = null; this.markers = null; this.getCenter = function () { return { lat: 0, lng: 0, }; }; this.setCenter = function (lat, lng) {}; this.setMarker = function (lat, lng) {}; this.getAddress = async function (lat, lng) {}; this.searchNearby = async function (keyword) {}; this.on = function (eventType, fn) {}; const QQMap = window.TMap; const TDMap = window.T; let { latitude, longitude } = position; if (!latitude || latitude == "" || latitude == "0") { latitude = 39.9088810666821; longitude = 116.39743841556731; } if (mapType == "qq") { let center = new QQMap.LatLng(latitude, longitude); this.map = new QQMap.Map(ele, { center, ...params, }); this.markers = new QQMap.MultiMarker({ map: map, geometries: [], }); this.getCenter = function () { const center = this.map.getCenter(); const lat = center.getLat(); const lng = center.getLng(); return { lat, lng }; }; this.setCenter = function (lat, lng) { this.map.setCenter(new QQMap.LatLng(lat, lng)); }; this.setMarker = function (lat, lng) { this.markers.setGeometries([]); this.markers.add([ { id: "4", styleId: "marker", position: new QQMap.LatLng(lat, lng), properties: { title: "marker4", }, }, ]); }; this.geocoder = new QQMap.service.Geocoder(); // 新建一个正逆地址解析类 this.getAddress = async function (lat, lng) { return new Promise((reslove) => { this.geocoder .getAddress({ location: new QQMap.LatLng(lat, lng) }) // 将给定的坐标位置转换为地址 .then((result) => { reslove({ msg: "success", data: { address: result.result.address, }, }); }) .catch((error) => { reslove({ msg: "failed", error, }); }); }); }; this.search = new QQMap.service.Search(this.map, { pageSize: 10 }); this.searchNearby = async function (keyword) { return new Promise((reslove) => { this.search .searchNearby({ keyword, radius: 1000, autoExtend: true, center: this.map.getCenter(), }) .then((result) => { let { data } = result; if (Array.isArray(data) && data.length > 0) { const { location: { lat, lng, address }, } = data[0]; this.setCenter(lat, lng); this.setMarker(lat, lng); reslove({ msg: "success", data: { lng, lat, address, }, }); } else { reslove({ msg: "failed", error: "未检索到相关位置坐标", }); } }) .catch((error) => { reslove({ msg: "failed", error, }); }); }); }; this.on = function (eventType, fn) { this.map.on(eventType, fn); }; } else { if (typeof ele == "string") { ele = document.getElementById("app"); } let width = ele.offsetWidth; let height = ele.offsetHeight; if (height == 0) { ele.style.height = width * 0.5 + "px"; } let center = new TDMap.LngLat(longitude, latitude); this.map = new TDMap.Map(ele, { center, ...params, }); this.getCenter = function () { const center = this.map.getCenter(); const lat = center.getLat(); const lng = center.getLng(); return { lat, lng }; }; this.setCenter = function (lat, lng) { this.map.panTo(new TDMap.LngLat(lng, lat)); }; this.setMarker = function (lat, lng) { let lnglat = new TDMap.LngLat(lng, lat); if (!this.marker) { this.marker = new TDMap.Marker(lnglat, {}); this.map.addOverLay(this.marker); } else { this.marker.setLngLat(lnglat); } }; this.geocoder = new TDMap.Geocoder(); // 新建一个正逆地址解析类 this.getAddress = async function (lat, lng) { return new Promise((reslove) => { this.geocoder.getLocation(new TDMap.LngLat(lng, lat), (result) => { if (result) { console.log("this.geocoder.getLocation", result); let status = result.getStatus(); reslove({ msg: "success", data: { address: result.getAddress(), }, }); } else { reslove({ msg: "failed", error: "解析失败", }); } }); }); }; this.search = new TDMap.LocalSearch(this.map, { pageCapacity: 10 }); this.searchNearby = async function (keyword) { return new Promise(async (reslove) => { this.search.setQueryType(1); this.search.searchNearby(keyword, this.map.getCenter(), 1000000000); await nextTick(1000); const result = this.search.getResults(); const data = result ? result.getPois() : null; console.log("检索结果", data); if (Array.isArray(data) && data.length > 0) { const { lonlat, address, name } = data[0]; const lng = lonlat.split(" ")[0]; const lat = lonlat.split(" ")[1]; this.setCenter(lat, lng); this.setMarker(lat, lng); reslove({ msg: "success", data: { lng, lat, address: address + name, }, }); } else { reslove({ msg: "failed", error: "未检索到相关位置坐标", }); } }); }; this.on = function (eventType, fn) { if (eventType == "panend") { this.map.on("dragend", fn); } else { this.map.on(eventType, fn); } }; } return this; }