Merge branch 'main' of http://39.101.188.84:7000/suzhou-jichuang-lanhai/Gyyq-Upstairs
commit
30d814b47d
@ -0,0 +1,153 @@
|
|||||||
|
{
|
||||||
|
"zoom": 13,
|
||||||
|
"center": { "lng": 117.240601, "lat": 31.827107 },
|
||||||
|
"minZoom": 2,
|
||||||
|
"maxZoom": 18,
|
||||||
|
"centerAutoLevel": 15,
|
||||||
|
"control": {
|
||||||
|
"scale": true,
|
||||||
|
"locationBar": {
|
||||||
|
"crs": "CGCS2000_GK_Zone_3",
|
||||||
|
"template": "<div>经度:{lng}</div> <div>纬度:{lat}</div> <div class='hide700'>横{crsx} 纵{crsy}</div> <div>层级:{level}</div>"
|
||||||
|
},
|
||||||
|
"zoom": { "position": "bottomleft" },
|
||||||
|
"toolBar": { "position": "bottomleft" }
|
||||||
|
},
|
||||||
|
"basemaps": [
|
||||||
|
{
|
||||||
|
"id": 10,
|
||||||
|
"name": "地图底图",
|
||||||
|
"type": "group"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "天地图电子",
|
||||||
|
"icon": "img/basemaps/tdt_vec.png",
|
||||||
|
"type": "group",
|
||||||
|
"layers": [
|
||||||
|
{
|
||||||
|
"name": "底图",
|
||||||
|
"type": "tdt",
|
||||||
|
"layer": "vec_d"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "注记",
|
||||||
|
"type": "tdt",
|
||||||
|
"layer": "vec_z"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "天地图卫星",
|
||||||
|
"icon": "img/basemaps/tdt_img.png",
|
||||||
|
"type": "group",
|
||||||
|
"layers": [
|
||||||
|
{
|
||||||
|
"name": "底图",
|
||||||
|
"type": "tdt",
|
||||||
|
"layer": "img_d"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "注记",
|
||||||
|
"type": "tdt",
|
||||||
|
"layer": "img_z"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "天地图地形",
|
||||||
|
"icon": "img/basemaps/tdt_ter.png",
|
||||||
|
"type": "tdt",
|
||||||
|
"layer": "ter",
|
||||||
|
"maxNativeZoom": 14,
|
||||||
|
"errorTileUrl": "img/tile/errortile.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": 2021,
|
||||||
|
"pid": 10,
|
||||||
|
"name": "高德电子",
|
||||||
|
"icon": "img/basemaps/gaode_vec.png",
|
||||||
|
"type": "gaode",
|
||||||
|
"layer": "vec",
|
||||||
|
"show": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "高德卫星",
|
||||||
|
"icon": "img/basemaps/gaode_img.png",
|
||||||
|
"type": "group",
|
||||||
|
"layers": [
|
||||||
|
{
|
||||||
|
"name": "底图",
|
||||||
|
"type": "gaode",
|
||||||
|
"layer": "img_d"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "注记",
|
||||||
|
"type": "gaode",
|
||||||
|
"layer": "img_z"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "腾讯电子",
|
||||||
|
"icon": "/img/basemaps/tencent_vec.png",
|
||||||
|
"type": "tencent",
|
||||||
|
"layer": "vec"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "腾讯影像",
|
||||||
|
"icon": "/img/basemaps/tencent_img.png",
|
||||||
|
"type": "group",
|
||||||
|
"layers": [
|
||||||
|
{ "name": "底图", "type": "tencent", "layer": "img_d" },
|
||||||
|
{ "name": "注记", "type": "tencent", "layer": "img_z" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "ArcGIS电子",
|
||||||
|
"icon": "img/basemaps/esriNationalGeographic.png",
|
||||||
|
"type": "tile",
|
||||||
|
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}",
|
||||||
|
"chinaCRS": "GCJ02"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "ArcGIS影像",
|
||||||
|
"icon": "img/basemaps/esriWorldImagery.png",
|
||||||
|
"type": "arcgis",
|
||||||
|
"url": "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": 2017,
|
||||||
|
"pid": 10,
|
||||||
|
"name": "蓝色地图",
|
||||||
|
"icon": "img/basemaps/bd-c-midnight.png",
|
||||||
|
"type": "gaode",
|
||||||
|
"layer": "vec",
|
||||||
|
"customColor": "#11243C"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "灰色地图",
|
||||||
|
"icon": "img/basemaps/bd-c-grayscale.png",
|
||||||
|
"type": "gaode",
|
||||||
|
"layer": "vec",
|
||||||
|
"customColor": "#575757"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pid": 10,
|
||||||
|
"name": "离线影像(供参考)",
|
||||||
|
"icon": "/img/basemaps/google_img.png",
|
||||||
|
"type": "xyz",
|
||||||
|
"url": "//data.mars3d.cn/tile/img/{z}/{x}/{y}.jpg",
|
||||||
|
"chinaCRS": "GCJ02",
|
||||||
|
"maxZoom": 13
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -0,0 +1,68 @@
|
|||||||
|
<template>
|
||||||
|
<div :id="'map' + withKeyId" class="mars2d-container"></div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import * as mars2d from "mars2d";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
url: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
},
|
||||||
|
withKeyId: {
|
||||||
|
type: String,
|
||||||
|
default: "mars2dMap",
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.initMap();
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
const map = this[`map${this.withKeyId}`];
|
||||||
|
if (map) {
|
||||||
|
map.destroy();
|
||||||
|
delete this[`map${this.withKeyId}`];
|
||||||
|
}
|
||||||
|
console.log(">>>>> 地图卸载完成 >>>>");
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async initMap() {
|
||||||
|
// 获取配置
|
||||||
|
let mapOptions;
|
||||||
|
if (this.url) {
|
||||||
|
// 存在url时才读取
|
||||||
|
mapOptions = await mars2d.Util.fetchJson({ url: this.url });
|
||||||
|
if (mapOptions.map3d) {
|
||||||
|
mapOptions = mapOptions.map3d;
|
||||||
|
}
|
||||||
|
if (this.options) {
|
||||||
|
mapOptions = mars2d.Util.merge(mapOptions, this.options); // 合并配置
|
||||||
|
}
|
||||||
|
} else if (this.options) {
|
||||||
|
mapOptions = this.options;
|
||||||
|
}
|
||||||
|
|
||||||
|
this[`map${this.withKeyId}`] = new mars2d.Map(
|
||||||
|
"map" + this.withKeyId,
|
||||||
|
mapOptions
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$emit("onload", this[`map${this.withKeyId}`]);
|
||||||
|
console.log("Map二维地图构造参数", mapOptions);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style>
|
||||||
|
.mars2d-container {
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue