Skip to content

H
holo-web
Commit 1a93e18f authored by ninglx's avatar ninglx
Browse files
Options

mapbox初步迁移mine map

parent 013daa15
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 574 additions and 355 deletions
wj-manage-web/public/index.html
View file @ 1a93e18f
......@@ -22,6 +22,23 @@
href="/cdn/libs/mapbox-gl-draw/mapbox-gl-draw.css"
type="text/css"
/>
<link rel="stylesheet" href="//119.163.106.187:11080/minemapapi/v2.1.0/minemap.css">
<script src="//119.163.106.187:11080/minemapapi/v2.1.0/minemap.js"></script>
<script>
/**
* 全局参数设置
*/
minemap.domainUrl = '//119.163.106.187:11080';
minemap.dataDomainUrl = '//119.163.106.187:11080';
minemap.serverDomainUrl = '//119.163.106.187:11080';
minemap.spriteUrl = '//119.163.106.187:11080/minemapapi/v2.1.0/sprite/sprite';
minemap.serviceUrl = '//119.163.106.187:11080/service/';
/**
* key、solution设置
*/
minemap.key = 'fe874f67b89d4c0dab56780f8423324c';
minemap.solution = 12612;
</script>
<style>
#app,
html,
......@@ -87,7 +104,8 @@
max-width: unset !important;
}
.mapboxgl-popup-content {
.minemap-popup-content {
overflow: unset !important;
background: transparent !important;
box-shadow: none !important;
padding: 0 !important;
......@@ -97,31 +115,31 @@
display: none !important;
}
.mapboxgl-popup-tip {
.minemap-popup-tip {
display: none !important;
}
.mapboxgl-popup-close-button {
.minemap-popup-close-button {
font-size: 26px;
color: white;
}
.vehicleDetailPopup .mapboxgl-popup-close-button {
.vehicleDetailPopup .minemap-popup-close-button {
right: 14px;
top: 18px;
}
.eventPopup .mapboxgl-popup-close-button {
.eventPopup .minemap-popup-close-button {
right: 8px;
top: 10px;
}
.equipmentPopup .mapboxgl-popup-close-button {
.equipmentPopup .minemap-popup-close-button {
right: 8px;
top: 10px;
}
.mapboxgl-ctrl-logo {
.minemap-ctrl-logo {
display: none !important;
}
......
wj-manage-web/src/components/Standard/cameraVideo.vue
View file @ 1a93e18f
......@@ -137,6 +137,7 @@ export default {
</script>
<style>
video {
object-fit: fill;
width: 100% !important;
height: 100% !important;
}
......
wj-manage-web/src/components/Standard/mapMapbox.vue
View file @ 1a93e18f
......@@ -5,6 +5,8 @@
</template>
<script>
import {initWMap} from "@/utils/mapUtils";
let map;
// Point MultiPoint LineString MultiLineString Polygon MultiPolygon
export default {
......@@ -26,19 +28,19 @@ export default {
if(this.$store.state.mapInit.zoom){
zoom = this.$store.state.mapInit.zoom
}
let options = Object.assign(
{},
{
container: this.mapId,
style: map_config.MAP_STYLE,
center: center,
zoom: zoom,
maxZoom: map_config.MAX_ZOOM,
pitch: map_config.MAP_PITCH,
},
option
);
map = new mapboxgl.Map(options);
// let options = Object.assign(
// {},
// {
// container: this.mapId,
// style: map_config.MAP_STYLE,
// center: center,
// zoom: zoom,
// maxZoom: map_config.MAX_ZOOM,
// pitch: map_config.MAP_PITCH,
// },
// option
// );
map = initWMap(this.mapId, center, zoom);
return map;
},
destroyMap() {
......
wj-manage-web/src/utils/mapUtils.js 0 → 100644
View file @ 1a93e18f
const PI = Math.PI
const a = 6378245.0
const ee = 0.00669342162296594323
export function initWMap(id,center,zoom) {
let map = new minemap.Map({
container: id,
// style: '//119.163.106.187:11080/service/solu/style/id/12612', /*白色底图样式*/
style: '//119.163.106.187:11080/service/solu/style/id/12620', /*蓝色底图样式*/
center: center || map_config.MAP_CENTER,
zoom: zoom || map_config.MAP_ZOOM,
pitch: map_config.MAP_PITCH,
// maxZoom: map_config.MAX_ZOOM, /*地图最大缩放等级*/
maxZoom: 17.8, /*地图最大缩放等级*/
minZoom: 3, /*地图最小缩放等级*/
projection: 'MERCATOR'
});
return map
}
export function mDrawLine(id, jsonData, item) {
let res = []
for (let a1 of jsonData) {
res.push(wgs84togcj02(a1[0], a1[1]))
}
let geo = turf.lineString(res, item)
!window.wmap.getSource(id) && window.wmap.addSource(id, {
"type": "geojson",
"data": geo
});
!window.wmap.getLayer(id) && window.wmap.addLayer({
"id": id,
"type": "line",
"source": id,
"layout": {
"line-join": "round",
"line-cap": "round",
// "border-visibility":"visible" //是否开启线边框
},
"paint": {
"line-width": 2,
"line-color": '#389fff',
'line-dasharray': [1, 4],
// {
// "type": "categorical",
// "property": "kind",
// "stops": [[1, "#ff0000"], [2, "#00ff00"]],
// "default": "#ff0000"
// },
"line-border-width": 0, //设置线边框宽度
"line-border-opacity": 1, //设置线边框透明度
"line-border-color": 'blue' //设置线边框颜色
},
// "minzoom": 7,
// "maxzoom": 17.5
});
}
export function mDrawPolygon(id, jsonData, item, callback) {
let res = [[]]
for (let a2 of jsonData) {
for (let a1 of a2) {
res[0].push(wgs84togcj02(a1[0], a1[1]))
}
}
let geo = turf.polygon(res, item)
!window.wmap.getSource(id) && window.wmap.addSource(id, {
"type": "geojson",
"data": geo
});
!window.wmap.getLayer(id) && window.wmap.addLayer({
"id": id,
"type": "fill",
"source": id,
"layout": {
"visibility": "visible",
},
"paint": {
"fill-color": "#12a3cd",
"fill-opacity": 0.3,
"fill-outline-color": "rgba(1,1,1,0)"
},
// "minzoom": 7,
// "maxzoom": 17.5
});
window.wmap.on('click', id, () => {
callback(item)
})
}
// icon-image : mapImage
export function mDrawIconPoint(id, jsonData, callback) {
let features = []
for (let pointItem of jsonData) {
let convertPoint = wgs84togcj02(pointItem.lng, pointItem.lat)
features.push(turf.point(convertPoint, pointItem))
}
let geo = turf.featureCollection(features)
!window.wmap.getSource(id) && window.wmap.addSource(id, {
"type": "geojson",
"data": geo
});
!window.wmap.getLayer(id) && window.wmap.addLayer({
"id": id,
"type": "symbol",
"source": id,
"layout": {
'icon-allow-overlap':true,
'icon-ignore-placement':true,
'icon-offset':[0,-20],
"icon-image": ["get",'mapImage'],
"icon-size": 1,
'symbol-z-order':'viewport-y'
}
});
if(callback){
window.wmap.on('click',id,(abc)=>{
callback(abc)
})
}
}
export function wgs84togcj02(lng, lat) {
var dlat = transformlat(lng - 105.0, lat - 35.0)
var dlng = transformlng(lng - 105.0, lat - 35.0)
var radlat = lat / 180.0 * PI
var magic = Math.sin(radlat)
magic = 1 - ee * magic * magic
var sqrtmagic = Math.sqrt(magic)
dlat = (dlat * 180.0) / ((a * (1 - ee)) / (magic * sqrtmagic) * PI)
dlng = (dlng * 180.0) / (a / sqrtmagic * Math.cos(radlat) * PI)
const mglat = lat + dlat
const mglng = lng + dlng
return [mglng, mglat]
}
function transformlat(lng, lat) {
var ret = -100.0 + 2.0 * lng + 3.0 * lat + 0.2 * lat * lat + 0.1 * lng * lat + 0.2 * Math.sqrt(Math.abs(lng))
ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(lat * PI) + 40.0 * Math.sin(lat / 3.0 * PI)) * 2.0 / 3.0
ret += (160.0 * Math.sin(lat / 12.0 * PI) + 320 * Math.sin(lat * PI / 30.0)) * 2.0 / 3.0
return ret
}
function transformlng(lng, lat) {
var ret = 300.0 + lng + 2.0 * lat + 0.1 * lng * lng + 0.1 * lng * lat + 0.1 * Math.sqrt(Math.abs(lng))
ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(lng * PI) + 40.0 * Math.sin(lng / 3.0 * PI)) * 2.0 / 3.0
ret += (150.0 * Math.sin(lng / 12.0 * PI) + 300.0 * Math.sin(lng / 30.0 * PI)) * 2.0 / 3.0
return ret
}
\ No newline at end of file
wj-manage-web/src/utils/mapboxTools.js
View file @ 1a93e18f
// Function to create a triangle icon (arrow)
function createTriangleIcon(color) {
const canvas = document.createElement("canvas");
......@@ -208,6 +207,7 @@ export function addOrUpdateDetetorA(map, geo) {
);
}
}
export function addOrUpdateDetetorB(map, geo) {
if (!map.getSource("detetorsB")) {
map.addSource("detetorsB", {
......@@ -240,6 +240,7 @@ export function addOrUpdateDetetorB(map, geo) {
);
}
}
export function addOrUpdateDetetorC(map, geo) {
if (!map.getSource("detetorsC")) {
map.addSource("detetorsC", {
......@@ -316,7 +317,7 @@ export function addOrUpdateRoadVector(map) {
export function addOrUpdateWave(map, geo) {
if (map.getSource("dot-point")) {
map.getSource("dot-point").setData(geo);
} else {
map.addSource("dot-point", {
type: "geojson",
......@@ -340,8 +341,9 @@ export function addOrUpdateWave(map, geo) {
map.moveLayer("vehicleSelectWave", "vehiclePic");
}
}
}
export function convertPointsToGeo(arr) {
let features = []
for (let item of arr) {
......@@ -349,6 +351,7 @@ export function convertPointsToGeo(arr) {
}
return turf.featureCollection(features)
}
export function convertPointsLocationToGeo(arr) {
let features = []
for (let item of arr) {
......@@ -356,13 +359,15 @@ export function convertPointsLocationToGeo(arr) {
}
return turf.featureCollection(features)
}
export function convertPointsLngLatToGeo(arr) {
let features = []
for (let item of arr) {
features.push(turf.point([item.lng, item.lat], item))
features.push(turf.point(wgs84togcj02([item.lng, item.lat]), item))
}
return turf.featureCollection(features)
}
export function convertPointsWktToGeo(arr) {
let features = [];
for (let item of arr) {
......@@ -370,28 +375,30 @@ export function convertPointsWktToGeo(arr) {
if (item.wkt.split(",").length === 2) {
features.push(
turf.point(
item.wkt.split(",").map((item) => Number(item)),
wgs84togcj02(item.wkt.split(",").map((item) => Number(item))),
item
)
);
}
}
}
return turf.featureCollection(features);
return turf.featureCollection(features)
}
export function convertToLineWithWkt(json) {
let features = [];
for (let item of json) {
if (item.wkt) {
let lnglats = item.wkt.split(";");
let lnglats = wgs84togcj02(item.wkt.split(";"));
for (let i = 0; i < lnglats.length; i++) {
lnglats[i] = lnglats[i].split(",").map((j) => Number(j));
}
features.push(turf.lineString(lnglats, item));
}
}
return turf.featureCollection(features);
return turf.featureCollection(features)
}
// type 4 种颜色 对应 4种告警信息
export function addOrUpdateWarningWave(map, arr, id) {
let geo = convertPointsToGeo(arr)
......@@ -460,7 +467,7 @@ export function addOrUpdateVehicle(map, arr) {
// 路口icon
export function addOrUpdateCross(map, geo, callback) {
console.log('cross geo...', geo)
if (!map.getSource("holo_crossPoint")) {
map.addSource("holo_crossPoint", {
type: "geojson",
......@@ -693,6 +700,7 @@ export function addOrUpdateEquipMilli(map, geo, callback) {
'milli',
"milliFalse",
], // 默认值，如果没有匹配到上述枚举值]
'icon-offset':[0,-20],
// "icon-image": "milli",
"icon-size": 0.6,
"icon-ignore-placement": true,
......@@ -717,6 +725,7 @@ export function addOrUpdateEquipRadar(map, geo, callback) {
type: "symbol",
source: "radar",
layout: {
'icon-offset':[0,-20],
"icon-image": [
"match",
["get", "status"], // 属性字段名称
......@@ -750,6 +759,7 @@ export function addOrUpdateEquipSignal(map, geo, callback) {
type: "symbol",
source: "signal",
layout: {
'icon-offset':[0,-20],
// "icon-image": "signal",
"icon-image": [
"match",
......@@ -783,6 +793,7 @@ export function addOrUpdateEquipWeather(map, geo, callback) {
type: "symbol",
source: "weather",
layout: {
'icon-offset':[0,-20],
// "icon-image": "weather",
"icon-image": [
"match",
......@@ -1048,14 +1059,14 @@ export function addOrUpdateFlowLineRText(map, geo) {
}
// 分析报告 - 流量线箭头
export function addOrUpdateFlowLineRArrow(map, points) {
export function addOrUpdateFlowLineRArrow(map, geo) {
if (!map.getSource("flowLineArrowR")) {
map.addSource('flowLineArrowR', {
type: 'geojson',
data: points
data: geo
});
} else {
map.getSource("flowLineArrowR").setData(points);
map.getSource("flowLineArrowR").setData(geo);
}
if (!map.getLayer("flowLineArrowR")) {
// console.log('has.............');
......@@ -1120,7 +1131,7 @@ export function addOrUpdateFlowLineArrow(map, json) {
turf.point(item.lineArray[1])
);
features.push(
turf.point([item.endLng, item.endLat], { ...item, angle: angle })
turf.point(wgs84togcj02([item.endLng, item.endLat]), {...item, angle: angle})
);
}
}
......@@ -1158,7 +1169,7 @@ export function addOrUpdateFlowText(map, json) {
let features = [];
for (let item of json) {
if (item.select) {
features.push(turf.point([item.startLng, item.startLat], item));
features.push(turf.point(wgs84togcj02([item.startLng, item.startLat]), item));
}
}
let geo = turf.featureCollection(features);
......@@ -1195,7 +1206,7 @@ export function addOrUpdateFlowTextEnd(map, json) {
let features = [];
for (let item of json) {
if (item.select) {
features.push(turf.point([item.endLng, item.endLat], item));
features.push(turf.point(wgs84togcj02([item.endLng, item.endLat]), item));
}
}
let geo = turf.featureCollection(features);
......@@ -1226,6 +1237,7 @@ export function addOrUpdateFlowTextEnd(map, json) {
});
}
}
// let roadLineGeo = null, roadChunkPointGeo = null
// export function addCalibrationTail(map) {
// // 计算1米在当前地图的经度度数
......@@ -1359,7 +1371,7 @@ export function addCalibrationTail(map) {
res.json().then((data) => {
console.log("data...", data);
roadLineGeo = data.roadLineGeo;
roadChunkPointGeo = data.roadChunkPointGeo;
roadChunkPointGeo = data.roadChunkPointGeo
map.addSource("calibrationTail", {
type: "geojson",
data: roadLineGeo,
......@@ -1478,3 +1490,39 @@ export const vehicleWave = {
return true;
},
};
const PI = Math.PI
const a = 6378245.0
const ee = 0.00669342162296594323
export function wgs84togcj02([lng, lat]) {
lng = Number(lng)
lat = Number(lat)
var dlat = transformlat(lng - 105.0, lat - 35.0)
var dlng = transformlng(lng - 105.0, lat - 35.0)
var radlat = lat / 180.0 * PI
var magic = Math.sin(radlat)
magic = 1 - ee * magic * magic
var sqrtmagic = Math.sqrt(magic)
dlat = (dlat * 180.0) / ((a * (1 - ee)) / (magic * sqrtmagic) * PI)
dlng = (dlng * 180.0) / (a / sqrtmagic * Math.cos(radlat) * PI)
const mglat = lat + Number(dlat)
const mglng = lng + Number(dlng)
return [mglng, mglat]
}
function transformlat(lng, lat) {
var ret = -100.0 + 2.0 * lng + 3.0 * lat + 0.2 * lat * lat + 0.1 * lng * lat + 0.2 * Math.sqrt(Math.abs(lng))
ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(lat * PI) + 40.0 * Math.sin(lat / 3.0 * PI)) * 2.0 / 3.0
ret += (160.0 * Math.sin(lat / 12.0 * PI) + 320 * Math.sin(lat * PI / 30.0)) * 2.0 / 3.0
return ret
}
function transformlng(lng, lat) {
var ret = 300.0 + lng + 2.0 * lat + 0.1 * lng * lng + 0.1 * lng * lat + 0.1 * Math.sqrt(Math.abs(lng))
ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(lng * PI) + 40.0 * Math.sin(lng / 3.0 * PI)) * 2.0 / 3.0
ret += (150.0 * Math.sin(lng / 12.0 * PI) + 300.0 * Math.sin(lng / 30.0 * PI)) * 2.0 / 3.0
return ret
}
wj-manage-web/src/views/analysis/reportCross.vue
View file @ 1a93e18f
......@@ -179,7 +179,7 @@ import Pigination from "../../components/Standard/pigination.vue";
import Reports from "./historyReports/index.vue";
import {
addOrUpdateCross,
addOrUpdateCrossName,
addOrUpdateCrossName, wgs84togcj02,
} from "../../utils/mapboxTools";
import { generateReport } from "../../dao/analysis";
......@@ -191,7 +191,6 @@ export default {
Pigination,
Reports,
},
computed: {},
data() {
return {
formOptions: "",
......@@ -468,7 +467,7 @@ export default {
for (let item of this.$store.state.dicts.CrossInfo) {
points.push(
turf.point(
[item.location.split(",")[0], item.location.split(",")[1]],
wgs84togcj02(item.location.split(",")),
item
)
);
......@@ -483,7 +482,7 @@ export default {
},
crossClick(e) {
let prop = e.features[0]?.properties;
map.flyTo({ center: prop.location.split(","), zoom: 19 });
map.flyTo({ center: wgs84togcj02(prop.location.split(",")), zoom: 17.8 });
},
},
beforeDestroy() {
......
wj-manage-web/src/views/efficiency/leftMap.vue
View file @ 1a93e18f
......@@ -4,75 +4,75 @@
<div class="msg_card_inner">
<div class="left_search">
<el-input
style="background-color: transparent"
placeholder="请输入路口名称"
@input="filterCrossTable"
v-model="crossName"
:maxlength='64'
style="background-color: transparent"
placeholder="请输入路口名称"
@input="filterCrossTable"
v-model="crossName"
:maxlength='64'
>
<template slot="prepend"><i class="el-icon-search"></i></template>
</el-input>
</div>
<div class="left_table">
<el-table
@row-click="rowClick"
style="width: 100%;"
height="100%"
v-loading="tableLoading"
element-loading-text="数据加载中..."
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
ref="multipleTable"
:row-class-name="getRowClassName"
:data="tableData"
class="track-result-table"
cell-class-name="custom-table-cell"
header-row-class-name="custom-table-header"
header-cell-class-name="custom-table-header-cell"
@row-click="rowClick"
style="width: 100%;"
height="100%"
v-loading="tableLoading"
element-loading-text="数据加载中..."
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
ref="multipleTable"
:row-class-name="getRowClassName"
:data="tableData"
class="track-result-table"
cell-class-name="custom-table-cell"
header-row-class-name="custom-table-header"
header-cell-class-name="custom-table-header-cell"
>
<el-table-column align="center" min-width="50" label="排名" sortable prop="rank">
</el-table-column>
<el-table-column
min-width="60"
align="center"
:show-overflow-tooltip="true"
prop="crossName"
label="路口名称"
min-width="60"
align="center"
:show-overflow-tooltip="true"
prop="crossName"
label="路口名称"
>
</el-table-column>
<el-table-column
min-width="60"
sortable
align="center"
:show-overflow-tooltip="true"
prop="efficiencyIndex"
label="效率指数"
min-width="60"
sortable
align="center"
:show-overflow-tooltip="true"
prop="efficiencyIndex"
label="效率指数"
>
</el-table-column>
<el-table-column
min-width="60"
align="center"
sortable
:sort-method="sortByLevel"
:show-overflow-tooltip="true"
label="评价等级"
min-width="60"
align="center"
sortable
:sort-method="sortByLevel"
:show-overflow-tooltip="true"
label="评价等级"
>
<template slot-scope="scope">
{{
scope.row.evaluationGrade === "1"
? "高"
: scope.row.evaluationGrade === "2"
? "中"
: scope.row.evaluationGrade === "3"
? "低"
: ""
? "高"
: scope.row.evaluationGrade === "2"
? "中"
: scope.row.evaluationGrade === "3"
? "低"
: ""
}}
</template>
</el-table-column>
</el-table>
</div>
<div class="left_map">
<w-map ref="mapC" mapId="efficiency_map" />
<w-map ref="mapC" mapId="efficiency_map"/>
</div>
</div>
</msg-card>
......@@ -80,19 +80,20 @@
</template>
<script>
import { getEfficiencyRank } from "../../dao/efficiency";
import {getEfficiencyRank} from "../../dao/efficiency";
import MsgCard from "../../components/Standard/msg-card.vue";
import WMap from "../../components/Standard/mapMapbox.vue";
import mapAssets from "../../config/holo/mapAssets";
import {
addOrUpdateCross,
addOrUpdateCrossName,
wgs84togcj02
} from "../../utils/mapboxTools";
let map;
export default {
name: "leftMap",
components: { WMap, MsgCard },
components: {WMap, MsgCard},
props: {
granularity: {
type: String,
......@@ -125,8 +126,7 @@ export default {
map.on("style.load", () => {
for (let key in mapAssets.mapIcons) {
map.loadImage(mapAssets.mapIcons[key], (error, image) => {
if (!map.hasImage(key)) map.addImage(key, image);
if (!map.hasImage(key)) map.addImage(key, image);
});
}
map.setPitch(0);
......@@ -134,9 +134,9 @@ export default {
let needDicts = ["CrossInfo"];
for (let item of needDicts) {
queue.push(
this.$store.dispatch("QUERY_DICT", {
type: item,
})
this.$store.dispatch("QUERY_DICT", {
type: item,
})
);
}
Promise.all(queue).then(() => {
......@@ -163,7 +163,7 @@ export default {
this.drawCrossPoint();
if (this.tableFullData.length) {
map.flyTo({
center: this.tableFullData[0].location.split(","),
center: wgs84togcj02(this.tableFullData[0].location.split(",")),
zoom: 15,
});
this.$emit("crossChange", this.tableFullData[0]);
......@@ -174,14 +174,14 @@ export default {
drawCrossPoint() {
let geos = this.tableFullData;
if (geos.length) {
map.setCenter(geos[0].location.split(","));
map.setCenter(wgs84togcj02(geos[0].location.split(",")));
}
for (let i = 0; i < geos.length; i++) {
geos[i].isSignal = i ? 1 : "select";
}
let features = [];
for (let cross of geos) {
features.push(turf.point(cross.location.split(","), cross));
features.push(turf.point(wgs84togcj02(cross.location.split(",")), cross));
}
let geo = turf.featureCollection(features);
addOrUpdateCross(map, geo, this.crossClick);
......@@ -221,7 +221,7 @@ export default {
let prop = e.features[0].properties;
this.lastCheck = prop;
this.updateLayer(prop);
map.flyTo({ center: prop.location.split(",") });
map.flyTo({center: prop.location.split(",")});
this.$emit("crossChange", prop);
},
rowClick(row) {
......@@ -249,7 +249,8 @@ export default {
},
},
beforeDestroy() {},
beforeDestroy() {
},
};
</script>
......@@ -258,9 +259,11 @@ export default {
.leftMapEf {
height: 100%;
::v-deep .content {
margin: 20px 0;
}
.msg_card_inner {
height: 100%;
display: flex;
......@@ -284,6 +287,7 @@ export default {
border: 1px solid #193259;
}
}
::v-deep .el-input-group__prepend {
background-color: transparent;
border: 1px solid rgba(25, 58, 110, 1);
......@@ -297,30 +301,37 @@ export default {
font-size: 16px;
font-weight: 500;
}
::v-deep .el-checkbox__inner {
background-color: transparent;
border: 1px solid gray;
}
::v-deep .row-deep-select {
td:first-child {
border-left: 1px solid rgba(31, 147, 255, 1);
}
td:last-child {
border-right: 1px solid rgba(31, 147, 255, 1);
}
td {
background-color: #030d1e;
border-top: 1px solid rgba(31, 147, 255, 1);
border-bottom: 1px solid rgba(31, 147, 255, 1);
}
}
::v-deep .row-not-select {
td:first-child {
border-left: 1px solid rgba(31, 147, 255, 1);
}
td:last-child {
border-right: 1px solid rgba(31, 147, 255, 1);
}
td {
background-color: #061124;
border-top: 1px solid rgba(31, 147, 255, 1);
......
wj-manage-web/src/views/organization/index.vue
View file @ 1a93e18f
......@@ -215,6 +215,7 @@ import {
inletWayTimeBetw,
inletWayTurnTimeBetw,
} from "../../dao/situation";
import {wgs84togcj02} from "../../utils/mapboxTools";
let bottomMap;
export default {
components: {
......@@ -380,7 +381,7 @@ export default {
});
bottomMap.flyTo({
center: row.location.split(","),
center: wgs84togcj02(row.location.split(",")),
maxDuration: 1000,
zoom: 17.2,
pitch: 0,
......@@ -448,11 +449,6 @@ export default {
JSON.stringify(item.properties.ridList) ===
JSON.stringify(prop.ridList)
) {
console.log(
"dengyu ===",
JSON.stringify(item.properties.ridList),
JSON.stringify(prop.ridList)
);
item.properties.select = 1;
let timeParam = this.getStartAndEndDate();
let queue = [];
......
wj-manage-web/src/views/organization/leftMap.vue
View file @ 1a93e18f
......@@ -63,7 +63,7 @@ import { orgRank } from "../../dao/organization";
import mapAssets from "../../config/holo/mapAssets";
import {
addOrUpdateCross,
addOrUpdateCrossName,
addOrUpdateCrossName, wgs84togcj02,
} from "../../utils/mapboxTools";
let map;
......@@ -100,20 +100,11 @@ export default {
}
this.fullData = res.content;
this.tableData = this.fullData;
// this.tableData = [
// {rank:'1'},
// {rank:'1'},
// {rank:'1'},
// {rank:'1'},
// {rank:'1'},
// {rank:'1'},
// {rank:'1'},
// ]
this.tableLoading = false;
// 选中第一条数据， 并请求右侧所有指标
let features = [];
for (let cross of this.fullData) {
features.push(turf.point(cross.location.split(","), cross));
features.push(turf.point(wgs84togcj02(cross.location.split(",")), cross));
}
let geo = turf.featureCollection(features);
addOrUpdateCross(map, geo, this.crossClick);
......@@ -121,7 +112,7 @@ export default {
if (res.content.length) {
this.$emit("crossChange", res.content[0]);
map.flyTo({
center: res.content[0].location.split(","),
center: wgs84togcj02(res.content[0].location.split(",")),
zoom: 15,
});
}
......@@ -161,14 +152,14 @@ export default {
let prop = e.features[0].properties;
this.lastCheck = prop;
this.updateLayer(prop);
map.flyTo({ center: prop.location.split(",") });
map.flyTo({ center: wgs84togcj02(prop.location.split(",")) });
this.$emit("crossChange", prop);
},
rowClick(row) {
this.lastCheck = row;
this.updateLayer(row);
map.flyTo({
center: row.location.split(","),
center: wgs84togcj02(row.location.split(",")),
});
this.$emit("crossChange", row);
},
......
wj-manage-web/src/views/organization/mapConflict.vue
View file @ 1a93e18f
......@@ -28,7 +28,7 @@ let map;
const conflictOptions = ["机非", "人非", "机机", "人机"];
import { orgConflict } from "../../dao/organization";
import wMap from "../../components/Standard/mapMapbox.vue";
import { addOrUpdateEventHeat } from "../../utils/mapboxTools";
import {addOrUpdateEventHeat, wgs84togcj02} from "../../utils/mapboxTools";
export default {
name: "mapConflict",
components: {
......@@ -89,7 +89,7 @@ export default {
convertPointJsonToGeo(array) {
let features = [];
for (let item of array) {
features.push(turf.point([item.lng, item.lat], item));
features.push(turf.point([wgs84togcj02(item.lng, item.lat)], item));
}
return turf.featureCollection(features);
},
......@@ -124,7 +124,7 @@ export default {
},
refreshMapData() {
map.flyTo({
center: this.rowData.location.split(","),
center: wgs84togcj02(this.rowData.location.split(",")),
maxDuration: 1000,
zoom: 17.2,
pitch: 0,
......
wj-manage-web/src/views/organization/mapFlow.vue
View file @ 1a93e18f
......@@ -24,7 +24,7 @@ import {
addOrUpdateFlowLineArrow,
addOrUpdateFlowText,
addOrUpdateFlowTextEnd,
addOrUpdateRoadPolygon,
addOrUpdateRoadPolygon, wgs84togcj02,
} from "../../utils/mapboxTools";
export default {
name: "mapFlow",
......@@ -63,7 +63,7 @@ export default {
// 画车道面和流量曲线和流量值
getCrossPolygon() {
map.flyTo({
center: this.rowData.location.split(","),
center: wgs84togcj02(this.rowData.location.split(",")),
maxDuration: 1000,
zoom: 17.2,
pitch: 0,
......@@ -116,10 +116,10 @@ export default {
let lnglatArray = lane.arcLine.split(";");
let resultPointArray = [];
for (let lnglat of lnglatArray) {
resultPointArray.push([
resultPointArray.push(wgs84togcj02([
Number(lnglat.split(",")[0]),
Number(lnglat.split(",")[1]),
]);
]));
}
singleLane.select = 0;
......
wj-manage-web/src/views/organization/mapTrack.vue
View file @ 1a93e18f
......@@ -13,7 +13,7 @@
<script>
let map;
import wMap from "../../components/Standard/mapMapbox.vue";
import { addOrUpdateTrackPointVector } from "../../utils/mapboxTools";
import {addOrUpdateTrackPointVector, wgs84togcj02} from "../../utils/mapboxTools";
export default {
name: "mapTrack",
components: {
......@@ -51,7 +51,7 @@ export default {
refreshData() {
this.loading = true;
map.flyTo({
center: this.rowData.location.split(","),
center: wgs84togcj02(this.rowData.location.split(",")),
maxDuration: 1000,
zoom: 17.2,
pitch: 0,
......
wj-manage-web/src/views/safety/bottomCameras.vue
View file @ 1a93e18f
......@@ -187,6 +187,7 @@ export default {
}
.video {
object-fit: fill;
width: calc((100% - 40px) / 4);
background-color: #132039;
margin-right: 10px;
......
wj-manage-web/src/views/safety/leftMap.vue
View file @ 1a93e18f
......@@ -84,7 +84,7 @@ import mapAssets from "../../config/holo/mapAssets";
import { safetyRank } from "../../dao/safety";
import {
addOrUpdateCross,
addOrUpdateCrossName,
addOrUpdateCrossName, wgs84togcj02,
} from "../../utils/mapboxTools";
import {
equip_camera,
......@@ -151,7 +151,7 @@ export default {
// 选中第一条数据， 并请求右侧所有指标
let features = [];
for (let cross of this.fullData) {
features.push(turf.point(cross.location.split(","), cross));
features.push(turf.point(wgs84togcj02(cross.location.split(",")), cross));
}
let geo = turf.featureCollection(features);
addOrUpdateCross(map, geo, this.crossClick);
......@@ -162,7 +162,7 @@ export default {
this.cameraList = camera.content
this.$emit("crossChange", res.content[0], this.cameraList);
map.flyTo({
center: res.content[0].location.split(","),
center: wgs84togcj02(res.content[0].location.split(",")),
zoom: 15,
});
});
......
wj-manage-web/src/views/situation/index.vue
View file @ 1a93e18f
This diff is collapsed.
wj-manage-web/src/views/situation/trackSwitcher.vue
View file @ 1a93e18f
......@@ -1078,6 +1078,7 @@ export default {
}
}
.video {
object-fit: fill;
height: calc(100% - 62px);
}
.picker {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment