import { getHost, getToken } from "../../../on"; import Base from "../index"; import { generatePagination } from "../../Element/Pagination"; import { regLeftClickCallback } from "../../../Global/ClickCallback"; import richText from "../../Element/richText"; import Dialog from '../../Element/Dialog'; import { openAllNodeList as OpenAllNodeList } from "./openAllNodeList"; import { openNodeListById as OpenNodeListById } from "./openNodeListById"; import { syncData } from '../../../Global/MultiViewportMode' import { attributeElm } from '../../Element/elm_html' class Shp extends Base { constructor(sdk, options = {}, _Dialog = {}) { super(sdk, options); this.viewer = sdk.viewer if (!this.options.path) { this.error = 'No path provided!' if (window.ELEMENT) { window.ELEMENT.Message.closeAll(); window.ELEMENT.Message({ message: this.error, type: 'warning', duration: 1500 }); } console.warn(this.error) return } this.options.fileName = options.fileName || '未命名对象' this.options.field = options.field || 'id' this.total = 0 this.page = 1 this.pageSize = 20 this.currentData = [] this.data = [] this.list = [] this.Dialog = _Dialog this._elms = {}; } get show() { return undefined } set show(v) { this.setShow(v) } on() { if (!this.options.path) { return } return this.init() } async init() { let url = "" this.options.host = this.options.host || getHost() if (this.options.host.endsWith("yjearth4.0")) { url = this.options.host + '/api/v1/vector/load' } else { url = this.options.host + '/yjearth4.0/api/v1/vector/load' } url += '?path=' + this.options.path // url = 'json/shp.json' let response = await fetch(url, { method: 'get', headers: { 'Content-Type': 'application/json', "token": getToken(), "Authorization": "Bearer " + getToken(), } }) if (response.status === 200) { let data = await response.json() // Shp.create(this) if (data.code === 200 || data.code === 0) { this.data = data.data // for (let i = 0; i < this.data.length; i++) { // let points // let polylines // let polygons // let multi_polylines // let multi_polygons // if (this.data[i].points) { // points = [...this.data[i].points] // } // else { // points = [] // } // if (this.data[i].polylines) { // polylines = [...this.data[i].polylines] // } // else { // polylines = [] // } // if (this.data[i].polygons) { // polygons = [...this.data[i].polygons] // } // else { // polygons = [] // } // if (this.data[i].multi_polylines) { // multi_polylines = [...this.data[i].multi_polylines] // } // else { // multi_polylines = [] // } // if (this.data[i].multi_polygons) { // multi_polygons = [...this.data[i].multi_polygons] // } // else { // multi_polygons = [] // } // this.dataArray = [...this.dataArray, ...points, ...polylines, ...polygons, ...multi_polylines, ...multi_polygons] // } await this.formatData() return Shp.create(this) } else { return console.error(data.message) } } } // 格式化数据 async formatData() { let features = [] let _this = this formatFeatures(this.data) function formatFeatures(data) { if (data.data) { _this.list.push(...data.data) for (let i = 0; i < data.data.length; i++) { let points let polylines let polygons let multi_polylines let multi_polygons if (data.data[i].points) { points = [...data.data[i].points] for (let m = 0; m < points.length; m++) { features.push({ "id": points[m].attr.id, "type": "Feature", "geometry": { "type": "Point", "coordinates": [points[m].x, points[m].y, points[m].z], "range": points[m].range, "positions": { x: points[m].x, y: points[m].y, z: points[m].z } }, "properties": points[m].attr ? { ...points[m].attr } : {} }) } } if (data.data[i].polylines) { polylines = [...data.data[i].polylines] for (let m = 0; m < polylines.length; m++) { let positions = [] for (let n = 0; n < polylines[m].positions.length; n++) { positions.push([polylines[m].positions[n].x, polylines[m].positions[n].y, polylines[m].positions[n].z]) } features.push({ "id": polylines[m].attr.id, "type": "Feature", "geometry": { "type": "LineString", "coordinates": positions, "range": polylines[m].range, "positions": polylines[m].positions }, "properties": polylines[m].attr ? { ...polylines[m].attr } : {} }) } } if (data.data[i].polygons) { polygons = [...data.data[i].polygons] for (let m = 0; m < polygons.length; m++) { let positions = [] for (let n = 0; n < polygons[m].positions.length; n++) { positions.push([polygons[m].positions[n].x, polygons[m].positions[n].y]) } features.push({ "id": polygons[m].attr.id, "type": "Feature", "geometry": { "type": "Polygon", "coordinates": [positions], "range": polygons[m].range, "positions": polygons[m].positions }, "properties": polygons[m].attr ? { ...polygons[m].attr } : {} }) } } if (data.data[i].multi_polylines) { multi_polylines = [...data.data[i].multi_polylines] for (let m = 0; m < multi_polylines.length; m++) { let positions = [] let positionsxyz = [] for (let n = 0; n < multi_polylines[m].polylines.length; n++) { let positions2 = [] positionsxyz.push(multi_polylines[m].polylines[n].positions) for (let r = 0; r < multi_polylines[m].polylines[n].positions.length; r++) { positions2.push([multi_polylines[m].polylines[n].positions[r].x, multi_polylines[m].polylines[n].positions[r].y, multi_polylines[m].polylines[n].positions[r].z]) } positions.push(positions2) } features.push({ "id": multi_polylines[m].attr.id, "type": "Feature", "geometry": { "type": "MultiLineString", "coordinates": positions, "range": multi_polylines[m].range, "positions": positionsxyz }, "properties": multi_polylines[m].attr ? { ...multi_polylines[m].attr } : {} }) } } if (data.data[i].multi_polygons) { multi_polygons = [...data.data[i].multi_polygons] for (let m = 0; m < multi_polygons.length; m++) { let positions = [] let positionsxyz = [] for (let n = 0; n < multi_polygons[m].polygons.length; n++) { let positions2 = [] positionsxyz.push(multi_polygons[m].polygons[n].positions) for (let r = 0; r < multi_polygons[m].polygons[n].positions.length; r++) { positions2.push([multi_polygons[m].polygons[n].positions[r].x, multi_polygons[m].polygons[n].positions[r].y, multi_polygons[m].polygons[n].positions[r].z]) } positions.push(positions2) } features.push({ "id": multi_polygons[m].attr.id, "type": "Feature", "geometry": { "type": "MultiPolygon", "coordinates": [positions], "range": multi_polygons[m].range, "positions": positionsxyz }, "properties": multi_polygons[m].attr ? { ...multi_polygons[m].attr } : {} }) } } } } if (data.children) { for (let i = 0; i < data.children.length; i++) { formatFeatures(data.children[i]) } } } features.sort((a, b) => Number(a.properties.fid) - Number(b.properties.fid)); // for(let i=0;i<5;i++) { // features = [...features, ...features] // } this.geojson = { "type": "FeatureCollection", "features": features } } get fileName() { return this.options.fileName } set fileName(v) { this.options.fileName = v this._elms.fileName && (this._elms.fileName.value = v) } get field() { return this.options.field } set field(v) { this.options.field = v this._elms.field && (this._elms.field.value = v) } get onClick() { return this.clickCallBack } set onClick(val) { if (val && typeof val !== 'function') { console.error('val:', val, '不是一个function') } else { this.clickCallBack = val } } leftClickCB(mo, id, p, that) { if (that.clickCallBack && typeof that.clickCallBack === 'function') { that.clickCallBack(mo, id, p) } } static create(that) { // that.entity = new Cesium.PrimitiveCollection(); // that.viewer.scene.primitives.add(that.entity) // Shp.calculationScope(that, that.data) // Shp.createPoints(that, that.data.points) // Shp.createPolylines(that, that.data.polylines) // Shp.createPolygons(that, that.data.polygons) let bbox = turf.bbox(that.geojson); that.range = { max_x: bbox[2], max_y: bbox[3], min_x: bbox[0], min_y: bbox[1], } const geoJsonDataSource = new Cesium.GeoJsonDataSource(); let promise = geoJsonDataSource.load(that.geojson, { clampToGround: true, }); let Instances = [] let Points = new Cesium.PointPrimitiveCollection() let Lines = [] let Polygons = [] return promise.then(datasource => { that.entity = datasource // that.viewer.dataSources.add(datasource); datasource.entities.values.forEach(enetity => { if (enetity.billboard) { Points.add({ position: enetity.position._value, color: Cesium.Color.RED, // 红色点 pixelSize: 10, disableDepthTestDistance: Number.POSITIVE_INFINITY, }) } if (enetity.polygon) { let polygon = new Cesium.PolygonGeometry({ polygonHierarchy: new Cesium.PolygonHierarchy(enetity.polygon.hierarchy._value.positions) }); Polygons.push(new Cesium.GeometryInstance({ geometry: polygon, attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor( Cesium.Color.fromCssColorString('rgba(0,255,184,0.5)') ), show: new Cesium.ShowGeometryInstanceAttribute(true) } })) } if (enetity.polyline) { let polyline = new Cesium.GroundPolylineGeometry({ positions: enetity.polyline.positions._value, width: 2 }); Lines.push(new Cesium.GeometryInstance({ geometry: polyline, attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor( Cesium.Color.fromCssColorString('rgba(0,255,184,0.5)') ) } })) // console.log(enetity.polyline) } }) // let polygonsPrimitive = new Cesium.GroundPolylinePrimitive({ // geometryInstances: Polygons, // appearance: new Cesium.MaterialAppearance({ // material: new Cesium.Material({ // fabric: { // type: 'Color', // uniforms: { // color: new Cesium.Color(1.0, 1.0, 0.0, 1.0) // } // } // }) // }) // }); console.log('Lines', Lines) console.log('Polygons', Polygons) let LinesPrimitive = new Cesium.GroundPolylinePrimitive({ geometryInstances: Lines }); let PolygonsPrimitive = new Cesium.GroundPrimitive({ geometryInstances: Polygons, appearance: new Cesium.PerInstanceColorAppearance({ translucent: true, //false时透明度无效 closed: false, }), }); (Points.length>0) && that.viewer.scene.primitives.add(Points); (LinesPrimitive.length>0) && that.viewer.scene.primitives.add(LinesPrimitive); (PolygonsPrimitive.length>0) && that.viewer.scene.primitives.add(PolygonsPrimitive); // that.viewer.zoomTo(datasource) }) } /** * @description 计算shp范围 */ static calculationScope(that, data) { let points = [] if (data.points) { for (let i = 0; i < data.points.length; i++) { points.push(turf.point([data.points[i].position.x, data.points[i].position.y])) } } if (data.polylines) { for (let i = 0; i < data.polylines.length; i++) { if (data.polylines[i].positions) for (let m = 0; m < data.polylines[i].positions.length; m++) { points.push(turf.point([data.polylines[i].positions[m].x, data.polylines[i].positions[m].y])) } } } if (data.polygons) { for (let i = 0; i < data.polygons.length; i++) { if (data.polygons[i].positions) for (let m = 0; m < data.polygons[i].positions.length; m++) { points.push(turf.point([data.polygons[i].positions[m].x, data.polygons[i].positions[m].y])) } } } if (points.length > 0) { let features = turf.featureCollection(points); let enveloped = turf.envelope(features); if (enveloped && enveloped.bbox && enveloped.bbox.length == 4) { that.range = { max_x: enveloped.bbox[2], max_y: enveloped.bbox[3], min_x: enveloped.bbox[0], min_y: enveloped.bbox[1], } } } } static createPoints(that, data) { if (!data) { return } let points = new Cesium.PointPrimitiveCollection({ scene: that.viewer.scene // 指定场景 }); for (let i = 0; i < data.length; i++) { data[i].attr.id || (data[i].attr.id = that.randomString()) points.add({ id: data[i].attr.id, position: Cesium.Cartesian3.fromDegrees(data[i].x, data[i].y, data[i].z), // 点的位置 color: Cesium.Color.RED, // 点的颜色 pixelSize: 10, // 点的大小 disableDepthTestDistance: Number.POSITIVE_INFINITY // 不应用深度测试 }) regLeftClickCallback(data[i].attr.id, that.leftClickCB, that) } that.entity.add(points) } static createPolylines(that, data) { if (!data) { return } let polylineInstance = [] for (let i = 0; i < data.length; i++) { data[i].attr.id || (data[i].attr.id = that.randomString()) let positions = data[i].positions let fromDegreesArray = [] for (let m = 0; m < positions.length; m++) { fromDegreesArray.push(positions[m].x, positions[m].y, positions[m].z) } let polyline = new Cesium.GroundPolylineGeometry({ positions: Cesium.Cartesian3.fromDegreesArrayHeights(fromDegreesArray), width: 4 }); let instance = new Cesium.GeometryInstance({ id: data[i].attr.id, geometry: polyline, attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor( Cesium.Color.fromCssColorString(data[i].COLOR || 'rgba(0,255,184,0.5)') ), show: new Cesium.ShowGeometryInstanceAttribute(true), //显示或者隐藏 }, }); polylineInstance.push(instance) regLeftClickCallback(data[i].attr.id, that.leftClickCB, that) } if (polylineInstance.length > 0) { that.entity.add( new Cesium.GroundPolylinePrimitive({ geometryInstances: polylineInstance, appearance: new Cesium.PolylineColorAppearance() }) ); } } static createPolygons(that, data) { if (!data) { return } let polygonInstance = [] for (let i = 0; i < data.length; i++) { data[i].attr.id || (data[i].attr.id = that.randomString()) let positions = data[i].positions let fromDegreesArray = [] for (let m = 0; m < positions.length; m++) { fromDegreesArray.push(positions[m].x, positions[m].y, positions[m].z) } let polygon = new Cesium.PolygonGeometry({ polygonHierarchy: new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(fromDegreesArray)), }); let instance = new Cesium.GeometryInstance({ id: data[i].attr.id, geometry: polygon, attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor( Cesium.Color.fromCssColorString(data[i].COLOR || 'rgba(0,255,184,0.5)') ), show: new Cesium.ShowGeometryInstanceAttribute(true), //显示或者隐藏 }, }); polygonInstance.push(instance) regLeftClickCallback(data[i].attr.id, that.leftClickCB, that) } if (polygonInstance.length > 0) { let primitive = new Cesium.GroundPrimitive({ geometryInstances: polygonInstance, appearance: new Cesium.PerInstanceColorAppearance({ translucent: true, //false时透明度无效 closed: false, }), }) that.entity.add(primitive); } } async edit(status = false, DialogEvent = {}) { this.originalOptions = this.deepCopyObj(this.options) if (this._DialogObject && this._DialogObject.close) { this._DialogObject.close() this._DialogObject = null } if (status) { this._DialogObject = await new Dialog(this.sdk, this.options, { title: '编辑属性', left: '180px', top: '100px', confirmCallBack: (options) => { this.fileName = this.fileName.trim() if (!this.fileName) { this.fileName = '未命名对象' } this.originalOptions.fileName = this.fileName this.originalOptions.field = this.field this._DialogObject.close() DialogEvent.confirmCallBack && DialogEvent.confirmCallBack({ id: this.options.id, fileName: this.originalOptions.fileName, field: this.originalOptions.field }) }, closeCallBack: () => { this.reset() DialogEvent.closeCallBack && DialogEvent.closeCallBack() }, }) let html = `
文件名称:
名称字段选择:
` let contentElm = document.createElement('div'); contentElm.innerHTML = html this._DialogObject.contentAppChild(contentElm) let nameElm = contentElm.getElementsByClassName('flie-name')[0] nameElm.value = this.options.fileName nameElm.addEventListener('input', () => { this.options.fileName = nameElm.value }) let selectElm = contentElm.getElementsByClassName('input-select')[0] let option = '' for (let key in this.geojson.features[0].properties) { let o = `` option = option + o } selectElm.innerHTML = option selectElm.value = this.options.field selectElm.addEventListener('input', () => { this.options.field = selectElm.value }) this._elms.fileName = nameElm this._elms.field = selectElm } else { if (this._DialogObject && this._DialogObject.close) { this._DialogObject.close() this._DialogObject = null } } } async editById(status = false, nodeId, DialogEvent = {}) { // nodeId = this.dataArray[0].attr.id if (this._DialogObject && this._DialogObject.close) { this._DialogObject.close() this._DialogObject = null } let cameraName = '' let index if (status) { let options = {} for (let i = 0; i < this.geojson.features.length; i++) { if (this.geojson.features[i].properties.id === nodeId) { if (this.geojson.features[i].content) { options = this.deepCopyObj(this.geojson.features[i].content) } index = i break } } options.id = options.id || nodeId options.link || (options.link = {}) options.link.content || (options.link.content = []) options.camera || (options.camera = []) options.richTextContent || (options.richTextContent = '') options.attributeType = options.attributeType || 'richText' this._DialogObject = await new Dialog(this.sdk, options, { title: '编辑属性', left: '180px', top: '100px', confirmCallBack: () => { this._DialogObject.close() this.geojson.features[index].content = this.deepCopyObj(this._DialogObject.attribute) DialogEvent.confirmCallBack && DialogEvent.confirmCallBack(this._DialogObject.attribute) }, closeCallBack: () => { // this.reset() DialogEvent.closeCallBack && DialogEvent.closeCallBack() }, }) this._DialogObject.event = DialogEvent this._DialogObject.attribute = this.deepCopyObj(options) let html = `
内容类型:
编辑内容:
编辑内容:
操作
设备名称
设备类型
设备IP
设备端口
用户名
密码

暂无数据

` let contentElm = document.createElement('div'); contentElm.innerHTML = html this._DialogObject.contentAppChild(contentElm) let all_elm = contentElm.getElementsByTagName("*") this._DialogObject._element.body.style.width = '600px' let attributeSelectElm = contentElm.getElementsByClassName('attribute-select')[0] let linkAddBtnElm = contentElm.getElementsByClassName('link_add_btn')[0] let openRichTextBtnElm = contentElm.getElementsByClassName('open-richText-btn')[0] let attributeContent = this._DialogObject._element.content.getElementsByClassName('attribute-content') for (let i = 0; i < attributeContent.length; i++) { if (attributeContent[i].className.indexOf('attribute-content-' + this._DialogObject.attribute.attributeType) > -1) { attributeContent[i].style.display = 'block'; } else { attributeContent[i].style.display = 'none'; } } attributeSelectElm.addEventListener('change', () => { this._DialogObject.attribute.attributeType = attributeSelectElm.value for (let i = 0; i < attributeContent.length; i++) { if (attributeContent[i].className.indexOf('attribute-content-' + this._DialogObject.attribute.attributeType) > -1) { attributeContent[i].style.display = 'block'; } else { attributeContent[i].style.display = 'none'; } } }) linkAddBtnElm.addEventListener('click', async () => { if (this._DialogObject._element.content.getElementsByClassName('link_add')[0].value) { this._DialogObject.attribute.link.content.push({ name: this.getDateTimeString(), url: this._DialogObject._element.content.getElementsByClassName('link_add')[0].value }) this._DialogObject._element.content.getElementsByClassName('link_add')[0].value = '' this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) } else { DialogEvent.clickAddLink && DialogEvent.clickAddLink(nodeId) } }) openRichTextBtnElm.addEventListener('click', () => { richText.open(nodeId, nodeId, this._DialogObject.attribute.richTextContent) richText.primaryCallBack = (content) => { this._DialogObject.attribute.richTextContent = content } }) let cameraNameElm = contentElm.getElementsByClassName('camera-name')[0] let cameraSelectElm = contentElm.getElementsByClassName('camera-select')[0] cameraNameElm.addEventListener('input', () => { cameraName = cameraNameElm.value }) this.cameraSelect(cameraName) cameraSelectElm.addEventListener('click', () => { this.cameraSelect(cameraName) }) // let nameElm = contentElm.getElementsByClassName('flie-name')[0] // nameElm.value = this.options.fileName // nameElm.addEventListener('input', ()=>{ // this.options.fileName = nameElm.value // }) // let selectElm = contentElm.getElementsByClassName('input-select')[0] // let option = '' // for(let key in this.dataArray[0].attr) { // let o = `` // option = option + o // } // selectElm.innerHTML = option // selectElm.value = this.options.field // selectElm.addEventListener('input', ()=>{ // this.options.field = selectElm.value // }) // this._elms.fileName = nameElm // this._elms.field = selectElm } else { if (this._DialogObject && this._DialogObject.close) { this._DialogObject.close() this._DialogObject = null } } } editContentById(nodeId, content) { for (let i = 0; i < this.geojson.features.length; i++) { if (this.geojson.features[i].properties.id === nodeId) { this.geojson.features[i].content = content break } } } reset() { this.fileName = this.originalOptions.fileName this.field = this.originalOptions.field } addAttributeLinkById(nodeId, link, i) { if (this._DialogObject && this._DialogObject.attribute && this._DialogObject.attribute.id == nodeId) { if (i || i === 0) { this._DialogObject._element.body.getElementsByClassName('attribute-content-link')[1].getElementsByClassName('tr')[i + 1].getElementsByClassName('file-select')[0].value = link } else { this._DialogObject.attribute.link.content.push({ name: this.getDateTimeString(), url: link }) this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) } } } setAttributeLinkById(nodeId, data) { if (this._DialogObject && this._DialogObject.attribute && this._DialogObject.attribute.id == nodeId) { this._DialogObject.attribute.link.content = data let table = this._DialogObject._element.content.getElementsByClassName('attribute-content-link')[1].getElementsByClassName('table')[0] let tableContent = table.getElementsByClassName('table-body')[0] tableContent.innerHTML = '' if (this._DialogObject.attribute.link.content.length > 0) { table.getElementsByClassName('table-empty')[0].style.display = 'none' } else { table.getElementsByClassName('table-empty')[0].style.display = 'flex' } for (let i = 0; i < this._DialogObject.attribute.link.content.length; i++) { let tr = `
` + this._DialogObject.attribute.link.content[i].name + `
` + this._DialogObject.attribute.link.content[i].url + `
` let trElm = document.createRange().createContextualFragment(tr) tableContent.appendChild(trElm) } let item = tableContent.getElementsByClassName('tr') let fun = { linkEdit: async (index) => { await this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) let table = this._DialogObject._element.content.getElementsByClassName('attribute-content-link')[1].getElementsByClassName('table')[0] let tableContent = table.getElementsByClassName('table-body')[0] let item = tableContent.getElementsByClassName('tr') for (let i = 0; i < item.length; i++) { if (index === i) { let html = `
` item[i].innerHTML = html let td = item[i].getElementsByClassName('td') td[0].getElementsByClassName('input')[0].value = this._DialogObject.attribute.link.content[index].name td[1].getElementsByClassName('input')[0].value = this._DialogObject.attribute.link.content[index].url let btn = item[i].getElementsByTagName('button') for (let n = 0; n < btn.length; n++) { for (let m of btn[n].attributes) { if (m.name === '@click') { btn[n].addEventListener('click', (e) => { if (typeof (fun[m.value]) === 'function') { fun[m.value]({ name: td[0].getElementsByClassName('input')[0].value, url: td[1].getElementsByClassName('input')[0].value }, i) } }); btn[n].attributes.removeNamedItem(m.name) break } } } break } } }, linkDelete: (i) => { this._DialogObject.attribute.link.content.splice(i, 1) this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) }, confirmEdit: (value, i) => { this._DialogObject.attribute.link.content[i] = value this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) }, cancelEdit: () => { this.setAttributeLinkById(nodeId, this._DialogObject.attribute.link.content) }, fileSelect: (value, i) => { this._DialogObject.event && this._DialogObject.event.clickAddLink && this._DialogObject.event.clickAddLink(nodeId, i) } } for (let i = 0; i < item.length; i++) { let btn = item[i].getElementsByTagName('button') for (let n = 0; n < btn.length; n++) { for (let m of btn[n].attributes) { if (m.name === '@click') { btn[n].addEventListener('click', (e) => { if (typeof (fun[m.value]) === 'function') { fun[m.value](i) } }); btn[n].attributes.removeNamedItem(m.name) break } } } } } for (let i = 0; i < this.dataArray.length; i++) { if (this.dataArray[i].attr.id === nodeId) { if (this.dataArray[i].content) { this.opt_DialogObject.attribute.link.content = v } break } } } getAllNode() { return this.data } openAllNodeList() { OpenAllNodeList(this) } openNodeListById(id) { OpenNodeListById(this, id) } static createTableContent(that) { let trsElm = '' for (let i = 0; i < that.currentData.length; i++) { let trElm = '' let tdElm = '' for (let key in that.currentData[i].attr) { tdElm = tdElm + `
${that.currentData[i].attr[key]}
` } trElm = trElm + tdElm + '' trsElm = trsElm + trElm } return trsElm } flyTo(id, options = {}) { if (id) { for (let i = 0; i < this.geojson.features.length; i++) { if (this.geojson.features[i].properties.id === id) { let range = this.geojson.features[i].geometry.range if (range) { this.viewer.camera.flyTo({ orientation: options.orientation || { heading: Cesium.Math.toRadians(0.0), pitch: Cesium.Math.toRadians(-90.0), roll: Cesium.Math.toRadians(0.0) }, destination: Cesium.Rectangle.fromDegrees(range.min_x, range.min_y, range.max_x, range.max_y) }); } } } } else { if (this.range) { this.viewer.camera.flyTo({ orientation: options.orientation || { heading: Cesium.Math.toRadians(0.0), pitch: Cesium.Math.toRadians(-90.0), roll: Cesium.Math.toRadians(0.0) }, destination: Cesium.Rectangle.fromDegrees(this.range.min_x, this.range.min_y, this.range.max_x, this.range.max_y) }); } } } setShow(status, id) { // let enetity = this.entity.entities.getById(id) // if(enetity) { // enetity.show = status // } // else { // } if (id) { for (let i = 0; i < this.entity.entities.values.length; i++) { if (this.entity.entities.values[i].id && this.entity.entities.values[i].id.startsWith(id)) { this.entity.entities.values[i].show = status // this.entity.entities.remove(this.entity.entities.values[i]) } } } else { for (let i = 0; i < this.entity.entities.values.length; i++) { this.entity.entities.values[i].show = status } } } remove() { this.entity.entities.values.forEach(enetity => { this.sdk.viewer.entities.remove(enetity) }) this.viewer.dataSources.remove(this.entity, true) this.entity = null this.geojson = {} this.data = {} } cameraSelect(cameraName, page) { const type = { '1': '海康', '2': '大华' } let host = this.options.host if (this._DialogObject && this._DialogObject._element && this._DialogObject._element.content) { let paginationElm = that._DialogObject._element.content.getElementsByClassName('pagination')[0] let attributeCameraElm = that._DialogObject._element.content.getElementsByClassName('attribute-content-camera')[0] if (!paginationElm) { return } if (!attributeCameraElm) { return } generatePagination(paginationElm, 1, 10, 1); } else { return } let url = "" const params = { cameraName: cameraName, page: !page || typeof page === 'object' ? 1 : page, pageSize: 5 }; const queryString = new URLSearchParams(params).toString(); if (host.endsWith("yjearth4.0")) url = `${host}/api/v1/cameraData/list?${queryString}` else url = `${host}/yjearth4.0/api/v1/cameraData/list?${queryString}` // url = this.options.path fetch(url, { method: 'get', headers: { 'Content-Type': 'application/json', "token": getToken(), "Authorization": "Bearer " + getToken(), } }).then((response) => { if (response.status === 200) { response.json().then((data) => { if (data.code === 200 || data.code === 0) { if (!this._DialogObject || !this._DialogObject._element || !this._DialogObject._element.content) { return } let paginationElm = this._DialogObject._element.content.getElementsByClassName('pagination')[0] let table = this._DialogObject._element.content.getElementsByClassName('camera-table')[0] let tableContent = table.getElementsByClassName('table-body')[0] tableContent.innerHTML = '' if (data.data) { if (data.data.list && data.data.list.length > 0) { generatePagination(paginationElm, data.data.total, 10, 1, (pageIndex) => { this.cameraSelect(cameraName, pageIndex) }); table.getElementsByClassName('table-empty')[0].style.display = 'none' tableContent.style.display = 'inline-flex' for (let i = 0; i < data.data.list.length; i++) { let tr = `
绑定
${data.data.list[i].cameraName}
${type[data.data.list[i].type]}
${data.data.list[i].ip}
${data.data.list[i].port}
${data.data.list[i].userName}
${data.data.list[i].passWord}
` let trElm = document.createRange().createContextualFragment(tr) let checkbox = trElm.querySelector('input[type="checkbox"]') checkbox.addEventListener('change', () => { if (checkbox.checked) { this._DialogObject.attribute.camera.push(data.data.list[i]) } else { let newArray = this._DialogObject.attribute.camera.filter((item) => { return item.ID !== data.data.list[i].ID }) this._DialogObject.attribute.camera = newArray } }) tableContent.appendChild(trElm) for (let m = 0; m < this._DialogObject.attribute.camera.length; m++) { if (this._DialogObject.attribute.camera[m].ID === data.data.list[i].ID) { checkbox.checked = true break } } } } if (data.data && data.data.total) { generatePagination(paginationElm, data.data.total, 10, 1, (pageIndex) => { this.cameraSelect(cameraName, pageIndex) }); } } else { generatePagination(paginationElm, 1, 10, 1); table.getElementsByClassName('table-empty')[0].style.display = 'flex' tableContent.style.display = 'none' } } else { console.error(data.message) } }) } }) } } export default Shp