思路: 先输入经纬度，然后判断经纬度的格式，如果格式正确的话 就拿到输入的经纬度 在地球上对应的位置去标点 并且相机的位置中心也飞往该点
先实现标点 相机中心点
showPoints(lng, lat) { // 接受两个参数 lng经度 lat纬度
this.viewer.entities.removeAll() //先清除地球上的标点 console.log(this.viewer.entities) if(this.viewer.entities.values.length === 0) { //清除完成后地球上没有其他点位了 var entity = this.viewer.entities.add({ position: this.Cesium.Cartesian3.fromDegrees(lng, lat), /*point: { color: Cesium.Color.RED, //点位颜色 pixelSize: 10 //像素点大小 },*/ billboard: { image: marker }, label : { text : '测试名称', font : '14pt Source Han Sans CN', //字体样式 fillColor: this.Cesium.Color.BLACK, //字体颜色 backgroundColor: this.Cesium.Color.AQUA, //背景颜色 showBackground:true, //是否显示背景颜色 style: this.Cesium.LabelStyle.FILL, //label样式 outlineWidth : 2, verticalOrigin: this.Cesium.VerticalOrigin.CENTER,//垂直位置 horizontalOrigin: this.Cesium.HorizontalOrigin.LEFT,//水平位置 pixelOffset:new this.Cesium.Cartesian2(10,0) //偏移 } }) this.viewer.camera.flyTo({ //相机飞往该点 destination: this.Cesium.Cartesian3.fromDegrees(lng, lat, 500000), //摄像机的最终位置 duration: 2 }) } },
再实现搜索功能
我的需求是接受两种格式 ①120,30 ②120°11'11",30°11'11" 前面是经度 后面是纬度 经度范围是 -180——180 纬度方位是-90——90
需要验证的东西比较多
search() {
//定位的实现
console.log(this.inputText) var times = (this.inputText.match(/,/g)||[]).length; if(times === 1) { // 判断 ',' 出现的次数 console.log('可以继续') console.log(this.inputText.split(',')) var timesArr = this.inputText.split(',') if(timesArr.length === 2) { if(timesArr[0] !== '' && timesArr[1] !== '') { //判断两个值是否为空开始 // 判断截取的数组的每个值是否为空 /*var lng = Number(timesArr[0]) var lat = Number(timesArr[1])*/ if(isNaN(timesArr[0]) || isNaN(timesArr[1])) { // 判断截取的两个值是否为数字 var lngTimes1 = (timesArr[0].match(/°/g)||[]).length; var lngTimes2 = (timesArr[0].match(/'/g)||[]).length; var lngTimes3 = (timesArr[0].match(/"/g)||[]).length; var latTimes1 = (timesArr[1].match(/°/g)||[]).length; var latTimes2 = (timesArr[1].match(/'/g)||[]).length; var latTimes3 = (timesArr[1].match(/"/g)||[]).length; console.log(lngTimes1) console.log(lngTimes2) console.log(lngTimes3) console.log(latTimes1) console.log(latTimes2) console.log(latTimes3) if(lngTimes1 === 1 && lngTimes2 === 1 && lngTimes3 ===1 && latTimes1 === 1 && latTimes2 === 1 && latTimes3 === 1) { //若截取的两个数不为数字,判断是否为第二种定位写法 //判断 ° ' " 出现的次数 必须所有的符号出现的次数为1 console.log('已过第一关') console.log(timesArr[0].indexOf('°')) console.log(timesArr[0].indexOf('"')) console.log(timesArr[0].indexOf("'")) var lngs1 = timesArr[0].indexOf('°') var lngs2 = timesArr[0].indexOf("'") var lngs3 = timesArr[0].indexOf('"') var lats1 = timesArr[1].indexOf('°') var lats2 = timesArr[1].indexOf("'") var lats3 = timesArr[1].indexOf('"') if(lngs1 < lngs2 && lngs2 < lngs3 && lats1 < lats2 && lats2 < lats3) { //三个符号出现的顺序开始 //符号的出现顺序得是 ° ' " 否则不行 //32°23'23",23°23'23" if(!isNaN(Number(timesArr[0].split('°')[0])) && !isNaN(Number(timesArr[1].split('°')[0]))) { //判断度数为数字开始 //判断第二种定位的 ° 前面是否为数字 //是 if(Number(timesArr[0].split('°')[0]) > 180 || Number(timesArr[0].split('°')[0]) < -180 || Number(timesArr[1].split('°')[0]) >= 90 || Number(timesArr[1].split('°')[0]) <= -90) { //第二种定位的经纬度度数也要在 -180 —— 180 ，纬度 -90 —— 90之间 //不是在此区间 this.$Message.warning('经度的范围是 -180 —— 180 。纬度的范围是 -90 —— 90'); }else { //是在此区间 if(Number(timesArr[0].split('°')[0]) === 180 || Number(timesArr[0].split('°')[0]) === -180) { //start123456 //判断经度度数是否等于180 //是 if(Number(timesArr[0].split('°')[1].split("'")[0]) === 0 && Number(timesArr[0].split('°')[1].split("'")[1].split('"')[0]) === 0) { //若经度为180或-180 分秒只能为0 var lngData = 180; var latData; var lat_du = timesArr[1].split('°')[0] var lat_fen = timesArr[1].split('°')[1].split("'")[0] var lat_miao = timesArr[1].split('°')[1].split("'")[1].split('"')[0] if(lat_du >= 0) { //纬度为正数 北经 latData = Number(lat_du) + Number(lat_fen/60) + Number(lat_miao/3600) }else { //纬度为负数 南经 latData = '-' + (Math.abs(Number(lat_du)) + Number(lat_fen/60) + Number(lat_miao/3600)) } this.showPoints(lngData, latData) }else { this.$Message.warning('经度为180或-180时，对应的分秒必须为0'); } }else { //经度度数大于-180小于180 纬度度数大于-90小于90的时候 if(!isNaN(Number(timesArr[0].split('°')[1].split("'")[0])) && !isNaN(Number(timesArr[1].split('°')[1].split("'")[0]))) { //判断 ° 后面 ' 前面的内容是否为数字 //是 if(Number(timesArr[0].split('°')[1].split("'")[0]) <= 60 && Number(timesArr[0].split('°')[1].split("'")[0]) >= 0 && Number(timesArr[1].split('°')[1].split("'")[0]) <= 60 && Number(timesArr[1].split('°')[1].split("'")[0]) >= 0) { //为数字后还要判断区间范围 判断分的范围是否在0-60之间 if(!isNaN(Number(timesArr[0].split('°')[1].split("'")[1].split('"')[0])) && !isNaN(Number(timesArr[1].split('°')[1].split("'")[1].split('"')[0]))) { //判断 " 前面的内容是否为数字 //是 if(Number(timesArr[0].split('°')[1].split("'")[1].split('"')[0]) <= 60 && Number(timesArr[0].split('°')[1].split("'")[1].split('"')[0]) >= 0 && Number(timesArr[1].split('°')[1].split("'")[1].split('"')[0]) <= 60 && Number(timesArr[1].split('°')[1].split("'")[1].split('"')[0]) >= 0) { //若秒数为数字 判断其范围是否在0-60之间 if(timesArr[0].split('°')[1].split('"')[1] === '' && timesArr[1].split('°')[1].split('"')[1] === '') { //判断 " 后面是否还有内容 //没有 var lng_du = timesArr[0].split('°')[0] var lng_fen = timesArr[0].split('°')[1].split("'")[0] var lng_miao = timesArr[0].split('°')[1].split("'")[1].split('"')[0] var lat_du = timesArr[1].split('°')[0] var lat_fen = timesArr[1].split('°')[1].split("'")[0] var lat_miao = timesArr[1].split('°')[1].split("'")[1].split('"')[0] var lngData; var latData; if(lng_du >= 0) { //经度为正数 东经 lngData = Number(lng_du) + Number(lng_fen/60) + Number(lng_miao/3600) }else { //经度为负数 西经 lngData = '-' + (Math.abs(Number(lng_du)) + Number(lng_fen/60) + Number(lng_miao/3600)) } if(lat_du >= 0) { //纬度为正数 北经 latData = Number(lat_du) + Number(lat_fen/60) + Number(lat_miao/3600) }else { //纬度为负数 南经 latData = '-' + (Math.abs(Number(lat_du)) + Number(lat_fen/60) + Number(lat_miao/3600)) } this.showPoints(lngData, latData) }else { this.$Message.warning('格式错误——秒数后面不能再出现内容'); } }else { this.$Message.warning('经纬度秒数的范围必须是在0-60之间'); } }else { this.$Message.warning('经纬度秒数必须为数字'); } }else { this.$Message.warning('经纬度的分数的范围必须是在0-60之间'); } }else { this.$Message.warning('经纬度的分数必须为数字'); } } //end123456 } }else { this.$Message.warning('经纬度度数必须为数字'); } //判断度数为数字结束 }else { this.$Message.warning('格式错误——请参考定位格式'); } //三个符号出现的顺序结束 }else { this.$Message.warning('格式错误——请参考定位格式'); } }else { if(timesArr[0]>180 || timesArr[0]<-180 || timesArr[1]>90 || timesArr[1]<-90) { //判断经纬度值的范围 this.$Message.warning('经度的范围是 -180 —— 180 。纬度的范围是 -90 —— 90'); }else { console.log('区定位吧') this.showPoints(timesArr[0], timesArr[1]) } } }else { this.$Message.warning('经纬度不能为空'); } //判断两个值是否为空结束 }else { this.$Message.warning('格式错误——请参考定位格式'); } }else { //判断times===1 this.$Message.warning('格式错误——请参考定位格式'); } },