diff --git a/front/src/supermap/advance-init.js b/front/src/supermap/advance-init.js
index 1ce102db..effa837d 100644
--- a/front/src/supermap/advance-init.js
+++ b/front/src/supermap/advance-init.js
@@ -12,20 +12,20 @@ import { getDoubleCharCount, getSingleCharCount } from '../utils/index'
import data from './json/shanxi_polygon.json'
// 引入生成弹窗的方法
import {
- createSearchAddressTitlePop,
- createCameraDetailsPop,
+ createSearchAddressTitlePop,
+ createCameraDetailsPop,
} from './createMarkerPopup'
// 引入资源上图方法
import {
- addPointOnMap,
- addResourceOnMap,
- addResourceOnMapNew,
- myGetLayerPopupInfo,
- createPromiseByQueryService,
- createMarkerClusterLayer,
- addResourceOnMapWithoutSuperMap,
- addResourceOnMapWithoutSuper,
- addPointsToMap,
+ addPointOnMap,
+ addResourceOnMap,
+ addResourceOnMapNew,
+ myGetLayerPopupInfo,
+ createPromiseByQueryService,
+ createMarkerClusterLayer,
+ addResourceOnMapWithoutSuperMap,
+ addResourceOnMapWithoutSuper,
+ addPointsToMap,
} from './map-showResource'
const L = window.L || {}
@@ -33,2045 +33,2063 @@ const SuperMap = window.SuperMap || {}
let isLocated = true
let polylineArr = []
let PolygonArr = []
-/**
- * 地图功能接口类
- * 说明：该类中的方法带“_”为对外暴露的方法，调用时去掉“_”；不带“_”的为内部方法，不可调用。
- * @param mapObj {Object} 设置全局参数对象
- * @constructor
- */
+const restoreIconObj = {
+ layerId: 0,
+ restoreIcon: null,
+ currentLayer: null,
+ }
+ /**
+ * 地图功能接口类
+ * 说明：该类中的方法带“_”为对外暴露的方法，调用时去掉“_”；不带“_”的为内部方法，不可调用。
+ * @param mapObj {Object} 设置全局参数对象
+ * @constructor
+ */
export function MapFun(mapObj) {
- // 初始化全局变量
- const degreeToMeter = mapObj.DEGGER_TO_METER // degreeToMeter 度与米的换算单位
- const layerGroup = mapObj.layerGroup // 全局图层记录数组
- const featureGroup = mapObj.featureGroup // 全局图层数组
- const map = mapObj.map // 全局地图对象
- const externalFunGlobalObject = {}
+ // 初始化全局变量
+ const degreeToMeter = mapObj.DEGGER_TO_METER // degreeToMeter 度与米的换算单位
+ const layerGroup = mapObj.layerGroup // 全局图层记录数组
+ const featureGroup = mapObj.featureGroup // 全局图层数组
+ const map = mapObj.map // 全局地图对象
+ const externalFunGlobalObject = {}
- // 添加外部注入方法函数
- /**
- * 添加外部注入方法函数
- * @param functionName {Function} 方法名称
- * @param functionObjectName {String} 需要注入的对象名称
- */
- function _addExternalFunToObj(functionName, functionObjectName) {
- externalFunGlobalObject[functionObjectName] = functionName
- }
-
- /**
- * 定义地物编辑服务
- */
- const featureService = L.supermap && L.supermap.featureService && L.supermap.featureService(
- _mapConfig.config.EDITORDATA_URL
- )
-
- /**
- * 根据图层名移除图层
- * @param layerName {String} 图层名
- */
- const _removeLayerByLayerName = function (layerName) {
- const layer = layerGroup.get(layerName)
- // const feature = featureGroup;
- // map.popupclose();
- // debugger;
- console.log('清空图层', layerName)
- if (layer) {
- // 清空layer图层
- map.closePopup()
- featureGroup.removeLayer(layer)
- layer.remove()
- // layer.clearLayers();
- // 从全局记录中删除
- layerGroup.delete(layerName)
- // debugger
+ // 添加外部注入方法函数
+ /**
+ * 添加外部注入方法函数
+ * @param functionName {Function} 方法名称
+ * @param functionObjectName {String} 需要注入的对象名称
+ */
+ function _addExternalFunToObj(functionName, functionObjectName) {
+ externalFunGlobalObject[functionObjectName] = functionName
}
- }
- /**
- * 清空地图（除去底图）
- * @private
- */
- const _clearAllLayers = function () {
- // debugger;
- map.closePopup()
- featureGroup.clearLayers()
- layerGroup.clear()
- }
- /**
- * 关闭所有地图弹窗
- * @private
- */
- const _closeAllPopup = function (feature) {
- map.closePopup()
- }
- /**
- * 添加地图弹窗
- * @private
- */
- const _openPopup = function (feature) {
- // debugger;
- // const elementHtml = createAddressPopup(feature)
- L.popup({ className: 'epidemic-popup' })
- .setLatLng(feature.latLng)
- // .setContent(elementHtml)
- .openOn(map)
- }
- /**
- * 添加视频监控平台地图弹窗
- * @private
- */
- const _openPopupVideoSurveillance = function (feature) {
- // debugger
- if (feature.type == 'cameraTree') {
- const elementHtml = createCameraDetailsPop(feature)
- const arr = [0, 0.0, '', '0', '0.0']
- if (arr.indexOf(feature.data.gpsX) == -1) {
- L.popup({ className: 'List-Details-pop', offset: [168, 200] })
- .setLatLng(feature.latLng)
- .setContent(elementHtml)
- .openOn(map)
- } else {
- L.popup({
- className: 'List-Details-pop',
- offset: [168, 200],
- autoPan: false,
- })
- .setLatLng(map.getCenter())
- .setContent(elementHtml)
- .openOn(map)
- }
- } else {
- const elementHtml = createSearchAddressTitlePop(feature)
- L.popup({ className: 'Address-Title-pop', closeButton: false })
- .setLatLng(feature.latLng)
- .setContent(elementHtml)
- .openOn(map)
- }
- }
- /**
- * 根据图层名数组移除图层
- * @param layerNameArray {Array} 图层名
- */
- const _removeLayersByLayerNameArray = function (layerNameArray) {
- layerNameArray.forEach((layerName) => {
- const layer = layerGroup.get(layerName)
- if (layer) {
- // 清空layer图层
- featureGroup.removeLayer(layer)
- layer.remove()
- // layer.clearLayers();
- // 从全局记录中删除
- layerGroup.delete(layerName)
- }
- })
- }
- /**
- * 根据图层名数组移除图层
- * @param layerNameArray {Array} 图层名
- */
- const _addMovingMarker = function (arrList) {
- var polyline1 = L.polyline(arrList).addTo(map)
- var decorator = L.polylineDecorator(polyline1, {
- patterns: [
- // defines a pattern of 10px-wide dashes, repeated every 20px on the line
- { offset: 0, repeat: 20, symbol: L.Symbol.dash({ pixelSize: 10 }) },
- ],
- }).addTo(map)
- // var myMovingMarker = L.Marker.movingMarker(arrList,
- // [20000]).addTo(map)
- // myMovingMarker.start()
- var polygin = L.motion
- .polyline(
- arrList,
- {
- color: 'transparent',
- },
- {
- auto: true,
- duration: 53000,
- easing: L.Motion.Ease.easeInOutQuart,
- },
- {
- removeOnEnd: true,
- showMarker: true,
- icon: L.divIcon({
- html: "",
- iconSize: L.point(27.5, 24),
- }),
- }
- )
- .addTo(map)
- polygin.motionStart()
- }
- /**
- * 实时请求后台展示内容，构建弹窗内容后返回 （例：事件扎点中使用）
- * @param configInfo {Object} 动态配置的图层信息
- * @param data {Object} 实例对象
- * @returns {HTMLElement} HTML对象
- */
- function _createPopupConfigInfo(configInfo, data) {
- const currentData = data
- const layerMesage = {}
- const attribute = configInfo.attribute
- const attributeCaption = configInfo.attributeCaption
- // 构造弹窗对象
- for (let i = 0; i < attribute.length; i++) {
- const key = attributeCaption[i]
- const name = attribute[i]
- layerMesage[key] = currentData[name]
- }
- // 返回弹框内容
- return createPopupHtml(layerMesage)
- }
- /**
- * 根据marker获取弹窗信息，只弹出基本信息（直接弹出）
- * @param markerGroup {Object} 图层组
- * */
- const markerPopup = function (markerGroup) {
- const layers = markerGroup._layers
- for (const index in layers) {
- const contentHTML = _createPopupConfigInfo(
- layers[index].options.attribution,
- layers[index].options.attribution.data
- )
- // layers[index].bindPopup(contentHTML).openPopup(layers[index].getLatLng());
- layers[index].bindPopup(contentHTML).openPopup()
- }
- }
+ /**
+ * 定义地物编辑服务
+ */
+ const featureService = L.supermap && L.supermap.featureService && L.supermap.featureService(
+ _mapConfig.config.EDITORDATA_URL
+ )
- /**
- * 展示普通图层
- * @param callBackFun {Function} 回调函数对象
- */
- const _showStaticLayer = function (callBackFun) {
- callBackFun()
- }
- /**
- * 资源中添加超图库数据
- * @param features {Object} 要素
- * @param layerConfigInfo {Object} 图层配置对象
- */
- function _addResourceFeature(features, layerConfigInfo) {
- const x = features.SmX
- const y = features.SmY
- const UUID = features.UUID
- const name = layerConfigInfo.layerName
- const dataSource = name.split('@')
- let marker = {}
- // marker = L.circleMarker([x, y]);
- marker = L.marker([y, x])
- marker = marker.toGeoJSON()
- marker.properties = { UUID: UUID }
- const addFeatureParams = new SuperMap.EditFeaturesParameters({
- dataSourceName: dataSource[1],
- dataSetName: dataSource[0],
- features: marker,
- editType: 'add',
- returnContent: true,
- })
- featureService.editFeatures(addFeatureParams, (serviceResult) => {
- if (serviceResult.result.succeed) {
- console.log('添加超图库成功')
- }
- })
- }
- /**
- * 资源模块中删除资源
- * @param UUID {String} 需要删除的uuid
- * @param layerConfigInfo {Object} 图层配置对象
- */
- function _deleteResourceFeature(UUID, layerConfigInfo) {
- const authorityFilter = `UUID = '${UUID}'` // 此处需要传参替换
- const queryUrl = _mapConfig.config.QUERY_URL
- const name = layerConfigInfo.layerName
- const dataSource = name.split('@')
- const sqlParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- name: name,
- attributeFilter: authorityFilter,
- },
- })
- L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
- serviceResult.result.recordsets.forEach((value) => {
- value.features.features.forEach((feature) => {
- const deleteParams = new SuperMap.EditFeaturesParameters({
- dataSourceName: dataSource[1],
- dataSetName: dataSource[0],
- IDs: [feature.id],
- editType: 'delete',
- })
- featureService.editFeatures(deleteParams, (serviceResult) => {
- if (serviceResult.result.succeed) {
- console.log('删除数据成功')
+ /**
+ * 根据图层名移除图层
+ * @param layerName {String} 图层名
+ */
+ const _removeLayerByLayerName = function(layerName) {
+ const layer = layerGroup.get(layerName)
+ // const feature = featureGroup;
+ // map.popupclose();
+ // debugger;
+ console.log('清空图层', layerName)
+ if (layer) {
+ // 清空layer图层
+ map.closePopup()
+ featureGroup.removeLayer(layer)
+ layer.remove()
+ // layer.clearLayers();
+ // 从全局记录中删除
+ layerGroup.delete(layerName)
+ // debugger
}
- })
- })
- })
- })
- }
- /**
- * 资源模块中更新资源
- * @param features {Object} 需要跟新的features
- * @param layerConfigInfo {Object} 图层配置对象
- */
- function _updateResourceFeature(features, layerConfigInfo) {
- const authorityFilter = `UUID = '${features.UUID}'`
- const queryUrl = _mapConfig.config.QUERY_URL
- const name = layerConfigInfo.layerName
- const dataSource = name.split('@')
- const sqlParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- name: name,
- attributeFilter: authorityFilter,
- },
- })
- L.supermap
- .queryService(queryUrl)
- .queryBySQL(sqlParam, function (serviceResult) {
- console.log('serviceResult', serviceResult.result)
- if (serviceResult.result.recordsets[0].features.features.length === 0) {
- let marker = {}
- marker = L.marker([features.SmY, features.SmX])
- marker = marker.toGeoJSON()
- marker.properties = { UUID: features.UUID }
- const addFeatureParams = new SuperMap.EditFeaturesParameters({
+ }
+ /**
+ * 清空地图（除去底图）
+ * @private
+ */
+ const _clearAllLayers = function() {
+ // debugger;
+ map.closePopup()
+ featureGroup.clearLayers()
+ layerGroup.clear()
+ }
+ /**
+ * 关闭所有地图弹窗
+ * @private
+ */
+ const _closeAllPopup = function(feature) {
+ map.closePopup()
+ }
+ /**
+ * 添加地图弹窗
+ * @private
+ */
+ const _openPopup = function(feature) {
+ // debugger;
+ // const elementHtml = createAddressPopup(feature)
+ L.popup({ className: 'epidemic-popup' })
+ .setLatLng(feature.latLng)
+ // .setContent(elementHtml)
+ .openOn(map)
+ }
+ /**
+ * 添加视频监控平台地图弹窗
+ * @private
+ */
+ const _openPopupVideoSurveillance = function(feature) {
+ // debugger
+ if (feature.type == 'cameraTree') {
+ const elementHtml = createCameraDetailsPop(feature)
+ const arr = [0, 0.0, '', '0', '0.0']
+ if (arr.indexOf(feature.data.gpsX) == -1) {
+ L.popup({ className: 'List-Details-pop', offset: [168, 200] })
+ .setLatLng(feature.latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ } else {
+ L.popup({
+ className: 'List-Details-pop',
+ offset: [168, 200],
+ autoPan: false,
+ })
+ .setLatLng(map.getCenter())
+ .setContent(elementHtml)
+ .openOn(map)
+ }
+ } else {
+ const elementHtml = createSearchAddressTitlePop(feature)
+ L.popup({ className: 'Address-Title-pop', closeButton: false })
+ .setLatLng(feature.latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ }
+ }
+ /**
+ * 根据图层名数组移除图层
+ * @param layerNameArray {Array} 图层名
+ */
+ const _removeLayersByLayerNameArray = function(layerNameArray) {
+ layerNameArray.forEach((layerName) => {
+ const layer = layerGroup.get(layerName)
+ if (layer) {
+ // 清空layer图层
+ featureGroup.removeLayer(layer)
+ layer.remove()
+ // layer.clearLayers();
+ // 从全局记录中删除
+ layerGroup.delete(layerName)
+ }
+ })
+ }
+ /**
+ * 根据图层名数组移除图层
+ * @param layerNameArray {Array} 图层名
+ */
+ const _addMovingMarker = function(arrList) {
+ var polyline1 = L.polyline(arrList).addTo(map)
+ var decorator = L.polylineDecorator(polyline1, {
+ patterns: [
+ // defines a pattern of 10px-wide dashes, repeated every 20px on the line
+ { offset: 0, repeat: 20, symbol: L.Symbol.dash({ pixelSize: 10 }) },
+ ],
+ }).addTo(map)
+ // var myMovingMarker = L.Marker.movingMarker(arrList,
+ // [20000]).addTo(map)
+ // myMovingMarker.start()
+ var polygin = L.motion
+ .polyline(
+ arrList, {
+ color: 'transparent',
+ }, {
+ auto: true,
+ duration: 53000,
+ easing: L.Motion.Ease.easeInOutQuart,
+ }, {
+ removeOnEnd: true,
+ showMarker: true,
+ icon: L.divIcon({
+ html: "",
+ iconSize: L.point(27.5, 24),
+ }),
+ }
+ )
+ .addTo(map)
+ polygin.motionStart()
+ }
+ /**
+ * 实时请求后台展示内容，构建弹窗内容后返回 （例：事件扎点中使用）
+ * @param configInfo {Object} 动态配置的图层信息
+ * @param data {Object} 实例对象
+ * @returns {HTMLElement} HTML对象
+ */
+ function _createPopupConfigInfo(configInfo, data) {
+ const currentData = data
+ const layerMesage = {}
+ const attribute = configInfo.attribute
+ const attributeCaption = configInfo.attributeCaption
+ // 构造弹窗对象
+ for (let i = 0; i < attribute.length; i++) {
+ const key = attributeCaption[i]
+ const name = attribute[i]
+ layerMesage[key] = currentData[name]
+ }
+ // 返回弹框内容
+ return createPopupHtml(layerMesage)
+ }
+
+ /**
+ * 根据marker获取弹窗信息，只弹出基本信息（直接弹出）
+ * @param markerGroup {Object} 图层组
+ * */
+ const markerPopup = function(markerGroup) {
+ const layers = markerGroup._layers
+ for (const index in layers) {
+ const contentHTML = _createPopupConfigInfo(
+ layers[index].options.attribution,
+ layers[index].options.attribution.data
+ )
+ // layers[index].bindPopup(contentHTML).openPopup(layers[index].getLatLng());
+ layers[index].bindPopup(contentHTML).openPopup()
+ }
+ }
+
+ /**
+ * 展示普通图层
+ * @param callBackFun {Function} 回调函数对象
+ */
+ const _showStaticLayer = function(callBackFun) {
+ callBackFun()
+ }
+ /**
+ * 资源中添加超图库数据
+ * @param features {Object} 要素
+ * @param layerConfigInfo {Object} 图层配置对象
+ */
+ function _addResourceFeature(features, layerConfigInfo) {
+ const x = features.SmX
+ const y = features.SmY
+ const UUID = features.UUID
+ const name = layerConfigInfo.layerName
+ const dataSource = name.split('@')
+ let marker = {}
+ // marker = L.circleMarker([x, y]);
+ marker = L.marker([y, x])
+ marker = marker.toGeoJSON()
+ marker.properties = { UUID: UUID }
+ const addFeatureParams = new SuperMap.EditFeaturesParameters({
dataSourceName: dataSource[1],
dataSetName: dataSource[0],
features: marker,
editType: 'add',
returnContent: true,
- })
- featureService.editFeatures(addFeatureParams, (serviceResult) => {
- if (serviceResult.result.succeed) {
- console.log('更新超图库成功')
- }
- })
- } else {
- const feature =
- serviceResult.result.recordsets[0].features.features[0]
- feature.geometry.coordinates[0] = features.SmX
- feature.geometry.coordinates[1] = features.SmY
- const updateParams = new SuperMap.EditFeaturesParameters({
- dataSourceName: dataSource[1],
- dataSetName: dataSource[0],
- features: feature,
- editType: 'update',
- })
- featureService.editFeatures(updateParams, (serviceResult) => {
- if (serviceResult.result.succeed) {
- console.log('更新成功')
- }
- })
- }
- })
- }
-
- /**
- * 扎点后弹出弹窗的通用方法
- * @param e {Object} marker对象
- */
- function _drawMarkerPopupUniversalFun(e) {
- if (e.layerType === 'marker') {
- featureGroup.addLayer(e.layer)
- layerGroup.set('drawMarkerLayer', e.layer)
- mapObj.currentSelectedPoint = {
- lat: e.layer._latlng.lat,
- lng: e.layer._latlng.lng,
- }
- // 设置bindPopup弹窗内容，通过传入Element对象
- const info = {
- 纬度: mapObj.currentSelectedPoint.lat,
- 经度: mapObj.currentSelectedPoint.lng,
- }
- var popupContent = createDrawMarkerPopupHtml(info)
- layerGroup.get('drawMarkerLayer').bindPopup(popupContent).openPopup()
- }
- }
- /**
- * @description: 通过点位在地图上留下标记
- * @param {*} e point数据
- * @return {*}
- */
- function _drawMarkerThroughPoint(e, callback, click) {
- const myIcon = L.icon({
- iconUrl: './src/assets/map/button/button-map-location.png',
- iconSize: [35, 35],
- })
- const options = {
- icon: myIcon,
- draggable: true,
- autoPan: true,
- }
- const layer = L.marker(
- [e.layer._latlng.lat, e.layer._latlng.lng],
- options
- ).addTo(mapObj.map)
- layer.on('moveend', function (e) {
- callback(e)
- })
- layer.on('click', function (e) {
- layer.remove()
- mapObj.drawMarker.enable()
- })
- }
- /**
- * @description: 改变marker提示语
- * @param {*} tooltip 提示语
- * @return {*}
- */
- function _changeMarkerTooltip(tooltip) {
- L.drawLocal.draw.handlers.marker.tooltip.start = tooltip
- }
- /**
- * 构造drawMarker弹窗内容
- * @param data {object} 传入的实体对象
- */
- function createDrawMarkerPopupHtml(data) {
- const contentHTML = document.createElement('div')
- const firstDiv = document.createElement('div')
- const secondDiv = document.createElement('div')
- const thirdDiv = document.createElement('div')
- const titleDiv = document.createElement('div')
- const btnDiv = document.createElement('div')
- const titleContent = document.createTextNode('详细信息')
- titleDiv.className = 'map-pop-title'
- // titleDiv.style.cssText = "width: 100%;height: 30px;background: #04B2BF;padding-top: 5px;padding-left: 10px;";
- titleDiv.appendChild(titleContent)
- contentHTML.appendChild(titleDiv)
- btnDiv.style.cssText = 'width: 100%;height: 30px;'
- // 弹窗高度
- let lineCount = 0
- // 最大宽度，判断每行字符串，超过按照最大宽度设定
- let contentWidth = 0
- // 累加行数，计算每行宽度
- const calc = function (str) {
- const tempLength =
- getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
- if (tempLength >= 450) {
- contentWidth = 450
- lineCount += Math.ceil(tempLength / 434) // 450-8-8,除去padding
- } else {
- if (tempLength > contentWidth) {
- contentWidth = tempLength
- }
- lineCount += 1
- }
- }
- Object.keys(data).forEach((key) => {
- let lineContent = null
- if (data[key] !== null) {
- lineContent = key + ':' + data[key]
- } else {
- lineContent = key + ':' + '无'
- }
- calc(lineContent)
- firstDiv.className = 'popupwindow'
- const content = document.createTextNode(lineContent)
- const br = document.createElement('br')
- firstDiv.appendChild(content)
- firstDiv.appendChild(br)
- })
- if (lineCount <= 6) {
- secondDiv.style.cssText = 'max-width:450px;word-break: break-all'
- secondDiv.appendChild(firstDiv)
- contentHTML.appendChild(secondDiv)
- } else {
- thirdDiv.style.cssText =
- 'height:164px;overflow-y: auto;max-width:450px;word-break: break-all'
- thirdDiv.appendChild(firstDiv)
- contentHTML.appendChild(thirdDiv)
- }
- const notarizeBtn = document.createElement('div')
- const cancelBtn = document.createElement('div')
- const notarizeContent = document.createTextNode('确认')
- const cancelContent = document.createTextNode('取消 ')
- notarizeBtn.appendChild(notarizeContent)
- notarizeBtn.style.cssText =
- 'float: left;width: 50px;margin-left:65px;background-color:#00afda;cursor: pointer;text-align: center;margin-left: 23%;'
- notarizeBtn.onclick = saveMarkerCallBack
- cancelBtn.appendChild(cancelContent)
- cancelBtn.onclick = resetMarkerCallBack
- cancelBtn.style.cssText =
- 'float: left;width: 50px;background-color:#00afda;margin-left:15px;cursor: pointer;text-align: center;'
-
- btnDiv.appendChild(notarizeBtn)
- btnDiv.appendChild(cancelBtn)
- contentHTML.appendChild(btnDiv)
- return contentHTML
- }
-
- /**
- * 取消扎点回调
- */
- const resetMarkerCallBack = function () {
- _removeLayerByLayerName('drawMarkerLayer')
- layerGroup.delete('drawMarkerLayer')
- mapObj.drawMarker.enable()
- }
- function _addImgMaker(latLng, inconConfig) {
- const icon = MapStyle.featureIcon(inconConfig)
- const markerLayer = L.marker([latLng.lat, latLng.lng], {
- icon: icon,
- })
- featureGroup.addLayer(markerLayer)
- }
- /**
- * 保存扎点信息的通用方法
- */
- function saveMarkerCallBack() {
- externalFunGlobalObject.saveLocationFun()
- }
- /**
- * 查看是否扎点
- * @param UUID {String} 本地与超图关联字段
- * @param layerName {String} 配置图层名
- * @param layerConfigInfo {Object} 自定义的图层配置信息对象
- */
-
- function _hasLocationInfo(UUID, layerName, layerConfigInfo) {
- const authorityFilter = `UUID = '${UUID}'`
- const queryUrl = _mapConfig.config.QUERY_URL
- const name = layerConfigInfo.layerName
- const sqlParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- name: name,
- attributeFilter: authorityFilter,
- },
- })
- L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
- isLocated =
- serviceResult.result.recordsets[0].features.features.length === 0
- })
- }
-
- function _getLocale() {
- return isLocated
- }
- /**
- * 构造弹窗内容
- * @param data {object} 传入的实体对象
- */
- function createPopupHtml(data) {
- const contentHTML = document.createElement('div')
- const firstDiv = document.createElement('div')
- const secondDiv = document.createElement('div')
- const thirdDiv = document.createElement('div')
- const titleDiv = document.createElement('div')
- const titleContent = document.createTextNode('详细信息')
- titleDiv.className = 'map-pop-title'
- // titleDiv.style.cssText = "width: 100%;height: 30px;background: #04B2BF;";
- titleDiv.appendChild(titleContent)
- contentHTML.appendChild(titleDiv)
- // 弹窗高度
- let lineCount = 0
- // 最大宽度，判断每行字符串，超过按照最大宽度设定
- let contentWidth = 0
- // 累加行数，计算每行宽度
- const calc = function (str) {
- const tempLength =
- getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
- if (tempLength >= 450) {
- contentWidth = 450
- lineCount += Math.ceil(tempLength / 434) // 450-8-8,除去padding
- } else {
- if (tempLength > contentWidth) {
- contentWidth = tempLength
- }
- lineCount += 1
- }
- }
- Object.keys(data).forEach((key) => {
- let lineContent = null
- if (data[key]) {
- lineContent = key + '：' + data[key]
- } else {
- lineContent = key + '：' + '无'
- }
- calc(lineContent)
- firstDiv.className = 'popupwindow'
- const content = document.createTextNode(lineContent)
- const br = document.createElement('br')
- firstDiv.appendChild(content)
- firstDiv.appendChild(br)
- })
-
- if (lineCount <= 6) {
- secondDiv.style.cssText =
- 'padding: 8px;max-width:450px;word-break: break-all'
- secondDiv.appendChild(firstDiv)
- contentHTML.appendChild(secondDiv)
- } else {
- thirdDiv.style.cssText =
- 'height:164px;overflow-y: auto;padding: 8px;max-width:450px;word-break: break-all'
- thirdDiv.appendChild(firstDiv)
- contentHTML.appendChild(secondDiv)
- }
- return contentHTML
- }
- /**
- * 切换地图
- * @param mapType {String} 类型
- */
- function _changeMap(mapType) {
- var tileMapUrl = ''
- if (mapType === 'tiled') {
- tileMapUrl = _mapConfig.config.TITLE_LAYER.mapUrl
- } else if (mapType === 'remote') {
- tileMapUrl = _mapConfig.config.TITLE_LAYER_REMOTE.mapUrl
- } else if (mapType === 'dark') {
- tileMapUrl = _mapConfig.config.TITLE_LAYER_DARK.mapUrl
- }
- mapObj.map.eachLayer(function (layer) {
- if (layer.tempIndex === -1) {
- mapObj.map.removeLayer(layer)
- L.supermap.tiledMapLayer(tileMapUrl).addTo(mapObj.map)
- }
- })
- }
- /**
- * @description: ZXY渲染百度地图 底图切换
- * @param {*} mapType 切换底图类型
- * @return {*}
- */
- function _ZXYRenderMapSwitch(mapType) {
- const config = _mapConfig.config.TILEDCONFIG[mapType]
- const layerConfig = { url: config.tiledUrl, name: config.tiledName }
- const newTileLayer = new L.tileLayer.baidu(layerConfig)
- mapObj.map.eachLayer(function (layer) {
- if (layer.options.tms === true) {
- mapObj.map.removeLayer(layer)
- newTileLayer.addTo(mapObj.map)
- }
- })
- }
-
- /**
- * 地图根据Feature数组添加点位信息
- * @param layerName {String} 图层名字
- * @param features {Array} 地图要素数组
- * @param layerConfigInfo {Object} 图层配置对象
- * @param callBackInClick {function} 点击图标时执行的函数
- * @param className {String} 样式字符串
- */
- const _addFeatureArrayOnMap = function (
- layerName,
- features,
- layerConfigInfo,
- { callBackInClick = null, className = '' } = {}
- ) {
- const layers = []
- features.forEach((feature) => {
- // 创建marker图层，绑定要素
- const markerLayer = L.marker([feature.lon, feature.lat], {
- icon: MapStyle.featureIcon(layerConfigInfo),
- attribution: feature,
- })
- markerLayer.layerConfigInfo = layerConfigInfo
- markerLayer.on('click', function (e) {
- const layerConfigInfo = e.sourceTarget.layerConfigInfo
- const location = [e.latlng.lat, e.latlng.lng]
- const latlng = L.latLng(location)
- const data = e.sourceTarget.options.attribution
- if (callBackInClick) {
- callBackInClick(data)
- }
- const responseData = {
- layerConfigInfo: layerConfigInfo,
- entityData: data,
- allMapObject: { mapObj: mapObj },
- }
- // const elementHtml = createGeneralPopup(responseData)
- L.popup({ className: className })
- .setLatLng(latlng)
- // .setContent(elementHtml)
- .openOn(map)
- })
- layers.push(markerLayer)
- })
- const markerGroup = L.layerGroup(layers)
- featureGroup.addLayer(markerGroup)
- layerGroup.set(layerName, markerGroup)
- }
- /**
- * 已知经纬度，根据数据对象添加要素到地图上，并且可瞬间点位该坐标
- * @param layerName {String}图层名字
- * @param point {Array} 经纬度数组形式
- * @param data {Object} 实体对象
- * @param layerConfigInfo {Object} 图层配置信息
- * @param popupFlag {Boolean} 判断是否直接打开弹窗
- * @param popupType {String} 弹窗类型
- * @param className {String} class名字
- */
- const _addTheOneFeatureOnMapByPoint = function (
- layerName,
- point,
- data,
- layerConfigInfo,
- { popupFlag = true, popupType = 'general', className = '' } = {}
- ) {
- // 创建marker图层，绑定要素
- // debugger;
- const markerLayer = L.marker(point, {
- icon: MapStyle.featureIcon(layerConfigInfo),
- })
- const latLng = markerLayer.getLatLng()
- featureGroup.addLayer(markerLayer)
- layerGroup.set(layerName, markerLayer)
- if (data !== '') {
- const responseData = {
- layerConfigInfo: layerConfigInfo,
- entityData: data,
- allMapObject: { mapObj: mapObj },
- }
- let elementHtml = ''
- if (popupType === 'gudEvn') {
- // elementHtml = createGudEvnPopup(responseData)
- } else if (popupType === 'storage') {
- // elementHtml = createStorageAndGoodsPopup(responseData)
- } else {
- // elementHtml = createGeneralPopup(responseData)
- }
- // 对事件点设置单击事件，展示弹窗内容
- if (popupFlag) {
- markerLayer.bindPopup(elementHtml, { className: className }).openPopup()
- } else {
- markerLayer.on('click', function () {
- L.popup({ className: className })
- .setLatLng(latLng)
- .setContent(elementHtml)
- .openOn(map)
})
- }
+ featureService.editFeatures(addFeatureParams, (serviceResult) => {
+ if (serviceResult.result.succeed) {
+ console.log('添加超图库成功')
+ }
+ })
}
- map.flyTo(latLng, 10, { duration: 0.15 })
- }
-
- /**
- * 根据图层对象直接定位并直接弹出弹窗
- * @param layer {Object} 图层对象
- * @param contentHTML {HTML Element} Dom对象
- * @param className {String} 类名字
- * */
- function _locationAndCreatePopup(
- layer,
- contentHTML,
- { className = '' } = {}
- ) {
- // 生成弹窗内容
- const latLng = layer.getLatLng()
- map.flyTo(latLng, 13, { duration: 0.3 })
- layer.bindPopup(contentHTML, { className: className }).openPopup()
- }
- /**
- * @description: 视角移动
- * @param {*} latLng {lat: , lng }
- * @param {*} zoom zoom
- * @param {*} duration duration
- * @return {*}
- */
- function _mapFlyTo(latLng, zoom, duration) {
- console.log('ee', latLng, zoom, duration)
- map.flyTo(latLng, zoom || 15, { duration: duration || 0.15 })
- }
- /**
- * @description: 展示视频资源点位 大华点击弹窗播放视频
- * @param {*} inconConfig
- * @param {*} dataList
- * @return {*}
- */
- function _showVideoOnMap(inconConfig, layerName, dataList, DS) {
- _removeLayerByLayerName(layerName)
- const markers = L.markerClusterGroup()
- dataList.map((item) => {
- const point = {
- lat: item.latitude,
- lng: item.longitude,
- }
- const icon = MapStyle.featureIcon(inconConfig)
- const markerLayer = L.marker(point, { icon: icon })
- markers.addLayer(markerLayer)
- markerLayer.on('click', function () {
- console.log('积水点播放视频', item)
- item.indexCode = item.indexCode || item.index_code
- const params = [item.indexCode]
- DS.openVideo(params)
- })
- })
- featureGroup.clearLayers()
- // const markerGroup = L.layerGroup(markers);
- featureGroup.addLayer(markers)
- // layerGroup.set(layerName, markerGroup);
- }
- /**
- * 根据UUID数组加载图层
- * @param uuidArray {Array} uuid数组
- * @param layerName {String} 图层名称
- * @param configInfo {Object} 图层的配置信息对象
- * @param getLayerPopupInfo {Function} 图层弹窗回调函数
- * @param outFeaturesCallBack {Function} 输出经过超图查询的数据对象数组
- * @param getStoragePopupInfo {Function} 物资弹窗
- * @param entityList {Array} 与uuidArray相对应的实体数组，用于输出用（可选）
- * @param searchKey {String} 搜索关键字--主要用于物资的搜索
- */
- function _showLayersByUuidArray(
- uuidArray,
- layerName,
- configInfo,
- {
- outFeaturesCallBack = null,
- getLayerPopupInfo = null,
- getStoragePopupInfo = null,
- entityList = null,
- searchKey = '',
- } = {}
- ) {
- let authorityFilter = ''
- // 当UUID的个数小于1000时
- if (uuidArray.length <= 1000) {
- const authorityFilter1 = "'" + uuidArray.join("','") + "'"
- authorityFilter = 'UUID in (' + authorityFilter1 + ')'
- } else {
- // 当UUID的个数大于1000
- const count = Math.floor(uuidArray.length / 1000) // 向下取整
- for (let i = 0; i <= count; i++) {
- const uuidSplice = uuidArray.slice(i * 1000, (i + 1) * 1000)
- const authorityFilterString = "'" + uuidSplice.join("','") + "'"
- const authorityFilterSplice = 'UUID in (' + authorityFilterString + ')'
- if (i === 0) {
- // 第一次拼接时，不需要Or
- authorityFilter = authorityFilterSplice
- } else {
- // 第N次拼接时，需要Or
- authorityFilter = authorityFilter + ' or ' + authorityFilterSplice
- }
- }
- }
- const queryUrl = _mapConfig.config.QUERY_URL
- const sqlParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- name: configInfo.layerName,
- attributeFilter: authorityFilter,
- },
- })
- L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
- if (outFeaturesCallBack !== null) {
- // outFeaturesCallBack(serviceResult,layerName,entityList);
- outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
- }
- const resultLayerConfig = L.geoJSON(
- serviceResult.result.recordsets[0].features,
- {
- onEachFeature: (feature, layer) => {
- layer.setIcon(MapStyle.featureIcon(configInfo, { zoom: map._zoom }))
- layer.title = layerName
- layer.configInfo = configInfo
- layer.on('click', function (e) {
- // const uuid = e.sourceTarget.feature.properties.UUID;
- const uuid =
- e.sourceTarget.feature.properties[
- _convertCaseOfAttributes('UUID')
- ]
- const layerConfigInfo = e.sourceTarget.configInfo
- const location = [e.latlng.lat, e.latlng.lng]
- const latlng = L.latLng(location)
- // 绑定通用弹窗事件，实时请求弹窗内容
- if (getLayerPopupInfo !== null) {
- getLayerPopupInfo(uuid, layerConfigInfo).then((response) => {
- response.allMapObject = {
- mapObj: mapObj,
- }
- // const elementHtml = createGeneralPopup(response)
- L.popup({ className: 'multi-general-popup-style' })
- .setLatLng(latlng)
- // .setContent(elementHtml)
- .openOn(map)
+ /**
+ * 资源模块中删除资源
+ * @param UUID {String} 需要删除的uuid
+ * @param layerConfigInfo {Object} 图层配置对象
+ */
+ function _deleteResourceFeature(UUID, layerConfigInfo) {
+ const authorityFilter = `UUID = '${UUID}'` // 此处需要传参替换
+ const queryUrl = _mapConfig.config.QUERY_URL
+ const name = layerConfigInfo.layerName
+ const dataSource = name.split('@')
+ const sqlParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ name: name,
+ attributeFilter: authorityFilter,
+ },
+ })
+ L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
+ serviceResult.result.recordsets.forEach((value) => {
+ value.features.features.forEach((feature) => {
+ const deleteParams = new SuperMap.EditFeaturesParameters({
+ dataSourceName: dataSource[1],
+ dataSetName: dataSource[0],
+ IDs: [feature.id],
+ editType: 'delete',
+ })
+ featureService.editFeatures(deleteParams, (serviceResult) => {
+ if (serviceResult.result.succeed) {
+ console.log('删除数据成功')
+ }
+ })
})
- }
- if (getStoragePopupInfo !== null) {
- getStoragePopupInfo(uuid, layerConfigInfo, searchKey).then(
- (response) => {
- response.allMapObject = {
- mapObj: mapObj,
- }
- // const elementHtml = createStorageAndGoodsPopup(response)
- L.popup({ className: 'multi-general-popup-style' })
- .setLatLng(latlng)
- // .setContent(elementHtml)
- .openOn(map)
- }
- )
- }
})
- },
- }
- )
- _removeLayerByLayerName(layerName)
- featureGroup.addLayer(resultLayerConfig)
- layerGroup.set(layerName, resultLayerConfig)
- })
- }
-
- /**
- * 根据cameraIndexCode加载视频图层（普通定位，非聚合使用）
- * @param cameraIndexCode {Array} cameraIndexCode数组
- * @param layerName {String} 图层名称
- * @param configInfo {Object} 图层的配置信息对象
- * @param getLayerPopupInfo {Function} 获取弹窗信息的方法
- * @param outFeaturesCallBack {Function} 输出经过超图查询的数据对象数组
- * @param entityList {Array} 与uuidArray相对应的实体数组，用于输出用（可选）
- */
- function _showCameraByIndexCodeArray(
- cameraIndexCode,
- layerName,
- configInfo,
- {
- getLayerPopupInfo = null,
- outFeaturesCallBack = null,
- entityList = null,
- } = {}
- ) {
- let authorityFilter = ''
- if (cameraIndexCode.length <= 1000) {
- const authorityFilterStr = "'" + cameraIndexCode.join("','") + "'"
- authorityFilter = 'CAMERA_INDEX_CODE in (' + authorityFilterStr + ')'
- } else {
- const count = Math.floor(cameraIndexCode.length / 1000) // 向下取整
- for (var i = 0; i <= count; i++) {
- const cameraIndexCodeSplice = cameraIndexCode.slice(
- i * 1000,
- (i + 1) * 1000
- )
- const authorityFilterString =
- "'" + cameraIndexCodeSplice.join("','") + "'"
- const authorityFilterSplice =
- 'CAMERA_INDEX_CODE in (' + authorityFilterString + ')'
- if (i === 0) {
- // 第一次拼接时，不需要Or
- authorityFilter = authorityFilterSplice
- } else {
- // 第N次拼接时，需要Or
- authorityFilter = authorityFilter + ' or ' + authorityFilterSplice
- }
- }
+ })
}
- const queryUrl = _mapConfig.config.QUERY_URL
- const reservoirParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- // name: configInfo.datasetNames,
- name: configInfo.layerName,
- attributeFilter: authorityFilter,
- },
- })
- L.supermap
- .queryService(queryUrl)
- .queryBySQL(reservoirParam, function (serviceResult) {
- // if (serviceResult.result.recordsets[0].features.features.length === 0) {
- // console.log('未查询到视频');
- // return;
- // }
- if (outFeaturesCallBack !== null) {
- // outFeaturesCallBack(serviceResult,layerName,entityList);
- outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
+ /**
+ * 资源模块中更新资源
+ * @param features {Object} 需要跟新的features
+ * @param layerConfigInfo {Object} 图层配置对象
+ */
+ function _updateResourceFeature(features, layerConfigInfo) {
+ const authorityFilter = `UUID = '${features.UUID}'`
+ const queryUrl = _mapConfig.config.QUERY_URL
+ const name = layerConfigInfo.layerName
+ const dataSource = name.split('@')
+ const sqlParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ name: name,
+ attributeFilter: authorityFilter,
+ },
+ })
+ L.supermap
+ .queryService(queryUrl)
+ .queryBySQL(sqlParam, function(serviceResult) {
+ console.log('serviceResult', serviceResult.result)
+ if (serviceResult.result.recordsets[0].features.features.length === 0) {
+ let marker = {}
+ marker = L.marker([features.SmY, features.SmX])
+ marker = marker.toGeoJSON()
+ marker.properties = { UUID: features.UUID }
+ const addFeatureParams = new SuperMap.EditFeaturesParameters({
+ dataSourceName: dataSource[1],
+ dataSetName: dataSource[0],
+ features: marker,
+ editType: 'add',
+ returnContent: true,
+ })
+ featureService.editFeatures(addFeatureParams, (serviceResult) => {
+ if (serviceResult.result.succeed) {
+ console.log('更新超图库成功')
+ }
+ })
+ } else {
+ const feature =
+ serviceResult.result.recordsets[0].features.features[0]
+ feature.geometry.coordinates[0] = features.SmX
+ feature.geometry.coordinates[1] = features.SmY
+ const updateParams = new SuperMap.EditFeaturesParameters({
+ dataSourceName: dataSource[1],
+ dataSetName: dataSource[0],
+ features: feature,
+ editType: 'update',
+ })
+ featureService.editFeatures(updateParams, (serviceResult) => {
+ if (serviceResult.result.succeed) {
+ console.log('更新成功')
+ }
+ })
+ }
+ })
+ }
+
+ /**
+ * 扎点后弹出弹窗的通用方法
+ * @param e {Object} marker对象
+ */
+ function _drawMarkerPopupUniversalFun(e) {
+ if (e.layerType === 'marker') {
+ featureGroup.addLayer(e.layer)
+ layerGroup.set('drawMarkerLayer', e.layer)
+ mapObj.currentSelectedPoint = {
+ lat: e.layer._latlng.lat,
+ lng: e.layer._latlng.lng,
+ }
+ // 设置bindPopup弹窗内容，通过传入Element对象
+ const info = {
+ 纬度: mapObj.currentSelectedPoint.lat,
+ 经度: mapObj.currentSelectedPoint.lng,
+ }
+ var popupContent = createDrawMarkerPopupHtml(info)
+ layerGroup.get('drawMarkerLayer').bindPopup(popupContent).openPopup()
}
- const searchCameraLayer = L.geoJSON(
- serviceResult.result.recordsets[0].features,
- {
- onEachFeature: (feature, layer) => {
- layer.setIcon(MapStyle.featureIcon(configInfo))
- layer.configInfo = configInfo
- // 给查询出的每一个点添加点击弹窗事件
- // 绑定弹窗事件，实时请求弹窗内容
- if (getLayerPopupInfo !== null) {
- layer.on('click', function (e) {
- const indexCode =
- e.sourceTarget.feature.properties[
- _convertCaseOfAttributes('CAMERA_INDEX_CODE')
- ]
- const layerConfigInfo = e.sourceTarget.configInfo
- const location = [e.latlng.lat, e.latlng.lng]
- const latlng = L.latLng(location)
- getLayerPopupInfo(indexCode, layerConfigInfo).then(
- (response) => {
- response.allMapObject = {
- mapObj: mapObj,
- }
- // const elementHtml = createGeneralPopup(response)
- L.popup({ className: 'multi-general-popup-style' })
+ }
+ /**
+ * @description: 通过点位在地图上留下标记
+ * @param {*} e point数据
+ * @return {*}
+ */
+ function _drawMarkerThroughPoint(e, callback, click) {
+ const myIcon = L.icon({
+ iconUrl: './src/assets/map/button/button-map-location.png',
+ iconSize: [35, 35],
+ })
+ const options = {
+ icon: myIcon,
+ draggable: true,
+ autoPan: true,
+ }
+ const layer = L.marker(
+ [e.layer._latlng.lat, e.layer._latlng.lng],
+ options
+ ).addTo(mapObj.map)
+ layer.on('moveend', function(e) {
+ callback(e)
+ })
+ layer.on('click', function(e) {
+ layer.remove()
+ mapObj.drawMarker.enable()
+ })
+ }
+ /**
+ * @description: 改变marker提示语
+ * @param {*} tooltip 提示语
+ * @return {*}
+ */
+ function _changeMarkerTooltip(tooltip) {
+ L.drawLocal.draw.handlers.marker.tooltip.start = tooltip
+ }
+ /**
+ * 构造drawMarker弹窗内容
+ * @param data {object} 传入的实体对象
+ */
+ function createDrawMarkerPopupHtml(data) {
+ const contentHTML = document.createElement('div')
+ const firstDiv = document.createElement('div')
+ const secondDiv = document.createElement('div')
+ const thirdDiv = document.createElement('div')
+ const titleDiv = document.createElement('div')
+ const btnDiv = document.createElement('div')
+ const titleContent = document.createTextNode('详细信息')
+ titleDiv.className = 'map-pop-title'
+ // titleDiv.style.cssText = "width: 100%;height: 30px;background: #04B2BF;padding-top: 5px;padding-left: 10px;";
+ titleDiv.appendChild(titleContent)
+ contentHTML.appendChild(titleDiv)
+ btnDiv.style.cssText = 'width: 100%;height: 30px;'
+ // 弹窗高度
+ let lineCount = 0
+ // 最大宽度，判断每行字符串，超过按照最大宽度设定
+ let contentWidth = 0
+ // 累加行数，计算每行宽度
+ const calc = function(str) {
+ const tempLength =
+ getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
+ if (tempLength >= 450) {
+ contentWidth = 450
+ lineCount += Math.ceil(tempLength / 434) // 450-8-8,除去padding
+ } else {
+ if (tempLength > contentWidth) {
+ contentWidth = tempLength
+ }
+ lineCount += 1
+ }
+ }
+ Object.keys(data).forEach((key) => {
+ let lineContent = null
+ if (data[key] !== null) {
+ lineContent = key + ':' + data[key]
+ } else {
+ lineContent = key + ':' + '无'
+ }
+ calc(lineContent)
+ firstDiv.className = 'popupwindow'
+ const content = document.createTextNode(lineContent)
+ const br = document.createElement('br')
+ firstDiv.appendChild(content)
+ firstDiv.appendChild(br)
+ })
+ if (lineCount <= 6) {
+ secondDiv.style.cssText = 'max-width:450px;word-break: break-all'
+ secondDiv.appendChild(firstDiv)
+ contentHTML.appendChild(secondDiv)
+ } else {
+ thirdDiv.style.cssText =
+ 'height:164px;overflow-y: auto;max-width:450px;word-break: break-all'
+ thirdDiv.appendChild(firstDiv)
+ contentHTML.appendChild(thirdDiv)
+ }
+ const notarizeBtn = document.createElement('div')
+ const cancelBtn = document.createElement('div')
+ const notarizeContent = document.createTextNode('确认')
+ const cancelContent = document.createTextNode('取消 ')
+ notarizeBtn.appendChild(notarizeContent)
+ notarizeBtn.style.cssText =
+ 'float: left;width: 50px;margin-left:65px;background-color:#00afda;cursor: pointer;text-align: center;margin-left: 23%;'
+ notarizeBtn.onclick = saveMarkerCallBack
+ cancelBtn.appendChild(cancelContent)
+ cancelBtn.onclick = resetMarkerCallBack
+ cancelBtn.style.cssText =
+ 'float: left;width: 50px;background-color:#00afda;margin-left:15px;cursor: pointer;text-align: center;'
+
+ btnDiv.appendChild(notarizeBtn)
+ btnDiv.appendChild(cancelBtn)
+ contentHTML.appendChild(btnDiv)
+ return contentHTML
+ }
+
+ /**
+ * 取消扎点回调
+ */
+ const resetMarkerCallBack = function() {
+ _removeLayerByLayerName('drawMarkerLayer')
+ layerGroup.delete('drawMarkerLayer')
+ mapObj.drawMarker.enable()
+ }
+
+ function _addImgMaker(latLng, inconConfig) {
+ const icon = MapStyle.featureIcon(inconConfig)
+ const markerLayer = L.marker([latLng.lat, latLng.lng], {
+ icon: icon,
+ })
+ featureGroup.addLayer(markerLayer)
+ }
+ /**
+ * 保存扎点信息的通用方法
+ */
+ function saveMarkerCallBack() {
+ externalFunGlobalObject.saveLocationFun()
+ }
+ /**
+ * 查看是否扎点
+ * @param UUID {String} 本地与超图关联字段
+ * @param layerName {String} 配置图层名
+ * @param layerConfigInfo {Object} 自定义的图层配置信息对象
+ */
+
+ function _hasLocationInfo(UUID, layerName, layerConfigInfo) {
+ const authorityFilter = `UUID = '${UUID}'`
+ const queryUrl = _mapConfig.config.QUERY_URL
+ const name = layerConfigInfo.layerName
+ const sqlParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ name: name,
+ attributeFilter: authorityFilter,
+ },
+ })
+ L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
+ isLocated =
+ serviceResult.result.recordsets[0].features.features.length === 0
+ })
+ }
+
+ function _getLocale() {
+ return isLocated
+ }
+ /**
+ * 构造弹窗内容
+ * @param data {object} 传入的实体对象
+ */
+ function createPopupHtml(data) {
+ const contentHTML = document.createElement('div')
+ const firstDiv = document.createElement('div')
+ const secondDiv = document.createElement('div')
+ const thirdDiv = document.createElement('div')
+ const titleDiv = document.createElement('div')
+ const titleContent = document.createTextNode('详细信息')
+ titleDiv.className = 'map-pop-title'
+ // titleDiv.style.cssText = "width: 100%;height: 30px;background: #04B2BF;";
+ titleDiv.appendChild(titleContent)
+ contentHTML.appendChild(titleDiv)
+ // 弹窗高度
+ let lineCount = 0
+ // 最大宽度，判断每行字符串，超过按照最大宽度设定
+ let contentWidth = 0
+ // 累加行数，计算每行宽度
+ const calc = function(str) {
+ const tempLength =
+ getDoubleCharCount(str) * 18 + getSingleCharCount(str) * 10
+ if (tempLength >= 450) {
+ contentWidth = 450
+ lineCount += Math.ceil(tempLength / 434) // 450-8-8,除去padding
+ } else {
+ if (tempLength > contentWidth) {
+ contentWidth = tempLength
+ }
+ lineCount += 1
+ }
+ }
+ Object.keys(data).forEach((key) => {
+ let lineContent = null
+ if (data[key]) {
+ lineContent = key + '：' + data[key]
+ } else {
+ lineContent = key + '：' + '无'
+ }
+ calc(lineContent)
+ firstDiv.className = 'popupwindow'
+ const content = document.createTextNode(lineContent)
+ const br = document.createElement('br')
+ firstDiv.appendChild(content)
+ firstDiv.appendChild(br)
+ })
+
+ if (lineCount <= 6) {
+ secondDiv.style.cssText =
+ 'padding: 8px;max-width:450px;word-break: break-all'
+ secondDiv.appendChild(firstDiv)
+ contentHTML.appendChild(secondDiv)
+ } else {
+ thirdDiv.style.cssText =
+ 'height:164px;overflow-y: auto;padding: 8px;max-width:450px;word-break: break-all'
+ thirdDiv.appendChild(firstDiv)
+ contentHTML.appendChild(secondDiv)
+ }
+ return contentHTML
+ }
+ /**
+ * 切换地图
+ * @param mapType {String} 类型
+ */
+ function _changeMap(mapType) {
+ var tileMapUrl = ''
+ if (mapType === 'tiled') {
+ tileMapUrl = _mapConfig.config.TITLE_LAYER.mapUrl
+ } else if (mapType === 'remote') {
+ tileMapUrl = _mapConfig.config.TITLE_LAYER_REMOTE.mapUrl
+ } else if (mapType === 'dark') {
+ tileMapUrl = _mapConfig.config.TITLE_LAYER_DARK.mapUrl
+ }
+ mapObj.map.eachLayer(function(layer) {
+ if (layer.tempIndex === -1) {
+ mapObj.map.removeLayer(layer)
+ L.supermap.tiledMapLayer(tileMapUrl).addTo(mapObj.map)
+ }
+ })
+ }
+ /**
+ * @description: ZXY渲染百度地图 底图切换
+ * @param {*} mapType 切换底图类型
+ * @return {*}
+ */
+ function _ZXYRenderMapSwitch(mapType) {
+ const config = _mapConfig.config.TILEDCONFIG[mapType]
+ const layerConfig = { url: config.tiledUrl, name: config.tiledName }
+ const newTileLayer = new L.tileLayer.baidu(layerConfig)
+ mapObj.map.eachLayer(function(layer) {
+ if (layer.options.tms === true) {
+ mapObj.map.removeLayer(layer)
+ newTileLayer.addTo(mapObj.map)
+ }
+ })
+ }
+
+ /**
+ * 地图根据Feature数组添加点位信息
+ * @param layerName {String} 图层名字
+ * @param features {Array} 地图要素数组
+ * @param layerConfigInfo {Object} 图层配置对象
+ * @param callBackInClick {function} 点击图标时执行的函数
+ * @param className {String} 样式字符串
+ */
+ const _addFeatureArrayOnMap = function(
+ layerName,
+ features,
+ layerConfigInfo, { callBackInClick = null, className = '' } = {}
+ ) {
+ const layers = []
+ features.forEach((feature) => {
+ // 创建marker图层，绑定要素
+ const markerLayer = L.marker([feature.lon, feature.lat], {
+ icon: MapStyle.featureIcon(layerConfigInfo),
+ attribution: feature,
+ })
+ markerLayer.layerConfigInfo = layerConfigInfo
+ markerLayer.on('click', function(e) {
+ const layerConfigInfo = e.sourceTarget.layerConfigInfo
+ const location = [e.latlng.lat, e.latlng.lng]
+ const latlng = L.latLng(location)
+ const data = e.sourceTarget.options.attribution
+ if (callBackInClick) {
+ callBackInClick(data)
+ }
+ const responseData = {
+ layerConfigInfo: layerConfigInfo,
+ entityData: data,
+ allMapObject: { mapObj: mapObj },
+ }
+ // const elementHtml = createGeneralPopup(responseData)
+ L.popup({ className: className })
.setLatLng(latlng)
// .setContent(elementHtml)
.openOn(map)
- }
- )
})
- }
- },
- }
- )
- featureGroup.addLayer(searchCameraLayer)
- layerGroup.set(layerName, searchCameraLayer)
- })
- }
- /**
- * 根据数据库类型对属性进行大小写转换
- * @param attribute
- * @returns {*}
- */
- function _convertCaseOfAttributes(attribute) {
- if (_mapConfig.config.DATABASE_TYPE === 'Oracle') {
- return attribute.toUpperCase()
- } else if (_mapConfig.config.DATABASE_TYPE === 'Highgo') {
- return attribute.toLowerCase()
- }
- }
-
- /**
- * 地址匹配正向匹配
- * @param address 地址
- * @param fromIndex 设置返回对象的起始索引值
- * @param toIndex 设置返回对象的结束索引值
- * @param filters 过滤字段，限定查询区域
- * @param prjCoordSys 查询结果的坐标系
- * @param maxReturn 最大返回结果数
- * @param outAddressCallBack 输出查询结果的回调函数
- * @param param outAddressCallBack函数所需要接收的参数
- * @private
- */
- function _addressMatchCode(
- address,
- {
- fromIndex = null,
- toIndex = null,
- filters = null,
- prjCoordSys = null,
- maxReturn = null,
- outAddressCallBack = null,
- param = null,
- } = {}
- ) {
- const geoCodeParam = new SuperMap.GeoCodingParameter({
- address: address,
- fromIndex: fromIndex,
- toIndex: toIndex,
- filters: filters,
- prjCoordSys: prjCoordSys,
- maxReturn: maxReturn,
- })
- L.supermap
- .addressMatchService(_mapConfig.config.POI_URL)
- .code(geoCodeParam, function (addressObj) {
- if (outAddressCallBack) {
- outAddressCallBack(addressObj, param)
+ layers.push(markerLayer)
+ })
+ const markerGroup = L.layerGroup(layers)
+ featureGroup.addLayer(markerGroup)
+ layerGroup.set(layerName, markerGroup)
}
- })
- }
- /**
- * 测量距离
- * */
- function _measureingLine() {
- // 修改控件提示
- L.drawLocal.draw.handlers.polyline.tooltip.start = '单击开始绘制线'
- L.drawLocal.draw.handlers.polyline.tooltip.cont = '单击继续绘制线'
- L.drawLocal.draw.handlers.polyline.tooltip.end = '点击最后一点到终点'
- // 开启画线控件
- mapObj.drawPolyline.enable()
- map.once('draw:created', (e) => {
- const type = e.layerType
- const distancePolylineLayer = e.layer
- if (type === 'polyline') {
- // 使用polyline时
- // featureGroup.addLayer(distancePolylineLayer) // 将扎点的图层添加到地图上
- // layerGroup.set('distancePolylineLayer', distancePolylineLayer)
- // const distanceMeasureParam = new SuperMap.MeasureParameters(
- // distancePolylineLayer
- // )
- // L.supermap
- // .measureService(_mapConfig.config.QUERY_URL)
- // .measureDistance(distanceMeasureParam, function (serviceResult) {
- // const message = `总距离： ${serviceResult.result.distance.toFixed(
- // 4
- // )} 米`
- // // const elementHtml = createDistanceAndAreaPopup(message)
- // // const aa = `总距离：${ serviceResult.result.distance} 米
`
- // distancePolylineLayer
- // .bindPopup(elementHtml, {
- // className: 'multi-distance-and-area-popup-style',
- // })
- // .openPopup(distancePolylineLayer._latlngs[0])
- // })
- }
- })
- }
-
- /**
- * 测量面积
- * */
- function _measureingArea() {
- // 修改控件提示
- L.drawLocal.draw.handlers.polygon.tooltip.start = '单击开始绘制形状'
- L.drawLocal.draw.handlers.polygon.tooltip.cont = '单击继续绘制形状'
- L.drawLocal.draw.handlers.polygon.tooltip.end = '单击第一个点以关闭此形状'
- // 开启画多边形控件
- mapObj.drawPolygon.enable()
- map.once('draw:created', (e) => {
- const type = e.layerType
- const areaPolygonLayer = e.layer
- if (type === 'polygon') {
- // 使用polygon时
- // featureGroup.addLayer(areaPolygonLayer)
- // layerGroup.set('areaPolygonLayer', areaPolygonLayer)
- // const areaMeasureParam = new SuperMap.MeasureParameters(
- // areaPolygonLayer
- // )
- // L.supermap
- // .measureService(_mapConfig.config.QUERY_URL)
- // .measureArea(areaMeasureParam, function (serviceResult) {
- // const message = `总面积： ${serviceResult.result.area.toFixed(
- // 4
- // )} 平方米`
- // // const elementHtml = createDistanceAndAreaPopup(message)
- // // const content = '总面积：' + serviceResult.result.area + '平方米';
- // areaPolygonLayer
- // .bindPopup(elementHtml, {
- // className: 'multi-distance-and-area-popup-style',
- // })
- // .openPopup(areaPolygonLayer.getCenter())
- // })
- }
- })
- }
- /**
- * 绘制线
- * */
- function _drawingLine(callback) {
- // 修改控件提示
- L.drawLocal.draw.handlers.polyline.tooltip.start = '单击开始绘制线'
- L.drawLocal.draw.handlers.polyline.tooltip.cont = '单击继续绘制线'
- L.drawLocal.draw.handlers.polyline.tooltip.end = '点击最后一点到终点'
- // 开启画线控件
- mapObj.drawPolyline.enable()
- map.once('draw:created', (e) => {
- const type = e.layerType
- console.log(e)
- const distancePolylineLayer = e.layer
- if (type === 'polyline') {
- // 使用polyline时
- featureGroup.addLayer(distancePolylineLayer) // 将扎点的图层添加到地图上
- featureGroup.addTo(map)
- console.log('distancePolylineLayer', distancePolylineLayer)
- callback(distancePolylineLayer._latlngs)
- // const distanceMeasureParam = new SuperMap.MeasureParameters(distancePolylineLayer);
- // L.supermap
- // .measureService(_mapConfig.config.QUERY_URL)
- // .measureDistance(distanceMeasureParam, function(serviceResult) {
- // const message = `总距离： ${serviceResult.result.distance.toFixed(4)} 米`;
- // const elementHtml = createDistanceAndAreaPopup(message);
- // // const aa = `总距离：${ serviceResult.result.distance} 米
`
- // distancePolylineLayer.bindPopup(elementHtml, { className: 'multi-distance-and-area-popup-style' }).openPopup(distancePolylineLayer._latlngs[0]);
- // });
- }
- })
- }
- /**
- * 根据点位数据绘制线
- * */
- function _drawingLineByData(latlngs, callback, config) {
- let type = 'default'
- if (config && config.resType && config.secondType) {
- type = config.resType + config.secondType
- }
- let polyline = '' // 主线
- let polyline1 = '' // 辅助线1
- let polyline2 = '' // 辅助线2
- const decorator = ''
- switch (type) {
- case 'fireRoad':
- // 路网
- polyline = L.polyline.antPath(latlngs, {
- delay: 400,
- dashArray: [10, 20],
- weight: 5,
- color: '#2bbd91',
- pulseColor: '#8bffa9',
- paused: true,
- reverse: false,
- hardwareAccelerated: true,
+ /**
+ * 已知经纬度，根据数据对象添加要素到地图上，并且可瞬间点位该坐标
+ * @param layerName {String}图层名字
+ * @param point {Array} 经纬度数组形式
+ * @param data {Object} 实体对象
+ * @param layerConfigInfo {Object} 图层配置信息
+ * @param popupFlag {Boolean} 判断是否直接打开弹窗
+ * @param popupType {String} 弹窗类型
+ * @param className {String} class名字
+ */
+ const _addTheOneFeatureOnMapByPoint = function(
+ layerName,
+ point,
+ data,
+ layerConfigInfo, { popupFlag = true, popupType = 'general', className = '' } = {}
+ ) {
+ // 创建marker图层，绑定要素
+ // debugger;
+ const markerLayer = L.marker(point, {
+ icon: MapStyle.featureIcon(layerConfigInfo),
})
- break
- case 'fireBreak1':
- // 隔离网
- polyline = L.polyline(latlngs, {
- weight: 14,
- color: '#22ac38',
- opacity: 0.54,
- })
- polyline1 = L.polyline(latlngs, {
- weight: 2,
- offset: 6,
- className: 'fire-break-1',
- color: '#90ffa2',
- })
- polyline2 = L.polyline(latlngs, {
- weight: 2,
- offset: -6,
- className: 'fire-break-1',
- color: '#90ffa2',
- })
- polyline1.addTo(map)
- polyline2.addTo(map)
- // decorator = L.polylineDecorator(polyline, {
- // patterns: [
- // // defines a pattern of 10px-wide dashes, repeated every 20px on the line
- // {offset: 0, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})}
- // ]
- // }).addTo(map);
- break
- case 'fireBreak2':
- // 防火隔离带
- polyline = L.polyline(latlngs, {
- weight: 14,
- color: '#00aeca',
- opacity: 0.54,
- })
- polyline1 = L.polyline(latlngs, {
- weight: 2,
- offset: 6,
- className: 'fire-break-1',
- color: '#9df2ff',
- })
- polyline2 = L.polyline(latlngs, {
- weight: 2,
- offset: -6,
- className: 'fire-break-1',
- color: '#9df2ff',
- })
- polyline1.addTo(map)
- polyline2.addTo(map)
- break
- default:
- polyline = L.polyline(latlngs, { color: 'red' })
- }
-
- if (callback) {
- callback(polyline._latlngs)
- }
- // polyline.on('mouseover', e => {
- // console.log('图标点击e', e);
- // polyline.setText(' ► ', {repeat: true, attributes: {fill: 'red'}});
- // });
- polyline.addTo(map)
- // decorator = L.polylineDecorator(polyline, {
- // patterns: [
- // {offset: 0, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})},
- // // {offset: -7, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})},
- // ]
- // }).addTo(map);
- polylineArr.push(polyline)
- if (polyline1) {
- polylineArr.push(polyline1)
- }
- if (polyline2) {
- polylineArr.push(polyline2)
- }
- // polylineArr.push(decorator);
- // featureGroup.addLayer(polyline);
- // featureGroup.addTo(map);
- }
- function _removerPolyline() {
- if (polylineArr && polylineArr.length > 0) {
- polylineArr.map((item) => {
- item.remove()
- })
- polylineArr = []
- }
- }
- /**
- * 绘制面
- * */
- function _drawingArea(callback) {
- // 修改控件提示
- L.drawLocal.draw.handlers.polygon.tooltip.start = '单击开始绘制形状'
- L.drawLocal.draw.handlers.polygon.tooltip.cont = '单击继续绘制形状'
- L.drawLocal.draw.handlers.polygon.tooltip.end =
- '单击继续绘制形状,双击结束绘制'
- // 开启画多边形控件
- let areaPolygonLayer = null
- mapObj.drawPolygon.enable()
- map.once('draw:created', (e) => {
- const type = e.layerType
- areaPolygonLayer = e.layer
- if (type === 'polygon') {
- // 使用polygon时
- featureGroup.addLayer(areaPolygonLayer)
- // layerGroup.set('areaPolygonLayer', areaPolygonLayer)
- console.log('areaPolygonLayer', areaPolygonLayer._latlngs)
- if (callback) {
- callback(areaPolygonLayer._latlngs)
- }
- featureGroup.addTo(map)
- // const areaMeasureParam = new SuperMap.MeasureParameters(areaPolygonLayer);
- // L.supermap
- // .measureService(_mapConfig.config.QUERY_URL)
- // .measureArea(areaMeasureParam, function(serviceResult) {
- // const message = `总面积： ${serviceResult.result.area.toFixed(0)} 平方米`;
- // const elementHtml = createDistanceAndAreaPopup(message);
- // // const content = '总面积：' + serviceResult.result.area + '平方米';
- // areaPolygonLayer.bindPopup(elementHtml, { className: 'multi-distance-and-area-popup-style' }).openPopup(areaPolygonLayer.getCenter());
- // areaPolygonLayer.on('click', (e) => {
- // console.log(e);
- // });
- // });
- }
- })
- }
- /**
- * 绘制面数据
- * */
- function _drawingAreaByData(latlngs, callback, style, info) {
- console.log('面上图数据', latlngs)
- const polygon = L.polygon(
- latlngs,
- style || {
- color: '#fa655d',
- weight: 2,
- fillColor: 'fa655d',
- fillOpacity: 0.3,
- }
- )
- if (callback) {
- callback(polygon._latlngs)
- }
- polygon.addTo(map)
- PolygonArr.push(polygon)
- if (style) {
- polygon.on('click', (e) => {
- // 添加popup
- const latlng = polygon.getCenter()
- // const content = createManagerPopup(info)
- console.log('XXXXXXXXXXXXXXXXXX', info)
- const popup = L.popup({ className: 'detail-dialog' })
- .setLatLng(latlng)
- // .setContent(content)
- .openOn(map)
- mybus.$emit('trsSupermapPolygon', e.sourceTarget.options.resourceId)
- })
- }
- }
- // 清除面数据
- function _removerPolygon() {
- if (PolygonArr && PolygonArr.length > 0) {
- PolygonArr.map((item) => {
- item.remove()
- })
- PolygonArr = []
- }
- }
- // 添加arcGis服务图层
- function _addDynamicMapLayer(data) {
- var envLayer = L.esri.dynamicMapLayer({
- url: data.url,
- opacity: 0.8,
- layers: [0, 1, 2, 3, 4, 5, 6, 7, 8],
- })
- featureGroup.addLayer(envLayer)
- layerGroup.set(data.layerName, envLayer)
- // map.addLayer(envLayer)
- }
- /**
- * 路径分析
- * @param obj {Object} 地图初始化全局map对象（mapObject）
- * @param e {Object} 当前扎点对象
- * @param drawMarkerNum 扎点的数量
- * @param pathAnalysisMarkerPointNodes {Map} 存放点的对象
- * **/
- function _findPathDrawMarker(
- obj,
- e,
- drawMarkerNum,
- pathAnalysisMarkerPointNodes
- ) {
- const type = e.layerType
- obj.drawLayer = e.layer
- // 记录扎点的坐标
- if (type === 'marker') {
- // 使用drawMarker时
- let content = ''
- if (drawMarkerNum === 1) {
- content = '起点'
- } else {
- content = '经过点'
- }
- const currentSelectedPoint = []
- const lat = e.layer._latlng.lat
- const lng = e.layer._latlng.lng
- currentSelectedPoint.push(lat)
- currentSelectedPoint.push(lng)
- const marker = L.marker(currentSelectedPoint)
- marker
- .bindTooltip(content, {
- offset: L.point([0, -10]),
- direction: 'top',
- permanent: true,
- })
- .openTooltip()
- featureGroup.addLayer(marker)
- layerGroup.set('pathAnalysisMarker' + drawMarkerNum, marker)
- pathAnalysisMarkerPointNodes.set(
- 'pathAnalysisMarker' + drawMarkerNum,
- marker
- )
- obj.drawMarker = new L.Draw.Marker(obj.map)
- obj.drawMarker.initialize(obj.map)
- obj.drawMarker.enable()
- }
- }
-
- /**
- * 最佳路径分析
- * */
- function _findPathProcess(
- drawMarkerNum,
- pathAnalysisMarkerPointNodes,
- pathMarkerNum
- ) {
- // 当有两个点（起点与终点时）
- if (drawMarkerNum > 1) {
- // 获取最后一个图层，修改弹窗内容为终点
- const pointMarker = pathAnalysisMarkerPointNodes.get(
- 'pathAnalysisMarker' + drawMarkerNum
- )
- // 双击最后会加载两个节点，都应该删除
- // 清除最后一个图层，然后修改内容从新加载
- _removeLayerByLayerName('pathAnalysisMarker' + drawMarkerNum)
- _removeLayerByLayerName('pathAnalysisMarker' + (drawMarkerNum - 1))
- pathAnalysisMarkerPointNodes.delete('pathAnalysisMarker' + drawMarkerNum)
- pathAnalysisMarkerPointNodes.delete(
- 'pathAnalysisMarker' + (drawMarkerNum - 1)
- )
- drawMarkerNum -= 1
- pointMarker
- .bindTooltip('终点', {
- offset: L.point([0, -10]),
- direction: 'top',
- permanent: true,
- })
- .openTooltip()
- featureGroup.addLayer(pointMarker)
- layerGroup.set('pathAnalysisMarker' + drawMarkerNum, pointMarker)
- pathAnalysisMarkerPointNodes.set(
- 'pathAnalysisMarker' + drawMarkerNum,
- pointMarker
- )
-
- const nodes = []
- for (let i = 0; i < pathAnalysisMarkerPointNodes.size; i++) {
- const marker = pathAnalysisMarkerPointNodes.get(
- 'pathAnalysisMarker' + (i + 1)
- )
- const location = marker.getLatLng()
- const point = L.point(location.lng, location.lat)
- nodes.push(point)
- }
- // 创建最佳路径分析服务实例
- const findPathService = L.supermap.networkAnalystService(
- _mapConfig.config.NETWORK_URL
- )
- // 创建最佳路径分析参数实例
- const resultSetting = new SuperMap.TransportationAnalystResultSetting({
- returnEdgeFeatures: true,
- returnEdgeGeometry: true,
- returnEdgeIDs: true,
- returnNodeFeatures: true,
- returnNodeGeometry: true,
- returnNodeIDs: true,
- returnPathGuides: true,
- returnRoutes: true,
- })
- const analystParameter = new SuperMap.TransportationAnalystParameter({
- resultSetting: resultSetting,
- // weightFieldName: _convertCaseOfAttributes('SmLength')
- // weightFieldName: 'smlength',
- // weightFieldName: 'SMLENGTH',
- })
- const findPathParameter = new SuperMap.FindPathParameters({
- isAnalyzeById: false,
- nodes: nodes,
- parameter: analystParameter,
- })
- const myIcon = L.icon({
- iconUrl:
- './src/assets/common/multiScreen/mapTools/ambulance_map_standby.png',
- iconSize: [35, 35],
- })
- // 进行查找 todo
- findPathService.findPath(findPathParameter, function (serviceResult) {
- console.log('serviceResult', serviceResult)
- const result = serviceResult.result
- console.log(result)
- result.pathList.map(function (result) {
- const pathRouteLayer = L.geoJSON(result.route)
- // const pathGuideLayer = L.geoJSON(result.pathGuideItems, {
- // pointToLayer: function (geoPoints, latlng) {
- // pathMarkerNum += 1;
- // const pathMarker = L.marker(latlng, {icon: myIcon});
- // featureGroup.addLayer(pathMarker);
- // layerGroup.set('pathMarker' + pathMarkerNum, pathMarker);
- // },
- // filter: function (geoJsonFeature) {
- // if (geoJsonFeature.geometry && geoJsonFeature.geometry.type === 'Point') {
- // return true;
- // }
- // return false;
- // }
- // });
- // map.addLayer(pathRouteLayer);
- featureGroup.addLayer(pathRouteLayer)
- layerGroup.set('pathRouteLayer', pathRouteLayer)
- // map.addLayer(pathGuideLayer);
- // featureGroup.addLayer(pathGuideLayer);
- // layerGroup.set('pathGuideLayer', pathGuideLayer);
- })
- })
- } else {
- // toastr.warning("请先选择需要分析的起点与终点!");
- }
- }
-
- /**
- * 地址匹配正向匹配(基于高德地图)
- * @param address 地址
- * @param city 城市
- * @param pageSize 单页显示结果条数
- * @param pageIndex 页码
- * @param outAddressCallBack 输出查询结果的回调函数
- * @param param outAddressCallBack函数所需要接收的参数
- * @private
- */
- function _addressMatchCodeByAmap(
- address,
- {
- city = '青岛',
- pageSize = 100,
- pageIndex = 1,
- outAddressCallBack = null,
- param = null,
- } = {}
- ) {
- AMap.plugin('AMap.PlaceSearch', function () {
- var placeSearch = new AMap.PlaceSearch({
- city: city,
- pageSize: pageSize,
- pageIndex: pageIndex,
- })
- placeSearch.search(address, function (status, result) {
- console.log(result)
- if (outAddressCallBack) {
- outAddressCallBack(result, param)
- }
- })
- })
- }
-
- /**
- * 根据sql查询图层数据
- * @param configInfo {Object}图层配置对象
- * @param sql {String} sql字符串
- * @param callBackFun {Function} 获取图层数据的回调函数
- * @param callBackParams {Object||Array||String} 回调函数中接收的参数数据
- * @param layerName {String} 图层名称，如果为空则不上图，不为空则根据该名字作为图层名上图
- * @param getLayerPopupInfo {Function} 图层弹窗方法
- * @param className {String} 弹窗样式
- * @private
- */
- function _queryLayersBySql(
- configInfo,
- {
- sql = 'SMID >0',
- callBackFun = null,
- callBackParams = null,
- layerName = null,
- getLayerPopupInfo = null,
- className = '',
- } = {}
- ) {
- const sqlParam = new SuperMap.QueryBySQLParameters({
- queryParams: {
- name: configInfo.layerName,
- attributeFilter: sql,
- },
- })
- L.supermap
- .queryService(_mapConfig.config.QUERY_URL)
- .queryBySQL(sqlParam, (serviceResult) => {
- if (callBackFun) {
- callBackFun(serviceResult, configInfo, callBackParams)
- }
- if (layerName) {
- const resultLayerConfig = L.geoJSON(
- serviceResult.result.recordsets[0].features,
- {
- onEachFeature: (feature, layer) => {
- layer.setIcon(MapStyle.featureIcon(configInfo))
- layer.title = layerName
- layer.configInfo = configInfo
- // 绑定弹窗事件，实时请求弹窗内容
- layer.on('click', function (e) {
- if (!getLayerPopupInfo) {
- const uuid =
- e.sourceTarget.feature.properties[
- _convertCaseOfAttributes('uuid')
- ]
- const layerConfigInfo = e.sourceTarget.configInfo
- const location = [e.latlng.lat, e.latlng.lng]
- const latlng = L.latLng(location)
- getLayerPopupInfo(uuid, layerConfigInfo).then(
- (response) => {
- response.allMapObject = {
- mapObj: mapObj,
- }
- // const elementHtml = createGeneralPopup(response)
- L.popup({ className: className })
- .setLatLng(latlng)
- // .setContent(elementHtml)
- .openOn(map)
- }
- )
- }
- })
- },
+ const latLng = markerLayer.getLatLng()
+ featureGroup.addLayer(markerLayer)
+ layerGroup.set(layerName, markerLayer)
+ if (data !== '') {
+ const responseData = {
+ layerConfigInfo: layerConfigInfo,
+ entityData: data,
+ allMapObject: { mapObj: mapObj },
}
- )
- featureGroup.addLayer(resultLayerConfig)
- layerGroup.set(layerName, resultLayerConfig)
- }
- })
- }
- /**
- * 把单个单位添加到地图上
- * @param paramObject 参数对象
- * @return {*} 创建的图标，用来删除
- * @private
- */
- const _addPointOnMap = function (paramObject) {
- return addPointOnMap(paramObject, mapObj, featureGroup, layerGroup)
- }
- const _addResourceOnMapWithoutSuperMapCluster = function (
- features,
- url,
- layerName,
- createPopupFun,
- url2
- ) {
- console.log(
- '_addResourceOnMapWithoutSuperMapCluster===============>',
- features,
- url,
- layerName,
- createPopupFun,
- url2
- )
- // 如果资源要素数量为0，则说明该种资源没有记录
- // if (features.length < 1) {
- // return Promise.resolve(0);
- // }
- // 根据类型返回具体用聚合图层的样式。
- // const defaultStyle = typeToStyle(layerName)
- // 创建图层
- // if (layerGroup.get(layerName)) {
- // const haveLayers = layerGroup.get(layerName).getLayers()
- // debugger;
- // haveLayers.map(item=> {
- // layerGroup.removeLayer(item)
- // })
-
- // }
- _removeLayerByLayerName(layerName)
- let layers = null
- // 判断是否是聚合图层
- layers = createMarkerClusterLayer()
- const icon1 = createDefaultFeatureStyle({
- img: url,
- iconSize: [33, 33],
- })
- const icon2 = createDefaultFeatureStyle({
- img: url2,
- iconSize: [33, 33],
- })
- features.map((feature) => {
- var bounds = map.getBounds()
- // console.log("看看有没有坐标",feature.latLng);
- if ( feature.hasOwnProperty('latLng')) {
- let icon = feature.active?icon2:icon1
- const marker = L.marker(feature.latLng, { icon })
- if (createPopupFun !== null) {
- marker.uuid = feature.uuid || ''
- marker.resId = feature.resId || ''
- marker.on('click', async (e) => {
- if (feature.resourceName === 'video') {
- const params = [feature.indexCode]
- DS.openVideo(params)
+ let elementHtml = ''
+ if (popupType === 'gudEvn') {
+ // elementHtml = createGudEvnPopup(responseData)
+ } else if (popupType === 'storage') {
+ // elementHtml = createStorageAndGoodsPopup(responseData)
} else {
- const elementHtml = createPopupFun(feature)
- if (elementHtml) {
- console.log(
- 'L._addReMapWithter===============>',
- feature.latLng,
- elementHtml,
- map
- )
- if (feature.type == 'videoSurveillance') {
- L.popup({ className: 'detail-dialog', offset: [168, 240] })
- .setLatLng(feature.latLng)
- .setContent(elementHtml)
- .openOn(map)
- map.flyTo(feature.latLng)
- } else {
- L.popup({ className: 'detail-dialog' })
- .setLatLng(feature.latLng)
- .setContent(elementHtml)
- .openOn(map)
- }
- }
+ // elementHtml = createGeneralPopup(responseData)
+ }
+ // 对事件点设置单击事件，展示弹窗内容
+ if (popupFlag) {
+ markerLayer.bindPopup(elementHtml, { className: className }).openPopup()
+ } else {
+ markerLayer.on('click', function() {
+ L.popup({ className: className })
+ .setLatLng(latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ })
}
- })
}
- marker.on('click', e=>{
- console.log('点位数据', e)
-
- mybus.emit('pointMarkerClick', feature)
- })
- layers.addLayer(marker)
- }
- })
- featureGroup.addLayer(layers)
- layerGroup.set(layerName, layers)
- }
- /**
- * 点击展示弹窗
- */
- const _addPopOnMap = function (feature, url, layerName, createPopupFun) {
- console.log(
- 'addPopOnMap===============>',
- feature,
- url,
- layerName,
- createPopupFun,
- map
- )
- let layers = null
- // 判断是否是聚合图层
- layers = createMarkerClusterLayer()
- // 判断是否是聚合图层
- const icon = createDefaultFeatureStyle({
- img: url || 'the-head.png',
- iconSize: [36, 36],
- })
- // console.log("看看有没有坐标",feature.latLng);
- if (feature.hasOwnProperty('latLng')) {
- const marker = L.marker(feature.latLng, { icon })
- if (createPopupFun !== null) {
- marker.uuid = feature.uuid || ''
- marker.resId = feature.resId || ''
- const elementHtml = createPopupFun(feature)
- if (elementHtml) {
- console.log(
- 'L.popup===============>',
- feature.latLng,
- elementHtml,
- map
- )
- L.popup({ className: 'detail-dialog' })
- .setLatLng(feature.latLng)
- .setContent(elementHtml)
- .openOn(map)
- }
- }
- layers.addLayer(marker)
+ map.flyTo(latLng, 10, { duration: 0.15 })
}
- featureGroup.addLayer(layers)
- layerGroup.set(layerName, layers)
- }
- /**
- * 构建promise，使用uuid去超图服务查询features，得到结果就把promise状态置为已决议，并返回features
- * @param idArray 资源的唯一标识数组，视频监控是camera_index_code，其他都是uuid
- * @param layerConfigInfo 图层配置信息
- * @param type 资源类型，只有视频监控用的camera_index_code，其他都是uuid
- * @returns {Promise}
- * @private
- */
- const _createPromiseByQueryService = function (
- idArray,
- layerConfigInfo,
- type
- ) {
- return createPromiseByQueryService(idArray, layerConfigInfo, type)
- }
- /**
- * 资源上图通用方法
- * @param paramObject 参数数组
- * @return {*}
- * @private
- */
- const _addResourceOnMap = function (paramObject) {
- return addResourceOnMap(paramObject, mapObj, featureGroup, layerGroup)
- }
- const _addResourceOnMapNew = function (
- features,
- config,
- getLayerPopupInfo,
- createPopupFun
- ) {
- return addResourceOnMapNew(
- features,
- config,
- getLayerPopupInfo,
- createPopupFun,
- mapObj,
- featureGroup,
- layerGroup
- )
- }
- const _getLayerPopupInfo = function (
- uuid,
- layerConfigInfo,
- type,
- latLng,
- createPopupFun,
- getLayerPopupInfo,
- popupClassName
- ) {
- return myGetLayerPopupInfo(
- uuid,
- layerConfigInfo,
- type,
- mapObj,
- latLng,
- createPopupFun,
- getLayerPopupInfo,
- popupClassName
- )
- }
- const _addResourceOnMapWithoutSuperMap = function (
- features,
- url,
- layerName,
- createPopupFun,
- WS
- ) {
- // console.log('这里的数据', features);
- // debugger;
- return addResourceOnMapWithoutSuperMap(
- features,
- url,
- layerName,
- createPopupFun,
- WS,
- featureGroup,
- layerGroup,
- map
- )
- }
- const _addPointsToMap = function (
- features,
- url,
- layerName,
- createPopupFun,
- WS
- ) {
- // console.log('这里的数据', features);
- // debugger;
- return addPointsToMap(
- features,
- url,
- layerName,
- createPopupFun,
- WS,
- featureGroup,
- layerGroup,
- map
- )
- }
- const _addResourceOnMapWithoutSuper = function (
- features,
- url,
- layerName,
- createPopupFun,
- WS
- ) {
- // console.log('这里的数据', features);
- // debugger;
- return addResourceOnMapWithoutSuper(
- features,
- url,
- layerName,
- createPopupFun,
- WS,
- featureGroup,
- layerGroup,
- map
- )
- }
- const _addPolygonToMap = function (a, b, c, d) {
- var polygon = L.polygon([a, b, c, d], {
- color: '#A33B42',
- fillColor: '#A75A81',
- fillOpacity: 0.5,
- })
- featureGroup.addLayer(polygon)
- }
- const _addNameToMap = function (config) {
- // you can set .my-div-icon styles in CSS
- config.map((item) => {
- var myIcon = L.divIcon({ html: item.name })
- L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(
- mapObj.map
- )
- })
- }
- const _addMountainToMap = function (config) {
- // you can set .my-div-icon styles in CSS
- const myIcon = L.icon({
- iconUrl: '/src/supermap/image/mountain.png',
- iconSize: [32, 32],
- })
- config.map((item) => {
- L.marker([item.latLng.lat, item.latLng.lng], {
- icon: myIcon,
- title: item.name,
- }).addTo(mapObj.map)
- })
- }
- const _addMountainLayerToMap = function (config) {
- var myStyle = {
- color: 'green',
- weight: 2,
- opacity: 1,
- fillColor: 'green',
- fillOpacity: 0.2,
+ /**
+ * 根据图层对象直接定位并直接弹出弹窗
+ * @param layer {Object} 图层对象
+ * @param contentHTML {HTML Element} Dom对象
+ * @param className {String} 类名字
+ * */
+ function _locationAndCreatePopup(
+ layer,
+ contentHTML, { className = '' } = {}
+ ) {
+ // 生成弹窗内容
+ const latLng = layer.getLatLng()
+ map.flyTo(latLng, 13, { duration: 0.3 })
+ layer.bindPopup(contentHTML, { className: className }).openPopup()
}
- // const JsonUrl = '/src/supermap/json/shanxi_polygon.json';
- // var data = $.parseJSON($.ajax({
- // url: JsonUrl, // json文件位置，文件名
- // dataType: 'json', // 返回数据格式为json
- // async: false
- // }).responseText);
- // 绘制地图边界
- L.geoJSON(data, {
- style: myStyle,
- }).addTo(mapObj.map)
- // you can set .my-div-icon styles in CSS
- // var myIcon = './image/mountain.png';
- // config.map(item => {
- // L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(mapObj.map);
- // });
- }
- const _addCircleToMap = function (latLng, r) {
- // L.circle([latLng.lat, latLng.lng], { radius: r }).addTo(mapObj.map)
- const polygon = L.circle([latLng.lat, latLng.lng], { radius: r })
- polygon.addTo(map)
- PolygonArr.push(polygon)
- }
- const _mapPainyEnable = function () {
- map.MapPaint.enable()
- map.addControl(new MapPaint.SwitchControl())
- }
- // 热力图
- const _thermodynamic = function (latLng, r, type) {
- // const layers = []
- // latLng, r, strong
- const thermodynamic = latLng
- const heatLayer = L.heatLayer(thermodynamic, {
- radius: r,
- minOpacity: 0.4,
- blur: 10,
- gradient: {
- 0.5: 'green',
- 0.7: 'lime',
- 0.8: 'yellow',
- 0.9: 'orange',
- 1: 'red',
- },
- })
- // layers.addLayer(heatLayer1)
- // const markerGroup = L.layerGroup(layers)
- featureGroup.addLayer(heatLayer)
- layerGroup.set(type, heatLayer)
- // debugger
- }
- const _addPathToMap = function (latLng, color) {
- // console.log(latLng)
- // debugger
- const polyline = L.polyline(latLng, { color: color })
- polyline.addTo(map)
- polylineArr.push(polyline)
- // debugger
- // map.fitBounds(polyline.getBounds())
- }
- return {
- // 按图层配置名称删除
- removeLayerByLayerName: _removeLayerByLayerName,
- removeLayersByLayerNameArray: _removeLayersByLayerNameArray,
- clearAllLayers: _clearAllLayers,
- // 增删改要素
- updateResourceFeature: _updateResourceFeature,
- createPopupConfigInfo: _createPopupConfigInfo,
- addResourceFeature: _addResourceFeature,
- hasLocationInfo: _hasLocationInfo,
- getLocale: _getLocale,
- deleteResourceFeature: _deleteResourceFeature,
- drawMarkerPopupUniversalFun: _drawMarkerPopupUniversalFun,
- addExternalFunToObj: _addExternalFunToObj,
- changeMap: _changeMap,
- ZXYRenderMapSwitch: _ZXYRenderMapSwitch,
- addFeatureArrayOnMap: _addFeatureArrayOnMap,
- addTheOneFeatureOnMapByPoint: _addTheOneFeatureOnMapByPoint,
- locationAndCreatePopup: _locationAndCreatePopup,
- showLayersByUuidArray: _showLayersByUuidArray,
- showCameraByIndexCodeArray: _showCameraByIndexCodeArray,
- convertCaseOfAttributes: _convertCaseOfAttributes,
- addressMatchCode: _addressMatchCode,
- addressMatchCodeByAmap: _addressMatchCodeByAmap,
- queryLayersBySql: _queryLayersBySql,
- measureingLine: _measureingLine,
- measureingArea: _measureingArea,
- findPathDrawMarker: _findPathDrawMarker,
- findPathProcess: _findPathProcess,
- // 添加单个点位到地图上
- addPointOnMap: _addPointOnMap,
- // 使用uuid集合去超图服务查询资源要素，得到结果就把promise状态置为已决议，并返回features
- createPromiseByQueryService: _createPromiseByQueryService,
- // 资源上图通用方法
- addResourceOnMap: _addResourceOnMap,
- drawMarkerThroughPoint: _drawMarkerThroughPoint,
- changeMarkerTooltip: _changeMarkerTooltip,
- mapFlyTo: _mapFlyTo, // 地图视角移动
- showVideoOnMap: _showVideoOnMap, // 实时视频展示及播放
- addImgMaker: _addImgMaker,
- getLayerPopupInfo: _getLayerPopupInfo,
- addResourceOnMapWithoutSuper: _addResourceOnMapWithoutSuperMap,
- addResourceOnMapWithoutSuperMap: _addResourceOnMapWithoutSuper,
- addPolygonToMap: _addPolygonToMap,
- addResourceOnMapNew: _addResourceOnMapNew,
- addNameToMap: _addNameToMap,
- addMountainToMap: _addMountainToMap,
- addMountainLayerToMap: _addMountainLayerToMap,
- drawingLine: _drawingLine,
- drawingArea: _drawingArea,
- drawingLineByData: _drawingLineByData,
- drawingAreaByData: _drawingAreaByData,
- removerPolyline: _removerPolyline,
- removerPolygon: _removerPolygon,
- mapPainyEnable: _mapPainyEnable,
- openPopup: _openPopup,
- openPopupVideoSurveillance: _openPopupVideoSurveillance,
- closeAllPopup: _closeAllPopup,
- addMovingMarker: _addMovingMarker,
- addResourceOnMapWithoutSuperMapCluster:
- _addResourceOnMapWithoutSuperMapCluster,
- addPopOnMap: _addPopOnMap,
- addDynamicMapLayer: _addDynamicMapLayer,
- addPointsToMap: _addPointsToMap,
- addCircleToMap: _addCircleToMap,
- thermodynamic: _thermodynamic,
- addPathToMap: _addPathToMap,
- }
-}
+ /**
+ * @description: 视角移动
+ * @param {*} latLng {lat: , lng }
+ * @param {*} zoom zoom
+ * @param {*} duration duration
+ * @return {*}
+ */
+ function _mapFlyTo(latLng, zoom, duration) {
+ console.log('ee', latLng, zoom, duration)
+ map.flyTo(latLng, zoom || 15, { duration: duration || 0.15 })
+ }
+ /**
+ * @description: 展示视频资源点位 大华点击弹窗播放视频
+ * @param {*} inconConfig
+ * @param {*} dataList
+ * @return {*}
+ */
+ function _showVideoOnMap(inconConfig, layerName, dataList, DS) {
+ _removeLayerByLayerName(layerName)
+ const markers = L.markerClusterGroup()
+ dataList.map((item) => {
+ const point = {
+ lat: item.latitude,
+ lng: item.longitude,
+ }
+ const icon = MapStyle.featureIcon(inconConfig)
+ const markerLayer = L.marker(point, { icon: icon })
+ markers.addLayer(markerLayer)
+ markerLayer.on('click', function() {
+ console.log('积水点播放视频', item)
+ item.indexCode = item.indexCode || item.index_code
+ const params = [item.indexCode]
+ DS.openVideo(params)
+ })
+ })
+ featureGroup.clearLayers()
+ // const markerGroup = L.layerGroup(markers);
+ featureGroup.addLayer(markers)
+ // layerGroup.set(layerName, markerGroup);
+ }
+ /**
+ * 根据UUID数组加载图层
+ * @param uuidArray {Array} uuid数组
+ * @param layerName {String} 图层名称
+ * @param configInfo {Object} 图层的配置信息对象
+ * @param getLayerPopupInfo {Function} 图层弹窗回调函数
+ * @param outFeaturesCallBack {Function} 输出经过超图查询的数据对象数组
+ * @param getStoragePopupInfo {Function} 物资弹窗
+ * @param entityList {Array} 与uuidArray相对应的实体数组，用于输出用（可选）
+ * @param searchKey {String} 搜索关键字--主要用于物资的搜索
+ */
+ function _showLayersByUuidArray(
+ uuidArray,
+ layerName,
+ configInfo, {
+ outFeaturesCallBack = null,
+ getLayerPopupInfo = null,
+ getStoragePopupInfo = null,
+ entityList = null,
+ searchKey = '',
+ } = {}
+ ) {
+ let authorityFilter = ''
+ // 当UUID的个数小于1000时
+ if (uuidArray.length <= 1000) {
+ const authorityFilter1 = "'" + uuidArray.join("','") + "'"
+ authorityFilter = 'UUID in (' + authorityFilter1 + ')'
+ } else {
+ // 当UUID的个数大于1000
+ const count = Math.floor(uuidArray.length / 1000) // 向下取整
+ for (let i = 0; i <= count; i++) {
+ const uuidSplice = uuidArray.slice(i * 1000, (i + 1) * 1000)
+ const authorityFilterString = "'" + uuidSplice.join("','") + "'"
+ const authorityFilterSplice = 'UUID in (' + authorityFilterString + ')'
+ if (i === 0) {
+ // 第一次拼接时，不需要Or
+ authorityFilter = authorityFilterSplice
+ } else {
+ // 第N次拼接时，需要Or
+ authorityFilter = authorityFilter + ' or ' + authorityFilterSplice
+ }
+ }
+ }
+ const queryUrl = _mapConfig.config.QUERY_URL
+ const sqlParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ name: configInfo.layerName,
+ attributeFilter: authorityFilter,
+ },
+ })
+ L.supermap.queryService(queryUrl).queryBySQL(sqlParam, (serviceResult) => {
+ if (outFeaturesCallBack !== null) {
+ // outFeaturesCallBack(serviceResult,layerName,entityList);
+ outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
+ }
+ const resultLayerConfig = L.geoJSON(
+ serviceResult.result.recordsets[0].features, {
+ onEachFeature: (feature, layer) => {
+ layer.setIcon(MapStyle.featureIcon(configInfo, { zoom: map._zoom }))
+ layer.title = layerName
+ layer.configInfo = configInfo
+ layer.on('click', function(e) {
+ // const uuid = e.sourceTarget.feature.properties.UUID;
+ const uuid =
+ e.sourceTarget.feature.properties[
+ _convertCaseOfAttributes('UUID')
+ ]
+ const layerConfigInfo = e.sourceTarget.configInfo
+ const location = [e.latlng.lat, e.latlng.lng]
+ const latlng = L.latLng(location)
+ // 绑定通用弹窗事件，实时请求弹窗内容
+ if (getLayerPopupInfo !== null) {
+ getLayerPopupInfo(uuid, layerConfigInfo).then((response) => {
+ response.allMapObject = {
+ mapObj: mapObj,
+ }
+ // const elementHtml = createGeneralPopup(response)
+ L.popup({ className: 'multi-general-popup-style' })
+ .setLatLng(latlng)
+ // .setContent(elementHtml)
+ .openOn(map)
+ })
+ }
+ if (getStoragePopupInfo !== null) {
+ getStoragePopupInfo(uuid, layerConfigInfo, searchKey).then(
+ (response) => {
+ response.allMapObject = {
+ mapObj: mapObj,
+ }
+ // const elementHtml = createStorageAndGoodsPopup(response)
+ L.popup({ className: 'multi-general-popup-style' })
+ .setLatLng(latlng)
+ // .setContent(elementHtml)
+ .openOn(map)
+ }
+ )
+ }
+ })
+ },
+ }
+ )
+ _removeLayerByLayerName(layerName)
+ featureGroup.addLayer(resultLayerConfig)
+ layerGroup.set(layerName, resultLayerConfig)
+ })
+ }
+
+ /**
+ * 根据cameraIndexCode加载视频图层（普通定位，非聚合使用）
+ * @param cameraIndexCode {Array} cameraIndexCode数组
+ * @param layerName {String} 图层名称
+ * @param configInfo {Object} 图层的配置信息对象
+ * @param getLayerPopupInfo {Function} 获取弹窗信息的方法
+ * @param outFeaturesCallBack {Function} 输出经过超图查询的数据对象数组
+ * @param entityList {Array} 与uuidArray相对应的实体数组，用于输出用（可选）
+ */
+ function _showCameraByIndexCodeArray(
+ cameraIndexCode,
+ layerName,
+ configInfo, {
+ getLayerPopupInfo = null,
+ outFeaturesCallBack = null,
+ entityList = null,
+ } = {}
+ ) {
+ let authorityFilter = ''
+ if (cameraIndexCode.length <= 1000) {
+ const authorityFilterStr = "'" + cameraIndexCode.join("','") + "'"
+ authorityFilter = 'CAMERA_INDEX_CODE in (' + authorityFilterStr + ')'
+ } else {
+ const count = Math.floor(cameraIndexCode.length / 1000) // 向下取整
+ for (var i = 0; i <= count; i++) {
+ const cameraIndexCodeSplice = cameraIndexCode.slice(
+ i * 1000,
+ (i + 1) * 1000
+ )
+ const authorityFilterString =
+ "'" + cameraIndexCodeSplice.join("','") + "'"
+ const authorityFilterSplice =
+ 'CAMERA_INDEX_CODE in (' + authorityFilterString + ')'
+ if (i === 0) {
+ // 第一次拼接时，不需要Or
+ authorityFilter = authorityFilterSplice
+ } else {
+ // 第N次拼接时，需要Or
+ authorityFilter = authorityFilter + ' or ' + authorityFilterSplice
+ }
+ }
+ }
+ const queryUrl = _mapConfig.config.QUERY_URL
+ const reservoirParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ // name: configInfo.datasetNames,
+ name: configInfo.layerName,
+ attributeFilter: authorityFilter,
+ },
+ })
+ L.supermap
+ .queryService(queryUrl)
+ .queryBySQL(reservoirParam, function(serviceResult) {
+ // if (serviceResult.result.recordsets[0].features.features.length === 0) {
+ // console.log('未查询到视频');
+ // return;
+ // }
+ if (outFeaturesCallBack !== null) {
+ // outFeaturesCallBack(serviceResult,layerName,entityList);
+ outFeaturesCallBack(serviceResult, layerName, entityList, configInfo)
+ }
+ const searchCameraLayer = L.geoJSON(
+ serviceResult.result.recordsets[0].features, {
+ onEachFeature: (feature, layer) => {
+ layer.setIcon(MapStyle.featureIcon(configInfo))
+ layer.configInfo = configInfo
+ // 给查询出的每一个点添加点击弹窗事件
+ // 绑定弹窗事件，实时请求弹窗内容
+ if (getLayerPopupInfo !== null) {
+ layer.on('click', function(e) {
+ const indexCode =
+ e.sourceTarget.feature.properties[
+ _convertCaseOfAttributes('CAMERA_INDEX_CODE')
+ ]
+ const layerConfigInfo = e.sourceTarget.configInfo
+ const location = [e.latlng.lat, e.latlng.lng]
+ const latlng = L.latLng(location)
+ getLayerPopupInfo(indexCode, layerConfigInfo).then(
+ (response) => {
+ response.allMapObject = {
+ mapObj: mapObj,
+ }
+ // const elementHtml = createGeneralPopup(response)
+ L.popup({ className: 'multi-general-popup-style' })
+ .setLatLng(latlng)
+ // .setContent(elementHtml)
+ .openOn(map)
+ }
+ )
+ })
+ }
+ },
+ }
+ )
+ featureGroup.addLayer(searchCameraLayer)
+ layerGroup.set(layerName, searchCameraLayer)
+ })
+ }
+ /**
+ * 根据数据库类型对属性进行大小写转换
+ * @param attribute
+ * @returns {*}
+ */
+ function _convertCaseOfAttributes(attribute) {
+ if (_mapConfig.config.DATABASE_TYPE === 'Oracle') {
+ return attribute.toUpperCase()
+ } else if (_mapConfig.config.DATABASE_TYPE === 'Highgo') {
+ return attribute.toLowerCase()
+ }
+ }
+
+ /**
+ * 地址匹配正向匹配
+ * @param address 地址
+ * @param fromIndex 设置返回对象的起始索引值
+ * @param toIndex 设置返回对象的结束索引值
+ * @param filters 过滤字段，限定查询区域
+ * @param prjCoordSys 查询结果的坐标系
+ * @param maxReturn 最大返回结果数
+ * @param outAddressCallBack 输出查询结果的回调函数
+ * @param param outAddressCallBack函数所需要接收的参数
+ * @private
+ */
+ function _addressMatchCode(
+ address, {
+ fromIndex = null,
+ toIndex = null,
+ filters = null,
+ prjCoordSys = null,
+ maxReturn = null,
+ outAddressCallBack = null,
+ param = null,
+ } = {}
+ ) {
+ const geoCodeParam = new SuperMap.GeoCodingParameter({
+ address: address,
+ fromIndex: fromIndex,
+ toIndex: toIndex,
+ filters: filters,
+ prjCoordSys: prjCoordSys,
+ maxReturn: maxReturn,
+ })
+ L.supermap
+ .addressMatchService(_mapConfig.config.POI_URL)
+ .code(geoCodeParam, function(addressObj) {
+ if (outAddressCallBack) {
+ outAddressCallBack(addressObj, param)
+ }
+ })
+ }
+ /**
+ * 测量距离
+ * */
+ function _measureingLine() {
+ // 修改控件提示
+ L.drawLocal.draw.handlers.polyline.tooltip.start = '单击开始绘制线'
+ L.drawLocal.draw.handlers.polyline.tooltip.cont = '单击继续绘制线'
+ L.drawLocal.draw.handlers.polyline.tooltip.end = '点击最后一点到终点'
+ // 开启画线控件
+ mapObj.drawPolyline.enable()
+ map.once('draw:created', (e) => {
+ const type = e.layerType
+ const distancePolylineLayer = e.layer
+ if (type === 'polyline') {
+ // 使用polyline时
+ // featureGroup.addLayer(distancePolylineLayer) // 将扎点的图层添加到地图上
+ // layerGroup.set('distancePolylineLayer', distancePolylineLayer)
+ // const distanceMeasureParam = new SuperMap.MeasureParameters(
+ // distancePolylineLayer
+ // )
+ // L.supermap
+ // .measureService(_mapConfig.config.QUERY_URL)
+ // .measureDistance(distanceMeasureParam, function (serviceResult) {
+ // const message = `总距离： ${serviceResult.result.distance.toFixed(
+ // 4
+ // )} 米`
+ // // const elementHtml = createDistanceAndAreaPopup(message)
+ // // const aa = `总距离：${ serviceResult.result.distance} 米
`
+ // distancePolylineLayer
+ // .bindPopup(elementHtml, {
+ // className: 'multi-distance-and-area-popup-style',
+ // })
+ // .openPopup(distancePolylineLayer._latlngs[0])
+ // })
+ }
+ })
+ }
+
+ /**
+ * 测量面积
+ * */
+ function _measureingArea() {
+ // 修改控件提示
+ L.drawLocal.draw.handlers.polygon.tooltip.start = '单击开始绘制形状'
+ L.drawLocal.draw.handlers.polygon.tooltip.cont = '单击继续绘制形状'
+ L.drawLocal.draw.handlers.polygon.tooltip.end = '单击第一个点以关闭此形状'
+ // 开启画多边形控件
+ mapObj.drawPolygon.enable()
+ map.once('draw:created', (e) => {
+ const type = e.layerType
+ const areaPolygonLayer = e.layer
+ if (type === 'polygon') {
+ // 使用polygon时
+ // featureGroup.addLayer(areaPolygonLayer)
+ // layerGroup.set('areaPolygonLayer', areaPolygonLayer)
+ // const areaMeasureParam = new SuperMap.MeasureParameters(
+ // areaPolygonLayer
+ // )
+ // L.supermap
+ // .measureService(_mapConfig.config.QUERY_URL)
+ // .measureArea(areaMeasureParam, function (serviceResult) {
+ // const message = `总面积： ${serviceResult.result.area.toFixed(
+ // 4
+ // )} 平方米`
+ // // const elementHtml = createDistanceAndAreaPopup(message)
+ // // const content = '总面积：' + serviceResult.result.area + '平方米';
+ // areaPolygonLayer
+ // .bindPopup(elementHtml, {
+ // className: 'multi-distance-and-area-popup-style',
+ // })
+ // .openPopup(areaPolygonLayer.getCenter())
+ // })
+ }
+ })
+ }
+ /**
+ * 绘制线
+ * */
+ function _drawingLine(callback) {
+ // 修改控件提示
+ L.drawLocal.draw.handlers.polyline.tooltip.start = '单击开始绘制线'
+ L.drawLocal.draw.handlers.polyline.tooltip.cont = '单击继续绘制线'
+ L.drawLocal.draw.handlers.polyline.tooltip.end = '点击最后一点到终点'
+ // 开启画线控件
+ mapObj.drawPolyline.enable()
+ map.once('draw:created', (e) => {
+ const type = e.layerType
+ console.log(e)
+ const distancePolylineLayer = e.layer
+ if (type === 'polyline') {
+ // 使用polyline时
+ featureGroup.addLayer(distancePolylineLayer) // 将扎点的图层添加到地图上
+ featureGroup.addTo(map)
+ console.log('distancePolylineLayer', distancePolylineLayer)
+ callback(distancePolylineLayer._latlngs)
+ // const distanceMeasureParam = new SuperMap.MeasureParameters(distancePolylineLayer);
+ // L.supermap
+ // .measureService(_mapConfig.config.QUERY_URL)
+ // .measureDistance(distanceMeasureParam, function(serviceResult) {
+ // const message = `总距离： ${serviceResult.result.distance.toFixed(4)} 米`;
+ // const elementHtml = createDistanceAndAreaPopup(message);
+ // // const aa = `总距离：${ serviceResult.result.distance} 米
`
+ // distancePolylineLayer.bindPopup(elementHtml, { className: 'multi-distance-and-area-popup-style' }).openPopup(distancePolylineLayer._latlngs[0]);
+ // });
+ }
+ })
+ }
+ /**
+ * 根据点位数据绘制线
+ * */
+ function _drawingLineByData(latlngs, callback, config) {
+ let type = 'default'
+ if (config && config.resType && config.secondType) {
+ type = config.resType + config.secondType
+ }
+ let polyline = '' // 主线
+ let polyline1 = '' // 辅助线1
+ let polyline2 = '' // 辅助线2
+ const decorator = ''
+ switch (type) {
+ case 'fireRoad':
+ // 路网
+ polyline = L.polyline.antPath(latlngs, {
+ delay: 400,
+ dashArray: [10, 20],
+ weight: 5,
+ color: '#2bbd91',
+ pulseColor: '#8bffa9',
+ paused: true,
+ reverse: false,
+ hardwareAccelerated: true,
+ })
+ break
+ case 'fireBreak1':
+ // 隔离网
+ polyline = L.polyline(latlngs, {
+ weight: 14,
+ color: '#22ac38',
+ opacity: 0.54,
+ })
+ polyline1 = L.polyline(latlngs, {
+ weight: 2,
+ offset: 6,
+ className: 'fire-break-1',
+ color: '#90ffa2',
+ })
+ polyline2 = L.polyline(latlngs, {
+ weight: 2,
+ offset: -6,
+ className: 'fire-break-1',
+ color: '#90ffa2',
+ })
+ polyline1.addTo(map)
+ polyline2.addTo(map)
+ // decorator = L.polylineDecorator(polyline, {
+ // patterns: [
+ // // defines a pattern of 10px-wide dashes, repeated every 20px on the line
+ // {offset: 0, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})}
+ // ]
+ // }).addTo(map);
+ break
+ case 'fireBreak2':
+ // 防火隔离带
+ polyline = L.polyline(latlngs, {
+ weight: 14,
+ color: '#00aeca',
+ opacity: 0.54,
+ })
+ polyline1 = L.polyline(latlngs, {
+ weight: 2,
+ offset: 6,
+ className: 'fire-break-1',
+ color: '#9df2ff',
+ })
+ polyline2 = L.polyline(latlngs, {
+ weight: 2,
+ offset: -6,
+ className: 'fire-break-1',
+ color: '#9df2ff',
+ })
+ polyline1.addTo(map)
+ polyline2.addTo(map)
+ break
+ default:
+ polyline = L.polyline(latlngs, { color: 'red' })
+ }
+
+ if (callback) {
+ callback(polyline._latlngs)
+ }
+ // polyline.on('mouseover', e => {
+ // console.log('图标点击e', e);
+ // polyline.setText(' ► ', {repeat: true, attributes: {fill: 'red'}});
+ // });
+ polyline.addTo(map)
+ // decorator = L.polylineDecorator(polyline, {
+ // patterns: [
+ // {offset: 0, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})},
+ // // {offset: -7, repeat: 20, symbol: L.Symbol.dash({pixelSize: 10})},
+ // ]
+ // }).addTo(map);
+ polylineArr.push(polyline)
+ if (polyline1) {
+ polylineArr.push(polyline1)
+ }
+ if (polyline2) {
+ polylineArr.push(polyline2)
+ }
+ // polylineArr.push(decorator);
+ // featureGroup.addLayer(polyline);
+ // featureGroup.addTo(map);
+ }
+
+ function _removerPolyline() {
+ if (polylineArr && polylineArr.length > 0) {
+ polylineArr.map((item) => {
+ item.remove()
+ })
+ polylineArr = []
+ }
+ }
+ /**
+ * 绘制面
+ * */
+ function _drawingArea(callback) {
+ // 修改控件提示
+ L.drawLocal.draw.handlers.polygon.tooltip.start = '单击开始绘制形状'
+ L.drawLocal.draw.handlers.polygon.tooltip.cont = '单击继续绘制形状'
+ L.drawLocal.draw.handlers.polygon.tooltip.end =
+ '单击继续绘制形状,双击结束绘制'
+ // 开启画多边形控件
+ let areaPolygonLayer = null
+ mapObj.drawPolygon.enable()
+ map.once('draw:created', (e) => {
+ const type = e.layerType
+ areaPolygonLayer = e.layer
+ if (type === 'polygon') {
+ // 使用polygon时
+ featureGroup.addLayer(areaPolygonLayer)
+ // layerGroup.set('areaPolygonLayer', areaPolygonLayer)
+ console.log('areaPolygonLayer', areaPolygonLayer._latlngs)
+ if (callback) {
+ callback(areaPolygonLayer._latlngs)
+ }
+ featureGroup.addTo(map)
+ // const areaMeasureParam = new SuperMap.MeasureParameters(areaPolygonLayer);
+ // L.supermap
+ // .measureService(_mapConfig.config.QUERY_URL)
+ // .measureArea(areaMeasureParam, function(serviceResult) {
+ // const message = `总面积： ${serviceResult.result.area.toFixed(0)} 平方米`;
+ // const elementHtml = createDistanceAndAreaPopup(message);
+ // // const content = '总面积：' + serviceResult.result.area + '平方米';
+ // areaPolygonLayer.bindPopup(elementHtml, { className: 'multi-distance-and-area-popup-style' }).openPopup(areaPolygonLayer.getCenter());
+ // areaPolygonLayer.on('click', (e) => {
+ // console.log(e);
+ // });
+ // });
+ }
+ })
+ }
+ /**
+ * 绘制面数据
+ * */
+ function _drawingAreaByData(latlngs, callback, style, info) {
+ console.log('面上图数据', latlngs)
+ const polygon = L.polygon(
+ latlngs,
+ style || {
+ color: '#fa655d',
+ weight: 2,
+ fillColor: 'fa655d',
+ fillOpacity: 0.3,
+ }
+ )
+ if (callback) {
+ callback(polygon._latlngs)
+ }
+ polygon.addTo(map)
+ PolygonArr.push(polygon)
+ if (style) {
+ polygon.on('click', (e) => {
+ // 添加popup
+ const latlng = polygon.getCenter()
+ // const content = createManagerPopup(info)
+ console.log('XXXXXXXXXXXXXXXXXX', info)
+ const popup = L.popup({ className: 'detail-dialog' })
+ .setLatLng(latlng)
+ // .setContent(content)
+ .openOn(map)
+ mybus.$emit('trsSupermapPolygon', e.sourceTarget.options.resourceId)
+ })
+ }
+ }
+ // 清除面数据
+ function _removerPolygon() {
+ if (PolygonArr && PolygonArr.length > 0) {
+ PolygonArr.map((item) => {
+ item.remove()
+ })
+ PolygonArr = []
+ }
+ }
+ // 添加arcGis服务图层
+ function _addDynamicMapLayer(data) {
+ var envLayer = L.esri.dynamicMapLayer({
+ url: data.url,
+ opacity: 0.8,
+ layers: [0, 1, 2, 3, 4, 5, 6, 7, 8],
+ })
+ featureGroup.addLayer(envLayer)
+ layerGroup.set(data.layerName, envLayer)
+ // map.addLayer(envLayer)
+ }
+ /**
+ * 路径分析
+ * @param obj {Object} 地图初始化全局map对象（mapObject）
+ * @param e {Object} 当前扎点对象
+ * @param drawMarkerNum 扎点的数量
+ * @param pathAnalysisMarkerPointNodes {Map} 存放点的对象
+ * **/
+ function _findPathDrawMarker(
+ obj,
+ e,
+ drawMarkerNum,
+ pathAnalysisMarkerPointNodes
+ ) {
+ const type = e.layerType
+ obj.drawLayer = e.layer
+ // 记录扎点的坐标
+ if (type === 'marker') {
+ // 使用drawMarker时
+ let content = ''
+ if (drawMarkerNum === 1) {
+ content = '起点'
+ } else {
+ content = '经过点'
+ }
+ const currentSelectedPoint = []
+ const lat = e.layer._latlng.lat
+ const lng = e.layer._latlng.lng
+ currentSelectedPoint.push(lat)
+ currentSelectedPoint.push(lng)
+ const marker = L.marker(currentSelectedPoint)
+ marker
+ .bindTooltip(content, {
+ offset: L.point([0, -10]),
+ direction: 'top',
+ permanent: true,
+ })
+ .openTooltip()
+ featureGroup.addLayer(marker)
+ layerGroup.set('pathAnalysisMarker' + drawMarkerNum, marker)
+ pathAnalysisMarkerPointNodes.set(
+ 'pathAnalysisMarker' + drawMarkerNum,
+ marker
+ )
+ obj.drawMarker = new L.Draw.Marker(obj.map)
+ obj.drawMarker.initialize(obj.map)
+ obj.drawMarker.enable()
+ }
+ }
+
+ /**
+ * 最佳路径分析
+ * */
+ function _findPathProcess(
+ drawMarkerNum,
+ pathAnalysisMarkerPointNodes,
+ pathMarkerNum
+ ) {
+ // 当有两个点（起点与终点时）
+ if (drawMarkerNum > 1) {
+ // 获取最后一个图层，修改弹窗内容为终点
+ const pointMarker = pathAnalysisMarkerPointNodes.get(
+ 'pathAnalysisMarker' + drawMarkerNum
+ )
+ // 双击最后会加载两个节点，都应该删除
+ // 清除最后一个图层，然后修改内容从新加载
+ _removeLayerByLayerName('pathAnalysisMarker' + drawMarkerNum)
+ _removeLayerByLayerName('pathAnalysisMarker' + (drawMarkerNum - 1))
+ pathAnalysisMarkerPointNodes.delete('pathAnalysisMarker' + drawMarkerNum)
+ pathAnalysisMarkerPointNodes.delete(
+ 'pathAnalysisMarker' + (drawMarkerNum - 1)
+ )
+ drawMarkerNum -= 1
+ pointMarker
+ .bindTooltip('终点', {
+ offset: L.point([0, -10]),
+ direction: 'top',
+ permanent: true,
+ })
+ .openTooltip()
+ featureGroup.addLayer(pointMarker)
+ layerGroup.set('pathAnalysisMarker' + drawMarkerNum, pointMarker)
+ pathAnalysisMarkerPointNodes.set(
+ 'pathAnalysisMarker' + drawMarkerNum,
+ pointMarker
+ )
+
+ const nodes = []
+ for (let i = 0; i < pathAnalysisMarkerPointNodes.size; i++) {
+ const marker = pathAnalysisMarkerPointNodes.get(
+ 'pathAnalysisMarker' + (i + 1)
+ )
+ const location = marker.getLatLng()
+ const point = L.point(location.lng, location.lat)
+ nodes.push(point)
+ }
+ // 创建最佳路径分析服务实例
+ const findPathService = L.supermap.networkAnalystService(
+ _mapConfig.config.NETWORK_URL
+ )
+ // 创建最佳路径分析参数实例
+ const resultSetting = new SuperMap.TransportationAnalystResultSetting({
+ returnEdgeFeatures: true,
+ returnEdgeGeometry: true,
+ returnEdgeIDs: true,
+ returnNodeFeatures: true,
+ returnNodeGeometry: true,
+ returnNodeIDs: true,
+ returnPathGuides: true,
+ returnRoutes: true,
+ })
+ const analystParameter = new SuperMap.TransportationAnalystParameter({
+ resultSetting: resultSetting,
+ // weightFieldName: _convertCaseOfAttributes('SmLength')
+ // weightFieldName: 'smlength',
+ // weightFieldName: 'SMLENGTH',
+ })
+ const findPathParameter = new SuperMap.FindPathParameters({
+ isAnalyzeById: false,
+ nodes: nodes,
+ parameter: analystParameter,
+ })
+ const myIcon = L.icon({
+ iconUrl: './src/assets/common/multiScreen/mapTools/ambulance_map_standby.png',
+ iconSize: [35, 35],
+ })
+ // 进行查找 todo
+ findPathService.findPath(findPathParameter, function(serviceResult) {
+ console.log('serviceResult', serviceResult)
+ const result = serviceResult.result
+ console.log(result)
+ result.pathList.map(function(result) {
+ const pathRouteLayer = L.geoJSON(result.route)
+ // const pathGuideLayer = L.geoJSON(result.pathGuideItems, {
+ // pointToLayer: function (geoPoints, latlng) {
+ // pathMarkerNum += 1;
+ // const pathMarker = L.marker(latlng, {icon: myIcon});
+ // featureGroup.addLayer(pathMarker);
+ // layerGroup.set('pathMarker' + pathMarkerNum, pathMarker);
+ // },
+ // filter: function (geoJsonFeature) {
+ // if (geoJsonFeature.geometry && geoJsonFeature.geometry.type === 'Point') {
+ // return true;
+ // }
+ // return false;
+ // }
+ // });
+ // map.addLayer(pathRouteLayer);
+ featureGroup.addLayer(pathRouteLayer)
+ layerGroup.set('pathRouteLayer', pathRouteLayer)
+ // map.addLayer(pathGuideLayer);
+ // featureGroup.addLayer(pathGuideLayer);
+ // layerGroup.set('pathGuideLayer', pathGuideLayer);
+ })
+ })
+ } else {
+ // toastr.warning("请先选择需要分析的起点与终点!");
+ }
+ }
+
+ /**
+ * 地址匹配正向匹配(基于高德地图)
+ * @param address 地址
+ * @param city 城市
+ * @param pageSize 单页显示结果条数
+ * @param pageIndex 页码
+ * @param outAddressCallBack 输出查询结果的回调函数
+ * @param param outAddressCallBack函数所需要接收的参数
+ * @private
+ */
+ function _addressMatchCodeByAmap(
+ address, {
+ city = '青岛',
+ pageSize = 100,
+ pageIndex = 1,
+ outAddressCallBack = null,
+ param = null,
+ } = {}
+ ) {
+ AMap.plugin('AMap.PlaceSearch', function() {
+ var placeSearch = new AMap.PlaceSearch({
+ city: city,
+ pageSize: pageSize,
+ pageIndex: pageIndex,
+ })
+ placeSearch.search(address, function(status, result) {
+ console.log(result)
+ if (outAddressCallBack) {
+ outAddressCallBack(result, param)
+ }
+ })
+ })
+ }
+
+ /**
+ * 根据sql查询图层数据
+ * @param configInfo {Object}图层配置对象
+ * @param sql {String} sql字符串
+ * @param callBackFun {Function} 获取图层数据的回调函数
+ * @param callBackParams {Object||Array||String} 回调函数中接收的参数数据
+ * @param layerName {String} 图层名称，如果为空则不上图，不为空则根据该名字作为图层名上图
+ * @param getLayerPopupInfo {Function} 图层弹窗方法
+ * @param className {String} 弹窗样式
+ * @private
+ */
+ function _queryLayersBySql(
+ configInfo, {
+ sql = 'SMID >0',
+ callBackFun = null,
+ callBackParams = null,
+ layerName = null,
+ getLayerPopupInfo = null,
+ className = '',
+ } = {}
+ ) {
+ const sqlParam = new SuperMap.QueryBySQLParameters({
+ queryParams: {
+ name: configInfo.layerName,
+ attributeFilter: sql,
+ },
+ })
+ L.supermap
+ .queryService(_mapConfig.config.QUERY_URL)
+ .queryBySQL(sqlParam, (serviceResult) => {
+ if (callBackFun) {
+ callBackFun(serviceResult, configInfo, callBackParams)
+ }
+ if (layerName) {
+ const resultLayerConfig = L.geoJSON(
+ serviceResult.result.recordsets[0].features, {
+ onEachFeature: (feature, layer) => {
+ layer.setIcon(MapStyle.featureIcon(configInfo))
+ layer.title = layerName
+ layer.configInfo = configInfo
+ // 绑定弹窗事件，实时请求弹窗内容
+ layer.on('click', function(e) {
+ if (!getLayerPopupInfo) {
+ const uuid =
+ e.sourceTarget.feature.properties[
+ _convertCaseOfAttributes('uuid')
+ ]
+ const layerConfigInfo = e.sourceTarget.configInfo
+ const location = [e.latlng.lat, e.latlng.lng]
+ const latlng = L.latLng(location)
+ getLayerPopupInfo(uuid, layerConfigInfo).then(
+ (response) => {
+ response.allMapObject = {
+ mapObj: mapObj,
+ }
+ // const elementHtml = createGeneralPopup(response)
+ L.popup({ className: className })
+ .setLatLng(latlng)
+ // .setContent(elementHtml)
+ .openOn(map)
+ }
+ )
+ }
+ })
+ },
+ }
+ )
+ featureGroup.addLayer(resultLayerConfig)
+ layerGroup.set(layerName, resultLayerConfig)
+ }
+ })
+ }
+ /**
+ * 把单个单位添加到地图上
+ * @param paramObject 参数对象
+ * @return {*} 创建的图标，用来删除
+ * @private
+ */
+ const _addPointOnMap = function(paramObject) {
+ return addPointOnMap(paramObject, mapObj, featureGroup, layerGroup)
+ }
+ const _addResourceOnMapWithoutSuperMapCluster = function(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ url2
+ ) {
+ console.log(
+ '_addResourceOnMapWithoutSuperMapCluster===============>',
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ url2
+ )
+ // 如果资源要素数量为0，则说明该种资源没有记录
+ // if (features.length < 1) {
+ // return Promise.resolve(0);
+ // }
+ // 根据类型返回具体用聚合图层的样式。
+ // const defaultStyle = typeToStyle(layerName)
+ // 创建图层
+ // if (layerGroup.get(layerName)) {
+ // const haveLayers = layerGroup.get(layerName).getLayers()
+ // debugger;
+ // haveLayers.map(item=> {
+ // layerGroup.removeLayer(item)
+ // })
+
+ // }
+ //_removeLayerByLayerName(layerName)
+ let clickReplaceIcon = true;
+ let selectedLayerList = [];
+ let selectedLayerId = [];
+ let layers = null;
+ // 判断是否是聚合图层
+ layers = createMarkerClusterLayer()
+ const icon1 = createDefaultFeatureStyle({
+ img: url,
+ iconSize: [33, 33],
+ })
+ const icon2 = createDefaultFeatureStyle({
+ img: url2,
+ iconSize: [33, 33],
+ })
+ features.map((feature) => {
+ var bounds = map.getBounds()
+ //console.log("看看有没有坐标", feature);
+ if (feature.hasOwnProperty('latLng')) {
+ //let icon = feature.active ? icon2 : icon1;
+ let icon = icon1;
+ restoreIconObj.restoreIcon = icon;
+ const marker = L.marker(feature.latLng, { icon })
+ if (createPopupFun !== null) {
+ marker.uuid = feature.uuid || ''
+ marker.resId = feature.resId || ''
+ marker.on('click', async(e) => {
+ if (feature.resourceName === 'video') {
+ const params = [feature.indexCode]
+ DS.openVideo(params)
+ } else {
+ const elementHtml = createPopupFun(feature)
+ if (elementHtml) {
+ console.log(
+ 'L._addReMapWithter===============>',
+ feature.latLng,
+ elementHtml,
+ map
+ )
+ if (feature.type == 'videoSurveillance') {
+ L.popup({ className: 'detail-dialog', offset: [168, 240] })
+ .setLatLng(feature.latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ map.flyTo(feature.latLng)
+ } else {
+ L.popup({ className: 'detail-dialog' })
+ .setLatLng(feature.latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ }
+ }
+ }
+ })
+ }
+ marker.on('click', 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)
+ })
+ layers.addLayer(marker)
+ }
+ })
+ featureGroup.addLayer(layers)
+ layerGroup.set(layerName, layers)
+ }
+ /**
+ * 点击展示弹窗
+ */
+ const _addPopOnMap = function(feature, url, layerName, createPopupFun) {
+ console.log(
+ 'addPopOnMap===============>',
+ feature,
+ url,
+ layerName,
+ createPopupFun,
+ map
+ )
+ let layers = null
+ // 判断是否是聚合图层
+ layers = createMarkerClusterLayer()
+ // 判断是否是聚合图层
+ const icon = createDefaultFeatureStyle({
+ img: url || 'the-head.png',
+ iconSize: [36, 36],
+ })
+ // console.log("看看有没有坐标",feature.latLng);
+ if (feature.hasOwnProperty('latLng')) {
+ const marker = L.marker(feature.latLng, { icon })
+ if (createPopupFun !== null) {
+ marker.uuid = feature.uuid || ''
+ marker.resId = feature.resId || ''
+ const elementHtml = createPopupFun(feature)
+ if (elementHtml) {
+ console.log(
+ 'L.popup===============>',
+ feature.latLng,
+ elementHtml,
+ map
+ )
+ L.popup({ className: 'detail-dialog' })
+ .setLatLng(feature.latLng)
+ .setContent(elementHtml)
+ .openOn(map)
+ }
+ }
+ layers.addLayer(marker)
+ }
+ featureGroup.addLayer(layers)
+ layerGroup.set(layerName, layers)
+ }
+ /**
+ * 构建promise，使用uuid去超图服务查询features，得到结果就把promise状态置为已决议，并返回features
+ * @param idArray 资源的唯一标识数组，视频监控是camera_index_code，其他都是uuid
+ * @param layerConfigInfo 图层配置信息
+ * @param type 资源类型，只有视频监控用的camera_index_code，其他都是uuid
+ * @returns {Promise}
+ * @private
+ */
+ const _createPromiseByQueryService = function(
+ idArray,
+ layerConfigInfo,
+ type
+ ) {
+ return createPromiseByQueryService(idArray, layerConfigInfo, type)
+ }
+
+ /**
+ * 资源上图通用方法
+ * @param paramObject 参数数组
+ * @return {*}
+ * @private
+ */
+ const _addResourceOnMap = function(paramObject) {
+ return addResourceOnMap(paramObject, mapObj, featureGroup, layerGroup)
+ }
+ const _addResourceOnMapNew = function(
+ features,
+ config,
+ getLayerPopupInfo,
+ createPopupFun
+ ) {
+ return addResourceOnMapNew(
+ features,
+ config,
+ getLayerPopupInfo,
+ createPopupFun,
+ mapObj,
+ featureGroup,
+ layerGroup
+ )
+ }
+ const _getLayerPopupInfo = function(
+ uuid,
+ layerConfigInfo,
+ type,
+ latLng,
+ createPopupFun,
+ getLayerPopupInfo,
+ popupClassName
+ ) {
+ return myGetLayerPopupInfo(
+ uuid,
+ layerConfigInfo,
+ type,
+ mapObj,
+ latLng,
+ createPopupFun,
+ getLayerPopupInfo,
+ popupClassName
+ )
+ }
+ const _addResourceOnMapWithoutSuperMap = function(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS
+ ) {
+ // console.log('这里的数据', features);
+ // debugger;
+ return addResourceOnMapWithoutSuperMap(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS,
+ featureGroup,
+ layerGroup,
+ map
+ )
+ }
+ const _addPointsToMap = function(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS
+ ) {
+ // console.log('这里的数据', features);
+ // debugger;
+ return addPointsToMap(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS,
+ featureGroup,
+ layerGroup,
+ map
+ )
+ }
+ const _addResourceOnMapWithoutSuper = function(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS
+ ) {
+ // console.log('这里的数据', features);
+ // debugger;
+ return addResourceOnMapWithoutSuper(
+ features,
+ url,
+ layerName,
+ createPopupFun,
+ WS,
+ featureGroup,
+ layerGroup,
+ map
+ )
+ }
+ const _addPolygonToMap = function(a, b, c, d) {
+ var polygon = L.polygon([a, b, c, d], {
+ color: '#A33B42',
+ fillColor: '#A75A81',
+ fillOpacity: 0.5,
+ })
+ featureGroup.addLayer(polygon)
+ }
+ const _addNameToMap = function(config) {
+ // you can set .my-div-icon styles in CSS
+ config.map((item) => {
+ var myIcon = L.divIcon({ html: item.name })
+ L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(
+ mapObj.map
+ )
+ })
+ }
+ const _addMountainToMap = function(config) {
+ // you can set .my-div-icon styles in CSS
+ const myIcon = L.icon({
+ iconUrl: '/src/supermap/image/mountain.png',
+ iconSize: [32, 32],
+ })
+ config.map((item) => {
+ L.marker([item.latLng.lat, item.latLng.lng], {
+ icon: myIcon,
+ title: item.name,
+ }).addTo(mapObj.map)
+ })
+ }
+ const _addMountainLayerToMap = function(config) {
+ var myStyle = {
+ color: 'green',
+ weight: 2,
+ opacity: 1,
+ fillColor: 'green',
+ fillOpacity: 0.2,
+ }
+ // const JsonUrl = '/src/supermap/json/shanxi_polygon.json';
+ // var data = $.parseJSON($.ajax({
+ // url: JsonUrl, // json文件位置，文件名
+ // dataType: 'json', // 返回数据格式为json
+ // async: false
+ // }).responseText);
+ // 绘制地图边界
+ L.geoJSON(data, {
+ style: myStyle,
+ }).addTo(mapObj.map)
+ // you can set .my-div-icon styles in CSS
+ // var myIcon = './image/mountain.png';
+ // config.map(item => {
+ // L.marker([item.latLng.lng, item.latLng.lat], { icon: myIcon }).addTo(mapObj.map);
+ // });
+ }
+ const _addCircleToMap = function(latLng, r) {
+ // L.circle([latLng.lat, latLng.lng], { radius: r }).addTo(mapObj.map)
+ const polygon = L.circle([latLng.lat, latLng.lng], { radius: r })
+ polygon.addTo(map)
+ PolygonArr.push(polygon)
+ }
+ const _mapPainyEnable = function() {
+ map.MapPaint.enable()
+ map.addControl(new MapPaint.SwitchControl())
+ }
+ // 热力图
+ const _thermodynamic = function(latLng, r, type) {
+ // const layers = []
+ // latLng, r, strong
+ const thermodynamic = latLng
+ const heatLayer = L.heatLayer(thermodynamic, {
+ radius: r,
+ minOpacity: 0.4,
+ blur: 10,
+ gradient: {
+ 0.5: 'green',
+ 0.7: 'lime',
+ 0.8: 'yellow',
+ 0.9: 'orange',
+ 1: 'red',
+ },
+ })
+ // layers.addLayer(heatLayer1)
+ // const markerGroup = L.layerGroup(layers)
+ featureGroup.addLayer(heatLayer)
+ layerGroup.set(type, heatLayer)
+ // debugger
+ }
+ const _addPathToMap = function(latLng, color) {
+ // console.log(latLng)
+ // debugger
+ const polyline = L.polyline(latLng, { color: color })
+ polyline.addTo(map)
+ polylineArr.push(polyline)
+ // debugger
+ // map.fitBounds(polyline.getBounds())
+ }
+ return {
+ // 按图层配置名称删除
+ removeLayerByLayerName: _removeLayerByLayerName,
+ removeLayersByLayerNameArray: _removeLayersByLayerNameArray,
+ clearAllLayers: _clearAllLayers,
+ // 增删改要素
+ updateResourceFeature: _updateResourceFeature,
+ createPopupConfigInfo: _createPopupConfigInfo,
+ addResourceFeature: _addResourceFeature,
+ hasLocationInfo: _hasLocationInfo,
+ getLocale: _getLocale,
+ deleteResourceFeature: _deleteResourceFeature,
+ drawMarkerPopupUniversalFun: _drawMarkerPopupUniversalFun,
+ addExternalFunToObj: _addExternalFunToObj,
+ changeMap: _changeMap,
+ ZXYRenderMapSwitch: _ZXYRenderMapSwitch,
+ addFeatureArrayOnMap: _addFeatureArrayOnMap,
+ addTheOneFeatureOnMapByPoint: _addTheOneFeatureOnMapByPoint,
+ locationAndCreatePopup: _locationAndCreatePopup,
+ showLayersByUuidArray: _showLayersByUuidArray,
+ showCameraByIndexCodeArray: _showCameraByIndexCodeArray,
+ convertCaseOfAttributes: _convertCaseOfAttributes,
+ addressMatchCode: _addressMatchCode,
+ addressMatchCodeByAmap: _addressMatchCodeByAmap,
+ queryLayersBySql: _queryLayersBySql,
+ measureingLine: _measureingLine,
+ measureingArea: _measureingArea,
+ findPathDrawMarker: _findPathDrawMarker,
+ findPathProcess: _findPathProcess,
+ // 添加单个点位到地图上
+ addPointOnMap: _addPointOnMap,
+ // 使用uuid集合去超图服务查询资源要素，得到结果就把promise状态置为已决议，并返回features
+ createPromiseByQueryService: _createPromiseByQueryService,
+ // 资源上图通用方法
+ addResourceOnMap: _addResourceOnMap,
+ drawMarkerThroughPoint: _drawMarkerThroughPoint,
+ changeMarkerTooltip: _changeMarkerTooltip,
+ mapFlyTo: _mapFlyTo, // 地图视角移动
+ showVideoOnMap: _showVideoOnMap, // 实时视频展示及播放
+ addImgMaker: _addImgMaker,
+ getLayerPopupInfo: _getLayerPopupInfo,
+ addResourceOnMapWithoutSuper: _addResourceOnMapWithoutSuperMap,
+ addResourceOnMapWithoutSuperMap: _addResourceOnMapWithoutSuper,
+ addPolygonToMap: _addPolygonToMap,
+ addResourceOnMapNew: _addResourceOnMapNew,
+ addNameToMap: _addNameToMap,
+ addMountainToMap: _addMountainToMap,
+ addMountainLayerToMap: _addMountainLayerToMap,
+ drawingLine: _drawingLine,
+ drawingArea: _drawingArea,
+ drawingLineByData: _drawingLineByData,
+ drawingAreaByData: _drawingAreaByData,
+ removerPolyline: _removerPolyline,
+ removerPolygon: _removerPolygon,
+ mapPainyEnable: _mapPainyEnable,
+ openPopup: _openPopup,
+ openPopupVideoSurveillance: _openPopupVideoSurveillance,
+ closeAllPopup: _closeAllPopup,
+ addMovingMarker: _addMovingMarker,
+ addResourceOnMapWithoutSuperMapCluster: _addResourceOnMapWithoutSuperMapCluster,
+ addPopOnMap: _addPopOnMap,
+ addDynamicMapLayer: _addDynamicMapLayer,
+ addPointsToMap: _addPointsToMap,
+ addCircleToMap: _addCircleToMap,
+ thermodynamic: _thermodynamic,
+ addPathToMap: _addPathToMap,
+ }
+}
\ No newline at end of file
diff --git a/front/src/views/home/videoSurveillance/index.vue b/front/src/views/home/videoSurveillance/index.vue
index 7d8c13c8..99cd9b4e 100644
--- a/front/src/views/home/videoSurveillance/index.vue
+++ b/front/src/views/home/videoSurveillance/index.vue
@@ -177,7 +177,7 @@
}
}
}
- this.addResourceTomap('videoMap', this.pointAllData);
+ //this.addResourceTomap('videoMap', this.pointAllData);
})
},
methods: {
@@ -477,7 +477,7 @@
}
})
}
- console.log('上图数据', dataEvent)
+ console.log('点击后上上图数据', dataEvent)
this.getMapPoint(dataEvent, 'icon_camare.png', type)
},
getMapPoint(data, img, type) {