老产品前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

415 lines
11 KiB

import nextTick from "dai-js/tools/nextTick";
3 years ago
import { requestGet } from "@/js/dai/request";
3 years ago
export const mapType =
typeof window.TMap !== "undefined"
? "qq"
: typeof window.T !== "undefined"
? "td"
: "tdzw";
3 years ago
const urlSdtdt = (() => {
if (window.SITE_CONFIG["nodeEnv"] == "dev_sdtdt") {
return {
search: "https://service.sdmap.gov.cn/search",
geo: "https://service.sdmap.gov.cn/geodecode",
};
} else {
return {
3 years ago
search: "http://172.20.46.177/epmet-map-proxy/QueryService.ashx",
geo: "http://172.20.46.177/epmet-map-proxy/GeoDecodeService.ashx",
3 years ago
};
}
})();
3 years ago
export const QQMap = window.TMap;
export const TDMap = window.T;
export function searchNearby(map, keyword) {
if (mapType == "qq") {
return new Promise((reslove) => {
const search = new QQMap.service.Search(map, { pageSize: 10 });
search
.searchNearby({
keyword,
radius: 1000,
autoExtend: true,
center: map.getCenter(),
})
.then((result) => {
let { data } = result;
if (Array.isArray(data) && data.length > 0) {
const {
location: { lat, lng },
address,
3 years ago
} = data[0];
reslove({
msg: "success",
data: {
lng,
lat,
address,
resultList: data.map((item) => {
item.lonlat = lng + " " + lat;
item.name = item.name || "";
return item;
}),
3 years ago
},
});
} else {
reslove({
msg: "failed",
error: "未检索到相关位置坐标",
});
}
})
.catch((error) => {
reslove({
msg: "failed",
error,
});
});
});
3 years ago
} else if (mapType == "td") {
3 years ago
return new Promise(async (reslove) => {
const search = new TDMap.LocalSearch(map, { pageCapacity: 10 });
search.setQueryType(1);
search.searchNearby(keyword, map.getCenter(), 1000000000);
await nextTick(1000);
const result = 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];
reslove({
msg: "success",
data: {
lng,
lat,
address: address + name,
3 years ago
resultList: data,
3 years ago
},
});
} else {
reslove({
msg: "failed",
error: "未检索到相关位置坐标",
});
}
});
3 years ago
} else if (mapType == "tdzw") {
return new Promise(async (reslove) => {
const center = map.getCenter();
3 years ago
const url = urlSdtdt.search;
3 years ago
const { status, result } = await requestGet(url, {
3 years ago
// area: `CIRCLE(${center.lon} ${center.lat} 1000000)`,
3 years ago
words: keyword,
3 years ago
city: "烟台",
uid: "navinfo",
3 years ago
st: "LocalSearch",
3 years ago
// tk: "e758167d5b90c351b70a979c0820840c",
3 years ago
});
if (
status == "ok" &&
result &&
Array.isArray(result.features) &&
result.features.length > 0
) {
const { lng, lat, address, name } = result.features[0];
reslove({
msg: "success",
data: {
lng,
lat,
address: address + name,
resultList: result.features.map((item) => {
item.lonlat = lng + " " + lat;
item.name = item.name || "";
return item;
}),
3 years ago
},
});
} else {
reslove({
msg: "failed",
error: "未检索到相关位置坐标",
});
}
});
3 years ago
}
}
3 years ago
// 封装了地图相关函数,兼容天地图、腾讯地图常用api
export default function init(ele, position, params) {
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, title) {};
3 years ago
this.getAddress = async function (lat, lng) {};
this.on = function (eventType, fn) {};
let { latitude, longitude } = position;
if (!latitude || latitude == "" || latitude == "0") {
latitude = 39.9088810666821;
longitude = 116.39743841556731;
}
3 years ago
if (mapType != "qq") {
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";
}
}
3 years ago
if (mapType == "qq") {
let center = new QQMap.LatLng(latitude, longitude);
this.map = new QQMap.Map(ele, {
center,
...params,
});
this.markers = new QQMap.MultiMarker({
3 years ago
map: this.map,
3 years ago
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, title = "位置") {
3 years ago
this.markers.setGeometries([]);
this.markers.add([
{
id: "4",
styleId: "marker",
position: new QQMap.LatLng(lat, lng),
properties: {
title,
3 years ago
},
},
]);
};
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.on = function (eventType, fn) {
3 years ago
if (eventType == "dragend") {
this.map.on("moveend", (e) => {
console.log("dragend", e);
if (e && e.originalEvent) {
fn(e);
}
});
} else {
this.map.on(eventType, fn);
}
3 years ago
};
3 years ago
} else if (mapType == "td") {
3 years ago
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, title = "位置") {
3 years ago
let lnglat = new TDMap.LngLat(lng, lat);
if (!this.marker) {
this.marker = new TDMap.Marker(lnglat, {
title,
});
this.map.addOverLay(this.marker);
3 years ago
} else {
this.marker.setLngLat(lnglat);
}
};
this.geocoder = new TDMap.Geocoder(); // 新建一个正逆地址解析类
3 years ago
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: "解析失败",
});
3 years ago
}
});
3 years ago
});
};
this.on = function (eventType, fn) {
3 years ago
if (eventType == "dragend") {
this.map.on("dragend", (e) => {
console.log("dragend", e);
fn(e);
});
3 years ago
} else {
this.map.on(eventType, fn);
}
};
3 years ago
} else if (mapType == "tdzw") {
this.map = new OpenLayers.Map(ele, {
allOverlays: true,
numZoomLevels: 19,
displayProjection: "EPSG:4490",
controls: [
new OpenLayers.Control.Navigation(),
new OpenLayers.Control.ArgParser(),
new OpenLayers.Control.Attribution(),
],
});
this.map.addLayer(new SDTDTLayer());
this.getCenter = function () {
const center = this.map.getCenter();
const lat = center.lat;
const lng = center.lon;
return { lat, lng };
};
this.setCenter = function (lat, lng) {
this.map.setCenter(new OpenLayers.LonLat(lng, lat), 16);
};
this.setCenter(latitude, longitude);
this.setMarker = function (lat, lng, title = "位置") {
if (!this.marker) {
//创建矢量图层
var graphicLayer = new OpenLayers.Layer.Vector("graphicLayer", {
style: OpenLayers.Util.extend(
{},
OpenLayers.Feature.Vector.style["default"]
),
});
this.map.addLayer(graphicLayer);
3 years ago
let pt = new OpenLayers.Geometry.Point(lng, lat);
3 years ago
var style = {
externalGraphic: require("@/assets/img/common/map-poi.png"),
graphicWidth: 32,
graphicHeight: 32,
};
3 years ago
var feature = new OpenLayers.Feature.Vector(pt, null, style);
3 years ago
graphicLayer.addFeatures([feature]);
3 years ago
this.marker = feature;
this.markerLayer = graphicLayer;
3 years ago
} else {
3 years ago
this.marker.geometry.x = lng;
this.marker.geometry.y = lat;
this.markerLayer.redraw();
3 years ago
}
};
this.getAddress = async function (lat, lng) {
return new Promise(async (reslove) => {
3 years ago
const url = urlSdtdt.geo;
3 years ago
const { status, result } = await requestGet(url, {
point: lng + "," + lat,
type: "11",
3 years ago
st: "Rgc2",
output: "json",
// tk: "e758167d5b90c351b70a979c0820840c",
3 years ago
});
if (status == "ok" && result.address) {
reslove({
msg: "success",
data: {
address: result.address,
},
});
} else {
reslove({
msg: "failed",
error: "解析失败",
});
}
});
};
3 years ago
this.on = function (eventType, fn) {
if (eventType == "dragend") {
this.map.events.register("moveend", null, (e) => {
console.log("dragend", e);
fn(e);
});
} else {
this.map.events.register(eventType, null, moveendHandler);
}
};
3 years ago
}
3 years ago
this.searchNearby = async function (keyword) {
const ret = await searchNearby(this.map, keyword);
return ret;
};
3 years ago
return this;
3 years ago
}