cesium 经纬度绘制点_Cesium搜索经纬度并标点
思路: 先输入经纬度，然后判断经纬度的格式，如果格式正确的话 就拿到输入的经纬度 在地球上对应的位置去标点 并且相机的位置中心也飞往该点
先实现标点 相机中心点
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;
varlatData;
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]
varlngData;
varlatData;
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]90 || timesArr[1]
//判断经纬度值的范围
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('格式错误——请参考定位格式');
}
},
cesium 经纬度绘制点_Cesium搜索经纬度并标点相关推荐
- cesium 经纬度绘制点_Cesium经纬度与坐标的问题
##数据预处理 1. 源数据坐标系通常为二维平面坐标系,通过设置投影坐标(通常为高斯克吕格投影,按实际位置选择正确分带)使其可进行后续操作. 2. 投影坐标是实际位置在平面上投影后的坐标,获得其正确位 ...
- cesium 经纬度绘制点_cesium结合geoserver利用WFS服务实现图层新增(附源码下载)
前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...
- 高德 通过 起 经 止 经纬度 获取路线经纬度，（可搜索位置，新增经过点）
高德 通过 起 经 止 经纬度 获取路线经纬度 前言 一.经纬度获取代码 二.效果图演示 三.DEMO 演示地址 总结 前言 之前工作的公司与道路相关,后端同事经常需要采集路线坐标,网上又没有找到合适 ...
- 使用matlab绘制世界地图并根据经纬度绘制点位(附m_map的下载与安装说明)
文章目录 1.worldmap & geoshow 2.m_map工具箱 3.根据经纬度在世界地图上绘制点位 使用matlab绘制世界地图有两种方法(自己使用过的,可能有别的我不了解的方法): ...
- 高德地图 SDK集成 定位 地理编码 搜索 经纬度获取 功能工具类
最近项目要集成高德地图,然后可以根据语音输入指令,进行定位和地理编码搜索功能,从而实现获取当前位置经纬度和根据地址获取经纬度的功能 下载文件之只放了libs和主要代码文件 https://downlo ...
- 便利贴--9{Cesium+js绘制多个点和多个线的图层，加标题}
便利贴--9{Cesium+js绘制多个点和多个线的图层,加标题} 代码 代码 附加转类型从openlayers线数据转到DC的Polyline数据 changeData(data, name, va ...
- 根据地址返回经纬度 java_java 根据地址返回经纬度
/** * 根据地址返回经纬度 * @param addr * @return 返回经纬度数据, latLng[0]经度,latLng[1]维度 */ public static String[] g ...
- Cesium中绘制矩形，根据四角/对角坐标绘制矩形
Cesium中绘制矩形,根据四角/对角坐标绘制矩形 import store from '@/store/index' import * as Cesium from 'cesium'export d ...
- 百度地图经纬度转换腾讯地图经纬度
百度地图经纬度转腾讯地图经纬度 function bMapTransQQMap(lng,lat){ let x_pi = 3.14159265358979324 * 3000.0 / ...
- cesium动态绘制圆，矩形，自定义区域
cesium动态绘制圆,矩形,自定义区域 自己封装了一个类,可以放在js文件中引入项目,具体使用和代码如下 class Draw {constructor(viewer, config) {/**ce ...
最新文章
- 12.OpenStack镜像和存储服务配置
- ASP.NET 一般处理程序
- TSPL学习笔记(1)
- 关于c语言中负数位移位操作的漫谈
- 32销售是合理的引导用户购买
- RabbitMQ的深入理解和最简单的用途说明
- springboot 文件上传 设置文件大小配置
- J2EE基础教程（3）：Spring框架
- 解决python中文乱码问题
- 【机器学习入门】(6) 随机森林算法：原理、实例应用（沉船幸存者预测）附python完整代码和数据集
- 秒杀疯狂猜成语3 花花的3300个成语 包括C#源代码 交流
- 什么是SFP光模块？
- 如何打断制图中的CAD图形？
- LeetCode 分类练习（四）：查找2
- 工业互联网平台IMSA---1.3.启动过程详解2
- 淘宝网（关于淘宝拆分）
- Matlab常用函数（control）
- React Native 中的 Android 原生模块
- 使用openssl的EVP接口使用sm2算法加解密等操作
- 具见--逍遥游 庄子南华(南怀瑾老师）