|
|
@@ -0,0 +1,511 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div id='map'></div>
|
|
|
+ <div id="position">
|
|
|
+ <div id="zoom">
|
|
|
+ 当前级别 : 6
|
|
|
+ </div>
|
|
|
+ <div id="move">
|
|
|
+ 当前中心点: 纬度:0.00000,经度:0.00000
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <el-radio-group v-model="leavel" @change="setData">-->
|
|
|
+ <!-- <el-radio class="radio" label="100">100Mb</el-radio>-->
|
|
|
+ <!-- <el-radio class="radio" label="250">250Mb</el-radio>-->
|
|
|
+ <!-- <el-radio class="radio" label="500">500Mb</el-radio>-->
|
|
|
+ <!-- <el-radio class="radio" label="1000">1000Mb</el-radio>-->
|
|
|
+ <!-- </el-radio-group>-->
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import bigemap from '@/utils/bigemap/map'
|
|
|
+import Tiff from "tiff.js";
|
|
|
+import axios from "axios";
|
|
|
+
|
|
|
+let map;
|
|
|
+export default {
|
|
|
+ name: "bigeMap",
|
|
|
+ props: {mapValue: Object},
|
|
|
+ watch: {
|
|
|
+ mapValue: {
|
|
|
+ immediate: true,
|
|
|
+ handler(value) {
|
|
|
+ if (value.params !== undefined) {
|
|
|
+ console.log("热力图：" + value)
|
|
|
+ this.mapData = value
|
|
|
+ this.initBigeMap()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ bMap: null,
|
|
|
+ velocityLayer: null,
|
|
|
+ leavel: {},
|
|
|
+ latlngs: [[[0.0, 0.0], [0.0, 0.0]]],
|
|
|
+ cone: {},
|
|
|
+ mTime: null,
|
|
|
+ code: 230000,
|
|
|
+ mapData: {},// 传过来的值
|
|
|
+ href: window.location.href
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initBigeMap() {
|
|
|
+ let _self = this
|
|
|
+ bigemap.then(() => {
|
|
|
+ // window.BM.Config.HTTP_URL = 'http://www.bigemap.com:9000';
|
|
|
+ window.BM.Config.HTTP_URL = 'http://localhost:9000';
|
|
|
+ // arcgis-satellite
|
|
|
+ // amap-satellite
|
|
|
+ // zhongkexingtu
|
|
|
+ // let map = window.BM.map('map', 'bigemap.arcgis-satellite', {
|
|
|
+ let map = window.BM.map('map', 'bigemap.6914xxtx', {
|
|
|
+ center: [30, 104],
|
|
|
+ minZoom: 6,
|
|
|
+ zoom: 11,
|
|
|
+ zoomControl: true,
|
|
|
+ attributionControl: false,
|
|
|
+ preferCanvas: true, //适用于数据量大时 地图反应速度加快
|
|
|
+ });
|
|
|
+ window.Bmap = map;
|
|
|
+
|
|
|
+
|
|
|
+ // 没透明
|
|
|
+ // var offline=window.BM.tileLayer('bigemap.a58a3rnz');
|
|
|
+ // 透明
|
|
|
+ var layer=window.BM.tileLayer('bigemap.ct4z5ch5',{opacity:0.7}).addTo(map).on('load',function (){
|
|
|
+ layer.options.maxNativeZoom=8;
|
|
|
+ layer.options.maxZoom=12;
|
|
|
+ map.setMaxZoom(12);
|
|
|
+ });
|
|
|
+ this.bMap = map;
|
|
|
+ //首尾需要一致
|
|
|
+ let mask = window.BMturf.polygon([[[-180, -90], [180, -90], [180, 90], [-180, 90], [-180, -90]]]);
|
|
|
+ let geo2;
|
|
|
+ fetch('/js/geojson/230000/' + this.code + '.geojson').then(res => res.json()).then(data => {
|
|
|
+ // fetch('/js/geojson/' + this.code + '.geojson').then(res => res.json()).then(data => {
|
|
|
+ geo2 = window.BM.geoJSON(data, {
|
|
|
+ style: function () {
|
|
|
+ return {
|
|
|
+ color: '#ffffff',
|
|
|
+ weight: 3,
|
|
|
+ fillColor: '#ffffff',
|
|
|
+ fillOpacity: 0.1
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onEachFeature: function (feature, layer) {
|
|
|
+ feature.properties && feature.properties.name && layer.bindTooltip(feature.properties.name, {
|
|
|
+ direction: 'bottom',
|
|
|
+ className: 'my_tooltip',
|
|
|
+ permanent: true
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }).on('mouseover', function (e) {
|
|
|
+ e.layer.setStyle({
|
|
|
+ color: '#ffffff',
|
|
|
+ weight: 1,
|
|
|
+ fillColor: 'transparent',
|
|
|
+ fillOpacity: 0.9
|
|
|
+ });
|
|
|
+ }).on('mouseout', function (e) {
|
|
|
+ e.layer.setStyle({
|
|
|
+ color: '#ffffff',
|
|
|
+ weight: 3,
|
|
|
+ fillColor: '#ffffff',
|
|
|
+ fillOpacity: 0.2
|
|
|
+ });
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ window.geo2 = geo2;
|
|
|
+ //限制拖动
|
|
|
+ this.bMap.setMaxBounds(geo2.getBounds());
|
|
|
+ this.bMap.fitBounds(geo2.getBounds());
|
|
|
+
|
|
|
+ const layers = geo2.getLayers();
|
|
|
+ for (const item of layers) {
|
|
|
+ const layer = item.feature;
|
|
|
+ mask = window.BMturf.mask(layer, mask);
|
|
|
+ }
|
|
|
+ window.BM.geoJSON(mask, {
|
|
|
+ color: 'orange',
|
|
|
+ fillColor: '#0A163A',
|
|
|
+ fillOpacity: 0.7
|
|
|
+ }).addTo(this.bMap);
|
|
|
+
|
|
|
+ //初始化热力图
|
|
|
+ // this.setHeatMap(this.bMap);
|
|
|
+ //绑定事件
|
|
|
+ this.bindEvents(this.bMap);
|
|
|
+ if(this.mapData.level !== null){
|
|
|
+ this.bMap.setZoom(this.mapData.level)
|
|
|
+ this.bMap.panTo(this.mapData.center)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ let sIconurl = 'http://'+_self.href.split("//")[1].split("/")[0]+'/largeScreenImg/station.png'
|
|
|
+ let hfSIconurl = 'http://'+_self.href.split("//")[1].split("/")[0]+'/largeScreenImg/huafuStation.png'
|
|
|
+ let pIconurl = 'http://' + _self.href.split("//")[1].split("/")[0] + '/largeScreenImg/project.png'
|
|
|
+ let fjIconurl = 'http://' + _self.href.split("//")[1].split("/")[0] + '/img/fengji.png'
|
|
|
+
|
|
|
+ // 所有场站标记点位
|
|
|
+ if(this.mapData.allStationInfo !== null && this.mapData.allStationInfo !== undefined){
|
|
|
+ let data = this.mapData.allStationInfo
|
|
|
+ let station_icon = window.BM.icon({
|
|
|
+ iconUrl: sIconurl,
|
|
|
+ iconSize: [25, 43],
|
|
|
+ iconAnchor: [25, 43]
|
|
|
+ })
|
|
|
+ let hf_station_icon = window.BM.icon({
|
|
|
+ iconUrl: hfSIconurl,
|
|
|
+ iconSize: [35, 55],
|
|
|
+ iconAnchor: [35, 55]
|
|
|
+ })
|
|
|
+ for(let item of data.otherStation){
|
|
|
+ let coordinate = [Number(item.latitude),Number(item.longitude)]
|
|
|
+ let marker = window.BM.marker(coordinate,{
|
|
|
+ icon: station_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ marker.on('mouseover', function (e) {
|
|
|
+ marker.bindTooltip('<div>场站名称：' + item.stationName + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ })
|
|
|
+ marker.on('mouseout', function () {
|
|
|
+ marker.bindTooltip().closeTooltip();
|
|
|
+ })
|
|
|
+ }
|
|
|
+ for(let item of data.HDStation){
|
|
|
+ let coordinate = [Number(item.latitude),Number(item.longitude)]
|
|
|
+ let marker = window.BM.marker(coordinate,{
|
|
|
+ icon: hf_station_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ marker.on('mouseover', function (e) {
|
|
|
+ marker.bindTooltip('<div>场站名称：' + item.stationName + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ })
|
|
|
+ marker.on('mouseout', function () {
|
|
|
+ marker.bindTooltip().closeTooltip();
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 项目标记点位
|
|
|
+ if (this.mapData.projectInfo !== null && this.mapData.projectInfo !== undefined) {
|
|
|
+ let data = this.mapData.projectInfo
|
|
|
+ let station_icon = window.BM.icon({
|
|
|
+ iconUrl: pIconurl,
|
|
|
+ iconSize: [30, 50],
|
|
|
+ iconAnchor: [30, 50]
|
|
|
+ })
|
|
|
+ for (let item of data) {
|
|
|
+ let coordinate = [Number(item.latitude), Number(item.longitude)]
|
|
|
+ let marker = window.BM.marker(coordinate, {
|
|
|
+ icon: station_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ // 悬浮动作
|
|
|
+ marker.on('mouseover', function (e) {
|
|
|
+ marker.bindTooltip('<div>项目名称：' + item.projectNameEasy + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ })
|
|
|
+ marker.on('mouseout', function () {
|
|
|
+ marker.bindTooltip().closeTooltip();
|
|
|
+ })
|
|
|
+ // 点击动作
|
|
|
+ marker.on('click', function (e) {
|
|
|
+ let project = {id: item.id,projectSort: item.projectName}
|
|
|
+ sessionStorage.setItem("projectInfo", JSON.stringify(project))
|
|
|
+ _self.$store.dispatch('equipmentInfo/projectInfo', JSON.stringify(project))
|
|
|
+ _self.$router.push({path: "/homepage/projectInfo"})
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 华富场站标记点位
|
|
|
+ if (this.mapData.staionInfo !== null && this.mapData.staionInfo !== undefined) {
|
|
|
+ let data = this.mapData.staionInfo
|
|
|
+ let station_icon = window.BM.icon({
|
|
|
+ iconUrl: sIconurl,
|
|
|
+ iconSize: [30, 50],
|
|
|
+ iconAnchor: [30, 50],
|
|
|
+ className:'stationIcon',
|
|
|
+ })
|
|
|
+ for (let item of data) {
|
|
|
+ let coordinate = [Number(item.latitude), Number(item.longitude)]
|
|
|
+ let marker = window.BM.marker(coordinate, {
|
|
|
+ icon: station_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ // 悬浮动作
|
|
|
+ marker.on('mouseover', function (e) {
|
|
|
+ marker.bindTooltip('<div>场站名称：' + item.stationName + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ })
|
|
|
+ marker.on('mouseout', function () {
|
|
|
+ marker.bindTooltip().closeTooltip();
|
|
|
+ })
|
|
|
+ // 点击动作
|
|
|
+ marker.on('click', function (e) {
|
|
|
+ let station = {id: item.id,stationName: item.stationName}
|
|
|
+ sessionStorage.setItem("stationInfo",JSON.stringify(station))
|
|
|
+ _self.$store.dispatch('equipmentInfo/stationInfo',JSON.stringify(station))
|
|
|
+ _self.$router.push({path: "/homepage/stationInfo"})
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 所有风机、塔、拐点标记点位
|
|
|
+ if (this.mapData.allPointInfo !== null && this.mapData.allPointInfo !== undefined) {
|
|
|
+ let data = this.mapData.allPointInfo
|
|
|
+ let station_icon = window.BM.icon({
|
|
|
+ iconUrl: pIconurl,
|
|
|
+ iconSize: [35, 55],
|
|
|
+ iconAnchor: [35, 55],
|
|
|
+ className:'stationIcon',
|
|
|
+ })
|
|
|
+ let fj_icon = window.BM.icon({
|
|
|
+ iconUrl: fjIconurl,
|
|
|
+ iconSize: [30, 30],
|
|
|
+ iconAnchor: [30, 30],
|
|
|
+ className:'stationIcon',
|
|
|
+ })
|
|
|
+ for(let item of data.fan){
|
|
|
+ let coordinate = [Number(item.latitudeFan),Number(item.longitudeFan)]
|
|
|
+ let marker = window.BM.marker(coordinate,{
|
|
|
+ icon: fj_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ }
|
|
|
+ for(let item of data.coordinatesList){
|
|
|
+ if(item.length>0){
|
|
|
+ let latlngs = []
|
|
|
+ for (let coor of item){
|
|
|
+ latlngs.push([Number(coor.latitude),Number(coor.longitude)])
|
|
|
+ window.BM.marker([Number(coor.latitude),Number(coor.longitude)]).addTo(this.bMap);
|
|
|
+ }
|
|
|
+ var polygon = BM.polygon(latlngs).addTo(this.bMap);
|
|
|
+ // 让地图适配当前的线段
|
|
|
+ this.bMap.fitBounds(polygon.getBounds());
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (let item of data.towerList) {
|
|
|
+ let coordinate = [Number(item.latitude), Number(item.longitude)]
|
|
|
+ let marker = window.BM.marker(coordinate, {
|
|
|
+ icon: station_icon,
|
|
|
+ riseOnHover: true
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ // 悬浮动作
|
|
|
+ marker.on('mouseover', function (e) {
|
|
|
+ // console.log(item)
|
|
|
+ if(item.type === 'project'){
|
|
|
+ marker.bindTooltip('<div>项目名称：' + item.projectName + '</div>'+ '<div>测风塔名称：' + item.towerName + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ }else{
|
|
|
+ marker.bindTooltip('<div>场站名称：' + item.stationName + '</div>'+ '<div>测风塔名称：' + item.towerName + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
|
|
|
+ {permanent:true,className:'infoToolTip',offset:[0,-30]}).openTooltip();
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ marker.on('mouseout', function () {
|
|
|
+ marker.bindTooltip().closeTooltip();
|
|
|
+ })
|
|
|
+ // 点击动作
|
|
|
+ marker.on('click', function (e) {
|
|
|
+ if(item.type === 'project'){
|
|
|
+ let project = {projectId:item.projectId,equipmentNo:item.towerNo}
|
|
|
+ sessionStorage.setItem("emailWindTowerInfo", JSON.stringify(project))
|
|
|
+ _self.$store.dispatch('equipmentInfo/emailWindTowerInfo', JSON.stringify(project))
|
|
|
+ _self.$router.push({path: "/homepage/emailResourcesInfo"})
|
|
|
+ }else {
|
|
|
+ let station = {stationId:item.stationId,equipmentNo:item.towerNo}
|
|
|
+ sessionStorage.setItem("realWindTowerInfo", JSON.stringify(station))
|
|
|
+ _self.$store.dispatch('equipmentInfo/realWindTowerInfo', JSON.stringify(station))
|
|
|
+ _self.$router.push({path: "/homepage/realResourcesInfo"})
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /**
|
|
|
+ * 加载实时气象源动画效果
|
|
|
+ fetch("/js/json/wind_data/20230403_00_atmoslev_1000_mb.json")
|
|
|
+ .then((res) => {
|
|
|
+ return res.json();
|
|
|
+ })
|
|
|
+ .then((data) => {
|
|
|
+ this.velocityLayer = window.BM.velocityLayer({
|
|
|
+ displayValues: true,
|
|
|
+ displayOptions: {
|
|
|
+ velocityType: "windy",
|
|
|
+ displayPosition: "topright",
|
|
|
+ displayEmptyString: "没有数据",
|
|
|
+ directionString: "风向",
|
|
|
+ speedString: "速度",
|
|
|
+ },
|
|
|
+ data: data,
|
|
|
+ minVelocity: 0.05,
|
|
|
+ maxVelocity: 10,
|
|
|
+ colorScale: ["red", "green", "yellow", "pink"],
|
|
|
+ velocityScale: 0.02, // default 0.005,
|
|
|
+ });
|
|
|
+ this.velocityLayer.addTo(this.bMmap);
|
|
|
+ });
|
|
|
+ */
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //设置热力图效果
|
|
|
+ setHeatMap(map) {
|
|
|
+ axios.get("/img/heapmap/mean-wind-speed_rendering.tiff", {
|
|
|
+ responseType: "arraybuffer",
|
|
|
+ }).then((res) => {
|
|
|
+ const fr = new FileReader();
|
|
|
+ fr.onloadend = function (e) {
|
|
|
+ var image = new Tiff({buffer: e.target.result});
|
|
|
+ var imageUrl = image.toDataURL(),
|
|
|
+ imageBounds = [
|
|
|
+ [43.422993, 121.183134],
|
|
|
+ [53.564656, 135.091461],
|
|
|
+ ];
|
|
|
+ window.imgOverlay = window.BM.imageOverlay(imageUrl, imageBounds).addTo(map);
|
|
|
+ map.fitBounds(imageBounds);
|
|
|
+ };
|
|
|
+ fr.readAsArrayBuffer(new Blob([res.data]));
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //绑定事件-监听地图级别和拖动
|
|
|
+ bindEvents(map) {
|
|
|
+ map.on('moveend', function (e) {
|
|
|
+ const c = this.getCenter();
|
|
|
+ document.getElementById('move').innerHTML = '当前中心点: 纬度:' + c.lat.toFixed(5) + ',经度:' + c.lng.toFixed(5);
|
|
|
+ });
|
|
|
+ //添加一个缩放事件
|
|
|
+ map.on('zoomend', function (e) {
|
|
|
+ document.getElementById('zoom').innerHTML = '当前级别 : ' + this.getZoom();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ setData(params) {
|
|
|
+ fetch(`/js/json/wind_data/20230403_00_atmoslev_` + params + `_mb.json`)
|
|
|
+ .then((res) => {
|
|
|
+ return res.json();
|
|
|
+ })
|
|
|
+ .then((data) => {
|
|
|
+ this.velocityLayer.options.displayOptions.velocityType = params + `Mb`;
|
|
|
+ this.velocityLayer.setData(data);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ initRegion(code) {
|
|
|
+ sessionStorage.clear();
|
|
|
+ sessionStorage.setItem('latlngs', JSON.stringify(this.latlngs));
|
|
|
+ this.chons(code)
|
|
|
+ },
|
|
|
+ //加载地图方法
|
|
|
+ chons(code) {
|
|
|
+ fetch('/js/geojson/230000/' + code + '.geojson')
|
|
|
+ .then((res) => {
|
|
|
+ return res.json();
|
|
|
+ })
|
|
|
+ .then((data) => {
|
|
|
+ this.cone = this.BM.geoJSON(data, {
|
|
|
+ style: function () {
|
|
|
+ return {
|
|
|
+ color: '#ffffff',
|
|
|
+ fillColor: 'transparent',
|
|
|
+ weight: 1,
|
|
|
+ fillOpacity: 0.9
|
|
|
+ };
|
|
|
+ },
|
|
|
+ }).on('mouseover', function (e) {
|
|
|
+ const rel = e.layer.feature.properties;
|
|
|
+ e.layer.setStyle({
|
|
|
+ color: '#ffffff',
|
|
|
+ fillColor: 'transparent',
|
|
|
+ weight: 3,
|
|
|
+ fillOpacity: 1
|
|
|
+ });
|
|
|
+
|
|
|
+ //显示弹窗信息坐标
|
|
|
+ let x = rel.center['1'];
|
|
|
+ let y = rel.center['0'];
|
|
|
+ let coordinate = [[x, y]];
|
|
|
+
|
|
|
+ //组装参数
|
|
|
+ let adcode = rel.adcode;
|
|
|
+ let name = rel.name;
|
|
|
+ let level = rel.level;
|
|
|
+ let cont =
|
|
|
+ "<div>acode ：" + adcode + "</div>" +
|
|
|
+ "<div>name <span style='margin-left: 2px'>：</span>" + name + "</div>" +
|
|
|
+ "<div>level <span style='margin-left: 7px'>：</span>" + level + "</div>";
|
|
|
+ //显示弹窗
|
|
|
+ if (!e.layer.getPopup()) {
|
|
|
+ e.layer.bindPopup(cont);
|
|
|
+ }
|
|
|
+ e.layer.openPopup();
|
|
|
+ }).on('mouseout', function (e) {
|
|
|
+ e.layer.setStyle({
|
|
|
+ color: '#ffffff',
|
|
|
+ fillColor: 'transparent',
|
|
|
+ weight: 1,
|
|
|
+ fillOpacity: 0.9
|
|
|
+ });
|
|
|
+ // 点击地图区域向下钻取
|
|
|
+ // }).on('click', (e) => {
|
|
|
+ // const rel = e.layer.feature.properties;
|
|
|
+ // const zb = e.layer._bounds;
|
|
|
+ // if (code === rel.adcode) {
|
|
|
+ // return false;
|
|
|
+ // } else {
|
|
|
+ // //定时器
|
|
|
+ // clearTimeout(this.mTime);
|
|
|
+ // this.mTime = setTimeout(() => {
|
|
|
+ // //重新加载
|
|
|
+ // this.chons(rel.adcode);
|
|
|
+ // this.cone.remove();
|
|
|
+ // //临时缓存
|
|
|
+ // sessionStorage.setItem('diqu', JSON.stringify(rel.acroutes));
|
|
|
+ // const latadd = sessionStorage.getItem('latlngs');
|
|
|
+ // const lataddp = JSON.parse(latadd);
|
|
|
+ // lataddp.push([[zb._northEast.lat, zb._northEast.lng], [zb._southWest.lat, zb._southWest.lng]]);
|
|
|
+ // sessionStorage.setItem('latlngs', JSON.stringify(lataddp));
|
|
|
+ // if (lataddp.slice(-1).length !== 0) {
|
|
|
+ // this.bMap.fitBounds(lataddp.slice(-1));
|
|
|
+ // }
|
|
|
+ // }, 300);
|
|
|
+ // }
|
|
|
+ }).addTo(this.bMap);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+.infoToolTip{
|
|
|
+ color: white;
|
|
|
+ background: rgba(0, 133, 212, 0.75);
|
|
|
+ border: .5px solid #0085d4;
|
|
|
+}
|
|
|
+
|
|
|
+.my_tooltip{
|
|
|
+ color: #0085d4;
|
|
|
+ background: transparent;
|
|
|
+ border: none;
|
|
|
+ /*font-size: 18px;*/
|
|
|
+}
|
|
|
+.my_tooltip::before{
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style scoped>
|
|
|
+#map {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(90vh);
|
|
|
+}
|
|
|
+
|
|
|
+.bigemap-popup-content-wrapper, .map-legends, .map-tooltip {
|
|
|
+ border-radius: 8px;
|
|
|
+ box-shadow: 5px 5px 5px rgb(0 0 0);
|
|
|
+}
|
|
|
+</style>
|
zy