wuhongjian
/
hi-ucs
1
0
Fork 0
Code Issues Pull Requests Projects Releases 10 Wiki Activity

西海岸视频地图图标点击切换方式修改

This commit is contained in:
unknown 2022-10-19 17:10:48 +08:00
parent 4e271b6aa7
commit 02d70b4b8d
2 changed files with 2043 additions and 2025 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

200
front/src/supermap/advance-init.js
View File

@ -33,7 +33,12 @@ const SuperMap = window.SuperMap || {}
let isLocated = true let isLocated = true
let polylineArr = [] let polylineArr = []
let PolygonArr = [] let PolygonArr = []
/** const restoreIconObj = {
layerId: 0,
restoreIcon: null,
currentLayer: null,
}
/**
* 地图功能接口类 * 地图功能接口类
* 说明：该类中的方法带“_”为对外暴露的方法，调用时去掉“_”；不带“_”的为内部方法，不可调用。 * 说明：该类中的方法带“_”为对外暴露的方法，调用时去掉“_”；不带“_”的为内部方法，不可调用。
* @param mapObj {Object} 设置全局参数对象 * @param mapObj {Object} 设置全局参数对象
@ -68,7 +73,7 @@ export function MapFun(mapObj) {
* 根据图层名移除图层 * 根据图层名移除图层
* @param layerName {String} 图层名 * @param layerName {String} 图层名
*/ */
const _removeLayerByLayerName = function (layerName) { const _removeLayerByLayerName = function(layerName) {
const layer = layerGroup.get(layerName) const layer = layerGroup.get(layerName)
// const feature = featureGroup; // const feature = featureGroup;
// map.popupclose(); // map.popupclose();
@ -89,7 +94,7 @@ export function MapFun(mapObj) {
* 清空地图（除去底图） * 清空地图（除去底图）
* @private * @private
*/ */
const _clearAllLayers = function () { const _clearAllLayers = function() {
// debugger; // debugger;
map.closePopup() map.closePopup()
featureGroup.clearLayers() featureGroup.clearLayers()
@ -99,14 +104,14 @@ export function MapFun(mapObj) {
* 关闭所有地图弹窗 * 关闭所有地图弹窗
* @private * @private
*/ */
const _closeAllPopup = function (feature) { const _closeAllPopup = function(feature) {
map.closePopup() map.closePopup()
} }
/** /**
* 添加地图弹窗 * 添加地图弹窗
* @private * @private
*/ */
const _openPopup = function (feature) { const _openPopup = function(feature) {
// debugger; // debugger;
// const elementHtml = createAddressPopup(feature) // const elementHtml = createAddressPopup(feature)
L.popup({ className: 'epidemic-popup' }) L.popup({ className: 'epidemic-popup' })
@ -118,7 +123,7 @@ export function MapFun(mapObj) {
* 添加视频监控平台地图弹窗 * 添加视频监控平台地图弹窗
* @private * @private
*/ */
const _openPopupVideoSurveillance = function (feature) { const _openPopupVideoSurveillance = function(feature) {
// debugger // debugger
if (feature.type == 'cameraTree') { if (feature.type == 'cameraTree') {
const elementHtml = createCameraDetailsPop(feature) const elementHtml = createCameraDetailsPop(feature)
@ -150,7 +155,7 @@ export function MapFun(mapObj) {
* 根据图层名数组移除图层 * 根据图层名数组移除图层
* @param layerNameArray {Array} 图层名 * @param layerNameArray {Array} 图层名
*/ */
const _removeLayersByLayerNameArray = function (layerNameArray) { const _removeLayersByLayerNameArray = function(layerNameArray) {
layerNameArray.forEach((layerName) => { layerNameArray.forEach((layerName) => {
const layer = layerGroup.get(layerName) const layer = layerGroup.get(layerName)
if (layer) { if (layer) {
@ -167,7 +172,7 @@ export function MapFun(mapObj) {
* 根据图层名数组移除图层 * 根据图层名数组移除图层
* @param layerNameArray {Array} 图层名 * @param layerNameArray {Array} 图层名
*/ */
const _addMovingMarker = function (arrList) { const _addMovingMarker = function(arrList) {
var polyline1 = L.polyline(arrList).addTo(map) var polyline1 = L.polyline(arrList).addTo(map)
var decorator = L.polylineDecorator(polyline1, { var decorator = L.polylineDecorator(polyline1, {
patterns: [ patterns: [
@ -180,16 +185,13 @@ export function MapFun(mapObj) {
// myMovingMarker.start() // myMovingMarker.start()
var polygin = L.motion var polygin = L.motion
.polyline( .polyline(
arrList, arrList, {
{
color: 'transparent', color: 'transparent',
}, }, {
{
auto: true, auto: true,
duration: 53000, duration: 53000,
easing: L.Motion.Ease.easeInOutQuart, easing: L.Motion.Ease.easeInOutQuart,
}, }, {
{
removeOnEnd: true, removeOnEnd: true,
showMarker: true, showMarker: true,
icon: L.divIcon({ icon: L.divIcon({
@ -226,7 +228,7 @@ export function MapFun(mapObj) {
* 根据marker获取弹窗信息，只弹出基本信息（直接弹出） * 根据marker获取弹窗信息，只弹出基本信息（直接弹出）
* @param markerGroup {Object} 图层组 * @param markerGroup {Object} 图层组
* */ * */
const markerPopup = function (markerGroup) { const markerPopup = function(markerGroup) {
const layers = markerGroup._layers const layers = markerGroup._layers
for (const index in layers) { for (const index in layers) {
const contentHTML = _createPopupConfigInfo( const contentHTML = _createPopupConfigInfo(
@ -242,7 +244,7 @@ export function MapFun(mapObj) {
* 展示普通图层 * 展示普通图层
* @param callBackFun {Function} 回调函数对象 * @param callBackFun {Function} 回调函数对象
*/ */
const _showStaticLayer = function (callBackFun) { const _showStaticLayer = function(callBackFun) {
callBackFun() callBackFun()
} }
/** /**
@ -326,7 +328,7 @@ export function MapFun(mapObj) {
}) })
L.supermap L.supermap
.queryService(queryUrl) .queryService(queryUrl)
.queryBySQL(sqlParam, function (serviceResult) { .queryBySQL(sqlParam, function(serviceResult) {
console.log('serviceResult', serviceResult.result) console.log('serviceResult', serviceResult.result)
if (serviceResult.result.recordsets[0].features.features.length === 0) { if (serviceResult.result.recordsets[0].features.features.length === 0) {
let marker = {} let marker = {}
@ -405,10 +407,10 @@ export function MapFun(mapObj) {
[e.layer._latlng.lat, e.layer._latlng.lng], [e.layer._latlng.lat, e.layer._latlng.lng],
options options
).addTo(mapObj.map) ).addTo(mapObj.map)
layer.on('moveend', function (e) { layer.on('moveend', function(e) {
callback(e) callback(e)
}) })
layer.on('click', function (e) { layer.on('click', function(e) {
layer.remove() layer.remove()
mapObj.drawMarker.enable() mapObj.drawMarker.enable()
}) })
@ -443,7 +445,7 @@ export function MapFun(mapObj) {
// 最大宽度，判断每行字符串，超过按照最大宽度设定 // 最大宽度，判断每行字符串，超过按照最大宽度设定
let contentWidth = 0 let contentWidth = 0
// 累加行数，计算每行宽度 // 累加行数，计算每行宽度
const calc = function (str) { const calc = function(str) {
const tempLength = const tempLength =
getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10 getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
if (tempLength >= 450) { if (tempLength >= 450) {
@ -502,11 +504,12 @@ export function MapFun(mapObj) {
/** /**
* 取消扎点回调 * 取消扎点回调
*/ */
const resetMarkerCallBack = function () { const resetMarkerCallBack = function() {
_removeLayerByLayerName('drawMarkerLayer') _removeLayerByLayerName('drawMarkerLayer')
layerGroup.delete('drawMarkerLayer') layerGroup.delete('drawMarkerLayer')
mapObj.drawMarker.enable() mapObj.drawMarker.enable()
} }
function _addImgMaker(latLng, inconConfig) { function _addImgMaker(latLng, inconConfig) {
const icon = MapStyle.featureIcon(inconConfig) const icon = MapStyle.featureIcon(inconConfig)
const markerLayer = L.marker([latLng.lat, latLng.lng], { const markerLayer = L.marker([latLng.lat, latLng.lng], {
@ -566,7 +569,7 @@ export function MapFun(mapObj) {
// 最大宽度，判断每行字符串，超过按照最大宽度设定 // 最大宽度，判断每行字符串，超过按照最大宽度设定
let contentWidth = 0 let contentWidth = 0
// 累加行数，计算每行宽度 // 累加行数，计算每行宽度
const calc = function (str) { const calc = function(str) {
const tempLength = const tempLength =
getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10 getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
if (tempLength >= 450) { if (tempLength >= 450) {
@ -620,7 +623,7 @@ export function MapFun(mapObj) {
} else if (mapType === 'dark') { } else if (mapType === 'dark') {
tileMapUrl = _mapConfig.config.TITLE_LAYER_DARK.mapUrl tileMapUrl = _mapConfig.config.TITLE_LAYER_DARK.mapUrl
} }
mapObj.map.eachLayer(function (layer) { mapObj.map.eachLayer(function(layer) {
if (layer.tempIndex === -1) { if (layer.tempIndex === -1) {
mapObj.map.removeLayer(layer) mapObj.map.removeLayer(layer)
L.supermap.tiledMapLayer(tileMapUrl).addTo(mapObj.map) L.supermap.tiledMapLayer(tileMapUrl).addTo(mapObj.map)
@ -636,7 +639,7 @@ export function MapFun(mapObj) {
const config = _mapConfig.config.TILEDCONFIG[mapType] const config = _mapConfig.config.TILEDCONFIG[mapType]
const layerConfig = { url: config.tiledUrl, name: config.tiledName } const layerConfig = { url: config.tiledUrl, name: config.tiledName }
const newTileLayer = new L.tileLayer.baidu(layerConfig) const newTileLayer = new L.tileLayer.baidu(layerConfig)
mapObj.map.eachLayer(function (layer) { mapObj.map.eachLayer(function(layer) {
if (layer.options.tms === true) { if (layer.options.tms === true) {
mapObj.map.removeLayer(layer) mapObj.map.removeLayer(layer)
newTileLayer.addTo(mapObj.map) newTileLayer.addTo(mapObj.map)
@ -652,11 +655,10 @@ export function MapFun(mapObj) {
* @param callBackInClick {function} 点击图标时执行的函数 * @param callBackInClick {function} 点击图标时执行的函数
* @param className {String} 样式字符串 * @param className {String} 样式字符串
*/ */
const _addFeatureArrayOnMap = function ( const _addFeatureArrayOnMap = function(
layerName, layerName,
features, features,
layerConfigInfo, layerConfigInfo, { callBackInClick = null, className = '' } = {}
{ callBackInClick = null, className = '' } = {}
) { ) {
const layers = [] const layers = []
features.forEach((feature) => { features.forEach((feature) => {
@ -666,7 +668,7 @@ export function MapFun(mapObj) {
attribution: feature, attribution: feature,
}) })
markerLayer.layerConfigInfo = layerConfigInfo markerLayer.layerConfigInfo = layerConfigInfo
markerLayer.on('click', function (e) { markerLayer.on('click', function(e) {
const layerConfigInfo = e.sourceTarget.layerConfigInfo const layerConfigInfo = e.sourceTarget.layerConfigInfo
const location = [e.latlng.lat, e.latlng.lng] const location = [e.latlng.lat, e.latlng.lng]
const latlng = L.latLng(location) const latlng = L.latLng(location)
@ -701,12 +703,11 @@ export function MapFun(mapObj) {
* @param popupType {String} 弹窗类型 * @param popupType {String} 弹窗类型
* @param className {String} class名字 * @param className {String} class名字
*/ */
const _addTheOneFeatureOnMapByPoint = function ( const _addTheOneFeatureOnMapByPoint = function(
layerName, layerName,
point, point,
data, data,
layerConfigInfo, layerConfigInfo, { popupFlag = true, popupType = 'general', className = '' } = {}
{ popupFlag = true, popupType = 'general', className = '' } = {}
) { ) {
// 创建marker图层，绑定要素 // 创建marker图层，绑定要素
// debugger; // debugger;
@ -734,7 +735,7 @@ export function MapFun(mapObj) {
if (popupFlag) { if (popupFlag) {
markerLayer.bindPopup(elementHtml, { className: className }).openPopup() markerLayer.bindPopup(elementHtml, { className: className }).openPopup()
} else { } else {
markerLayer.on('click', function () { markerLayer.on('click', function() {
L.popup({ className: className }) L.popup({ className: className })
.setLatLng(latLng) .setLatLng(latLng)
.setContent(elementHtml) .setContent(elementHtml)
@ -753,8 +754,7 @@ export function MapFun(mapObj) {
* */ * */
function _locationAndCreatePopup( function _locationAndCreatePopup(
layer, layer,
contentHTML, contentHTML, { className = '' } = {}
{ className = '' } = {}
) { ) {
// 生成弹窗内容 // 生成弹窗内容
const latLng = layer.getLatLng() const latLng = layer.getLatLng()
@ -789,7 +789,7 @@ export function MapFun(mapObj) {
const icon = MapStyle.featureIcon(inconConfig) const icon = MapStyle.featureIcon(inconConfig)
const markerLayer = L.marker(point, { icon: icon }) const markerLayer = L.marker(point, { icon: icon })
markers.addLayer(markerLayer) markers.addLayer(markerLayer)
markerLayer.on('click', function () { markerLayer.on('click', function() {
console.log('积水点播放视频', item) console.log('积水点播放视频', item)
item.indexCode = item.indexCode || item.index_code item.indexCode = item.indexCode || item.index_code
const params = [item.indexCode] const params = [item.indexCode]
@ -815,8 +815,7 @@ export function MapFun(mapObj) {
function _showLayersByUuidArray( function _showLayersByUuidArray(
uuidArray, uuidArray,
layerName, layerName,
configInfo, configInfo, {
{
outFeaturesCallBack = null, outFeaturesCallBack = null,
getLayerPopupInfo = null, getLayerPopupInfo = null,
getStoragePopupInfo = null, getStoragePopupInfo = null,
@ -858,13 +857,12 @@ export function MapFun(mapObj) {
outFeaturesCallBack(serviceResult, layerName, entityList, configInfo) outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
} }
const resultLayerConfig = L.geoJSON( const resultLayerConfig = L.geoJSON(
serviceResult.result.recordsets[0].features, serviceResult.result.recordsets[0].features, {
{
onEachFeature: (feature, layer) => { onEachFeature: (feature, layer) => {
layer.setIcon(MapStyle.featureIcon(configInfo, { zoom: map._zoom })) layer.setIcon(MapStyle.featureIcon(configInfo, { zoom: map._zoom }))
layer.title = layerName layer.title = layerName
layer.configInfo = configInfo layer.configInfo = configInfo
layer.on('click', function (e) { layer.on('click', function(e) {
// const uuid = e.sourceTarget.feature.properties.UUID; // const uuid = e.sourceTarget.feature.properties.UUID;
const uuid = const uuid =
e.sourceTarget.feature.properties[ e.sourceTarget.feature.properties[
@ -922,8 +920,7 @@ export function MapFun(mapObj) {
function _showCameraByIndexCodeArray( function _showCameraByIndexCodeArray(
cameraIndexCode, cameraIndexCode,
layerName, layerName,
configInfo, configInfo, {
{
getLayerPopupInfo = null, getLayerPopupInfo = null,
outFeaturesCallBack = null, outFeaturesCallBack = null,
entityList = null, entityList = null,
@ -963,7 +960,7 @@ export function MapFun(mapObj) {
}) })
L.supermap L.supermap
.queryService(queryUrl) .queryService(queryUrl)
.queryBySQL(reservoirParam, function (serviceResult) { .queryBySQL(reservoirParam, function(serviceResult) {
// if (serviceResult.result.recordsets[0].features.features.length === 0) { // if (serviceResult.result.recordsets[0].features.features.length === 0) {
// console.log('未查询到视频'); // console.log('未查询到视频');
// return; // return;
@ -973,15 +970,14 @@ export function MapFun(mapObj) {
outFeaturesCallBack(serviceResult, layerName, entityList, configInfo) outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
} }
const searchCameraLayer = L.geoJSON( const searchCameraLayer = L.geoJSON(
serviceResult.result.recordsets[0].features, serviceResult.result.recordsets[0].features, {
{
onEachFeature: (feature, layer) => { onEachFeature: (feature, layer) => {
layer.setIcon(MapStyle.featureIcon(configInfo)) layer.setIcon(MapStyle.featureIcon(configInfo))
layer.configInfo = configInfo layer.configInfo = configInfo
// 给查询出的每一个点添加点击弹窗事件 // 给查询出的每一个点添加点击弹窗事件
// 绑定弹窗事件，实时请求弹窗内容 // 绑定弹窗事件，实时请求弹窗内容
if (getLayerPopupInfo !== null) { if (getLayerPopupInfo !== null) {
layer.on('click', function (e) { layer.on('click', function(e) {
const indexCode = const indexCode =
e.sourceTarget.feature.properties[ e.sourceTarget.feature.properties[
_convertCaseOfAttributes('CAMERA_INDEX_CODE') _convertCaseOfAttributes('CAMERA_INDEX_CODE')
@ -1036,8 +1032,7 @@ export function MapFun(mapObj) {
* @private * @private
*/ */
function _addressMatchCode( function _addressMatchCode(
address, address, {
{
fromIndex = null, fromIndex = null,
toIndex = null, toIndex = null,
filters = null, filters = null,
@ -1057,7 +1052,7 @@ export function MapFun(mapObj) {
}) })
L.supermap L.supermap
.addressMatchService(_mapConfig.config.POI_URL) .addressMatchService(_mapConfig.config.POI_URL)
.code(geoCodeParam, function (addressObj) { .code(geoCodeParam, function(addressObj) {
if (outAddressCallBack) { if (outAddressCallBack) {
outAddressCallBack(addressObj, param) outAddressCallBack(addressObj, param)
} }
@ -1275,6 +1270,7 @@ export function MapFun(mapObj) {
// featureGroup.addLayer(polyline); // featureGroup.addLayer(polyline);
// featureGroup.addTo(map); // featureGroup.addTo(map);
} }
function _removerPolyline() { function _removerPolyline() {
if (polylineArr && polylineArr.length > 0) { if (polylineArr && polylineArr.length > 0) {
polylineArr.map((item) => { polylineArr.map((item) => {
@ -1497,16 +1493,15 @@ export function MapFun(mapObj) {
parameter: analystParameter, parameter: analystParameter,
}) })
const myIcon = L.icon({ const myIcon = L.icon({
iconUrl: iconUrl: './src/assets/common/multiScreen/mapTools/ambulance_map_standby.png',
'./src/assets/common/multiScreen/mapTools/ambulance_map_standby.png',
iconSize: [35, 35], iconSize: [35, 35],
}) })
// 进行查找 todo // 进行查找 todo
findPathService.findPath(findPathParameter, function (serviceResult) { findPathService.findPath(findPathParameter, function(serviceResult) {
console.log('serviceResult', serviceResult) console.log('serviceResult', serviceResult)
const result = serviceResult.result const result = serviceResult.result
console.log(result) console.log(result)
result.pathList.map(function (result) { result.pathList.map(function(result) {
const pathRouteLayer = L.geoJSON(result.route) const pathRouteLayer = L.geoJSON(result.route)
// const pathGuideLayer = L.geoJSON(result.pathGuideItems, { // const pathGuideLayer = L.geoJSON(result.pathGuideItems, {
// pointToLayer: function (geoPoints, latlng) { // pointToLayer: function (geoPoints, latlng) {
@ -1546,8 +1541,7 @@ export function MapFun(mapObj) {
* @private * @private
*/ */
function _addressMatchCodeByAmap( function _addressMatchCodeByAmap(
address, address, {
{
city = '青岛', city = '青岛',
pageSize = 100, pageSize = 100,
pageIndex = 1, pageIndex = 1,
@ -1555,13 +1549,13 @@ export function MapFun(mapObj) {
param = null, param = null,
} = {} } = {}
) { ) {
AMap.plugin('AMap.PlaceSearch', function () { AMap.plugin('AMap.PlaceSearch', function() {
var placeSearch = new AMap.PlaceSearch({ var placeSearch = new AMap.PlaceSearch({
city: city, city: city,
pageSize: pageSize, pageSize: pageSize,
pageIndex: pageIndex, pageIndex: pageIndex,
}) })
placeSearch.search(address, function (status, result) { placeSearch.search(address, function(status, result) {
console.log(result) console.log(result)
if (outAddressCallBack) { if (outAddressCallBack) {
outAddressCallBack(result, param) outAddressCallBack(result, param)
@ -1582,8 +1576,7 @@ export function MapFun(mapObj) {
* @private * @private
*/ */
function _queryLayersBySql( function _queryLayersBySql(
configInfo, configInfo, {
{
sql = 'SMID >0', sql = 'SMID >0',
callBackFun = null, callBackFun = null,
callBackParams = null, callBackParams = null,
@ -1606,14 +1599,13 @@ export function MapFun(mapObj) {
} }
if (layerName) { if (layerName) {
const resultLayerConfig = L.geoJSON( const resultLayerConfig = L.geoJSON(
serviceResult.result.recordsets[0].features, serviceResult.result.recordsets[0].features, {
{
onEachFeature: (feature, layer) => { onEachFeature: (feature, layer) => {
layer.setIcon(MapStyle.featureIcon(configInfo)) layer.setIcon(MapStyle.featureIcon(configInfo))
layer.title = layerName layer.title = layerName
layer.configInfo = configInfo layer.configInfo = configInfo
// 绑定弹窗事件，实时请求弹窗内容 // 绑定弹窗事件，实时请求弹窗内容
layer.on('click', function (e) { layer.on('click', function(e) {
if (!getLayerPopupInfo) { if (!getLayerPopupInfo) {
const uuid = const uuid =
e.sourceTarget.feature.properties[ e.sourceTarget.feature.properties[
@ -1650,10 +1642,10 @@ export function MapFun(mapObj) {
* @return {*} 创建的图标，用来删除 * @return {*} 创建的图标，用来删除
* @private * @private
*/ */
const _addPointOnMap = function (paramObject) { const _addPointOnMap = function(paramObject) {
return addPointOnMap(paramObject, mapObj, featureGroup, layerGroup) return addPointOnMap(paramObject, mapObj, featureGroup, layerGroup)
} }
const _addResourceOnMapWithoutSuperMapCluster = function ( const _addResourceOnMapWithoutSuperMapCluster = function(
features, features,
url, url,
layerName, layerName,
@ -1683,8 +1675,11 @@ export function MapFun(mapObj) {
// }) // })
// } // }
_removeLayerByLayerName(layerName) //_removeLayerByLayerName(layerName)
let layers = null let clickReplaceIcon = true;
let selectedLayerList = [];
let selectedLayerId = [];
let layers = null;
// 判断是否是聚合图层 // 判断是否是聚合图层
layers = createMarkerClusterLayer() layers = createMarkerClusterLayer()
const icon1 = createDefaultFeatureStyle({ const icon1 = createDefaultFeatureStyle({
@ -1697,14 +1692,16 @@ export function MapFun(mapObj) {
}) })
features.map((feature) => { features.map((feature) => {
var bounds = map.getBounds() var bounds = map.getBounds()
// console.log("看看有没有坐标",feature.latLng); //console.log("看看有没有坐标", feature);
if ( feature.hasOwnProperty('latLng')) { if (feature.hasOwnProperty('latLng')) {
let icon = feature.active?icon2:icon1 //let icon = feature.active ? icon2 : icon1;
let icon = icon1;
restoreIconObj.restoreIcon = icon;
const marker = L.marker(feature.latLng, { icon }) const marker = L.marker(feature.latLng, { icon })
if (createPopupFun !== null) { if (createPopupFun !== null) {
marker.uuid = feature.uuid || '' marker.uuid = feature.uuid || ''
marker.resId = feature.resId || '' marker.resId = feature.resId || ''
marker.on('click', async (e) => { marker.on('click', async(e) => {
if (feature.resourceName === 'video') { if (feature.resourceName === 'video') {
const params = [feature.indexCode] const params = [feature.indexCode]
DS.openVideo(params) DS.openVideo(params)
@ -1733,9 +1730,31 @@ export function MapFun(mapObj) {
} }
}) })
} }
marker.on('click', e=>{ marker.on('click', e => {
console.log('点位数据', e) console.log('点位数据', e) //需要调用视频播放的窗口吗？
// 判断是否需要选中之后更换marker的图标
//const layers = layerGroup.get(layerName).getLayers()
// layers.forEach((layer) => {
// layer.setIcon(icon)
// })
restoreIconObj.layerId = e.sourceTarget._leaflet_id
const currentLayer = layerGroup
.get(layerName)
.getLayer(restoreIconObj.layerId)
restoreIconObj.currentLayer = currentLayer;
if (currentLayer._icon.src != icon.options.iconUrl) {
currentLayer.setIcon(icon);
} else {
selectedLayerList.push(currentLayer);
//要去重去重,//判断是否点击第二次
if (selectedLayerList.length > 0) {
selectedLayerList.forEach((item) => {
item.setIcon(
L.icon({ iconUrl: require('./image/' + url2), iconSize: [33, 33] })
)
});
}
}
mybus.emit('pointMarkerClick', feature) mybus.emit('pointMarkerClick', feature)
}) })
layers.addLayer(marker) layers.addLayer(marker)
@ -1747,7 +1766,7 @@ export function MapFun(mapObj) {
/** /**
* 点击展示弹窗 * 点击展示弹窗
*/ */
const _addPopOnMap = function (feature, url, layerName, createPopupFun) { const _addPopOnMap = function(feature, url, layerName, createPopupFun) {
console.log( console.log(
'addPopOnMap===============>', 'addPopOnMap===============>',
feature, feature,
@ -1797,7 +1816,7 @@ export function MapFun(mapObj) {
* @returns {Promise<any>} * @returns {Promise<any>}
* @private * @private
*/ */
const _createPromiseByQueryService = function ( const _createPromiseByQueryService = function(
idArray, idArray,
layerConfigInfo, layerConfigInfo,
type type
@ -1811,10 +1830,10 @@ export function MapFun(mapObj) {
* @return {*} * @return {*}
* @private * @private
*/ */
const _addResourceOnMap = function (paramObject) { const _addResourceOnMap = function(paramObject) {
return addResourceOnMap(paramObject, mapObj, featureGroup, layerGroup) return addResourceOnMap(paramObject, mapObj, featureGroup, layerGroup)
} }
const _addResourceOnMapNew = function ( const _addResourceOnMapNew = function(
features, features,
config, config,
getLayerPopupInfo, getLayerPopupInfo,
@ -1830,7 +1849,7 @@ export function MapFun(mapObj) {
layerGroup layerGroup
) )
} }
const _getLayerPopupInfo = function ( const _getLayerPopupInfo = function(
uuid, uuid,
layerConfigInfo, layerConfigInfo,
type, type,
@ -1850,7 +1869,7 @@ export function MapFun(mapObj) {
popupClassName popupClassName
) )
} }
const _addResourceOnMapWithoutSuperMap = function ( const _addResourceOnMapWithoutSuperMap = function(
features, features,
url, url,
layerName, layerName,
@ -1870,7 +1889,7 @@ export function MapFun(mapObj) {
map map
) )
} }
const _addPointsToMap = function ( const _addPointsToMap = function(
features, features,
url, url,
layerName, layerName,
@ -1890,7 +1909,7 @@ export function MapFun(mapObj) {
map map
) )
} }
const _addResourceOnMapWithoutSuper = function ( const _addResourceOnMapWithoutSuper = function(
features, features,
url, url,
layerName, layerName,
@ -1910,7 +1929,7 @@ export function MapFun(mapObj) {
map map
) )
} }
const _addPolygonToMap = function (a, b, c, d) { const _addPolygonToMap = function(a, b, c, d) {
var polygon = L.polygon([a, b, c, d], { var polygon = L.polygon([a, b, c, d], {
color: '#A33B42', color: '#A33B42',
fillColor: '#A75A81', fillColor: '#A75A81',
@ -1918,7 +1937,7 @@ export function MapFun(mapObj) {
}) })
featureGroup.addLayer(polygon) featureGroup.addLayer(polygon)
} }
const _addNameToMap = function (config) { const _addNameToMap = function(config) {
// you can set .my-div-icon styles in CSS // you can set .my-div-icon styles in CSS
config.map((item) => { config.map((item) => {
var myIcon = L.divIcon({ html: item.name }) var myIcon = L.divIcon({ html: item.name })
@ -1927,7 +1946,7 @@ export function MapFun(mapObj) {
) )
}) })
} }
const _addMountainToMap = function (config) { const _addMountainToMap = function(config) {
// you can set .my-div-icon styles in CSS // you can set .my-div-icon styles in CSS
const myIcon = L.icon({ const myIcon = L.icon({
iconUrl: '/src/supermap/image/mountain.png', iconUrl: '/src/supermap/image/mountain.png',
@ -1940,7 +1959,7 @@ export function MapFun(mapObj) {
}).addTo(mapObj.map) }).addTo(mapObj.map)
}) })
} }
const _addMountainLayerToMap = function (config) { const _addMountainLayerToMap = function(config) {
var myStyle = { var myStyle = {
color: 'green', color: 'green',
weight: 2, weight: 2,
@ -1964,18 +1983,18 @@ export function MapFun(mapObj) {
// L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(mapObj.map); // L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(mapObj.map);
// }); // });
} }
const _addCircleToMap = function (latLng, r) { const _addCircleToMap = function(latLng, r) {
// L.circle([latLng.lat, latLng.lng], { radius: r }).addTo(mapObj.map) // L.circle([latLng.lat, latLng.lng], { radius: r }).addTo(mapObj.map)
const polygon = L.circle([latLng.lat, latLng.lng], { radius: r }) const polygon = L.circle([latLng.lat, latLng.lng], { radius: r })
polygon.addTo(map) polygon.addTo(map)
PolygonArr.push(polygon) PolygonArr.push(polygon)
} }
const _mapPainyEnable = function () { const _mapPainyEnable = function() {
map.MapPaint.enable() map.MapPaint.enable()
map.addControl(new MapPaint.SwitchControl()) map.addControl(new MapPaint.SwitchControl())
} }
// 热力图 // 热力图
const _thermodynamic = function (latLng, r, type) { const _thermodynamic = function(latLng, r, type) {
// const layers = [] // const layers = []
// latLng, r, strong // latLng, r, strong
const thermodynamic = latLng const thermodynamic = latLng
@ -1997,7 +2016,7 @@ export function MapFun(mapObj) {
layerGroup.set(type, heatLayer) layerGroup.set(type, heatLayer)
// debugger // debugger
} }
const _addPathToMap = function (latLng, color) { const _addPathToMap = function(latLng, color) {
// console.log(latLng) // console.log(latLng)
// debugger // debugger
const polyline = L.polyline(latLng, { color: color }) const polyline = L.polyline(latLng, { color: color })
@ -2065,8 +2084,7 @@ export function MapFun(mapObj) {
openPopupVideoSurveillance: _openPopupVideoSurveillance, openPopupVideoSurveillance: _openPopupVideoSurveillance,
closeAllPopup: _closeAllPopup, closeAllPopup: _closeAllPopup,
addMovingMarker: _addMovingMarker, addMovingMarker: _addMovingMarker,
addResourceOnMapWithoutSuperMapCluster: addResourceOnMapWithoutSuperMapCluster: _addResourceOnMapWithoutSuperMapCluster,
_addResourceOnMapWithoutSuperMapCluster,
addPopOnMap: _addPopOnMap, addPopOnMap: _addPopOnMap,
addDynamicMapLayer: _addDynamicMapLayer, addDynamicMapLayer: _addDynamicMapLayer,
addPointsToMap: _addPointsToMap, addPointsToMap: _addPointsToMap,

4
front/src/views/home/videoSurveillance/index.vue
View File

@ -177,7 +177,7 @@
} }
} }
} }
this.addResourceTomap('videoMap', this.pointAllData); //this.addResourceTomap('videoMap', this.pointAllData);
}) })
}, },
methods: { methods: {
@ -477,7 +477,7 @@
} }
}) })
} }
console.log('上图数据', dataEvent) console.log('点击后上上图数据', dataEvent)
this.getMapPoint(dataEvent, 'icon_camare.png', type) this.getMapPoint(dataEvent, 'icon_camare.png', type)
}, },
getMapPoint(data, img, type) { getMapPoint(data, img, type) {