Experimento 4 Posicionamiento y Navegación de Vehículos

Los estudiantes que quieran hacerlo ellos mismos pueden leer el tutorial al final

【Objetivo】

       1. Comprender el principio de posicionamiento del sistema de navegación de posicionamiento global y la tecnología de mapas electrónicos, y dominar el uso de la API de mapas electrónicos.

       2. Comprender el formato de datos del mensaje de datos de navegación, analizar los datos de navegación y aplicar la navegación en el mapa electrónico.

【Naturaleza experimental】

Experimento confirmatorio.

【Requisitos experimentales】

       1. Los sitios web relevantes solicitan la CLAVE del mapa electrónico

       2. Consulta GPS/BDS y otros formatos de mensajes de navegación

      

【Contenido experimental】

       1. Aprenda a usar la API del mapa electrónico y llame a la interfaz API en el navegador para mostrar el mapa.

       2. Comprender las características de los datos de los mensajes de navegación GPS/BDS, analizar los mensajes de navegación y combinarlos con aplicaciones de mapas.

      

【Pasos experimentales】

1. Visualización de la hoja de ruta digital

Tomando el mapa de Baidu como ejemplo, el experimento de navegación y posicionamiento GPS requiere el uso de la API de mapas de Baidu para mostrar el mapa de Baidu en el navegador IE, descargar BMapLib (API de mapas de Baidu) del sitio web de mapas de Baidu, analizar la estructura del programa de la API y comparar la estructura en el experimento Dé una breve descripción. El efecto de visualización es el siguiente:

Figura 4-1 Secuencia de comandos de la interfaz API del mapa de Baidu (ejemplo)

Figura 4-2 Representación de visualización de mapa

Ejecute el código y tome una captura de pantalla:

Rellene el código correspondiente (el código clave de una determinada función) en el área siguiente y proporcione una descripción adecuada:

clave:

Descripción del código:

//leer archivo GPS

var leerArchivo = {

    inicializar: función() {

        esto.getFile();

    },

    getFile: función() {

            var gpsArray = [];  

        // leer archivo GPS

        $('botón#leerArchivo').on('clic', función(){

            índice var = capa.cargar(1, {

                sombra: [0.3, '#333']

            });

            // $.ajax({

            // url: 'php/obtenerPosición.php',

            // tipo: 'obtener',

            // tipo de datos: 'texto',

            // datos: {

            // },

            // éxito: función (datos) {

            // consola.log(datos);

            // var strArray = String(datos).split(/[\[\]]/g);

            // var nuevoArray = [];

            // var j=0;

            // for(var i=0; i<strArray.longitud; i++){

            // if(strArray[i] == ""){

            // //consola.log('vacío');

            // }demás{

            // nuevoArray[j] = strArray[i];

            // j++;

            // }

            // }

            // var cadena = '[';

            // str += nuevoArray.join(',');

            //      str += ']';

            //      var jsonObj = eval('(' + str + ')');

            //      var pointArray = [];

            //      for(var i=0; i<jsonObj.length; i++){

            //          pointArray[i] = new BMap.Point(jsonObj[i].lon, jsonObj[i].lat);

            //      }

           

            //      //console.log(pointArray);

           

            //      //map.setCenter(pointArray[pointArray.legnth]);

           

            //      map.centerAndZoom(pointArray[0], 12);

           

            //      map.clearOverlays();

           

            //      var polyline = new BMap.Polyline(pointArray, {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});   //创建折线

           

            //      map.addOverlay(polyline);   //增加折线

           

            //      layer.close(index);

            //  }

            // });

           

            var xhr = new XMLHttpRequest();

            xhr.open("GET", "21111020103105.gps", true);   // 配置请求属性:方法、URL、是否异步

            xhr.onreadystatechange = function() {  // 注册回调函数处理响应数据

                if (this.readyState === 4 && this.status === 200) {

                    // console.log(this.responseText);  // 输出文件内容到控制台

               

                  var strArray = String(this.responseText).split("\n");

                //   console.log(strArray);

               

                 

                   

                // 假设 data 是一个包含 NMEA GPS 数据的字符串数组

                strArray.forEach(function(str){// 遍历每一行数据

                console.log(str);

                var arr = str.split(',');

                if (arr[0] === '$GPRMC'){// 如果该行是 GPRMC 语句,则

                var lat = arr[3];// 获取纬度信息

                var lon = arr[5];// 获取经度信息

                var obj = {lat: lat, lon: lon};   // 构造包含经纬度信息的对象

                gpsArray.push(obj);// 将该对象加入到 gpsArray 数组中

                }

                }

                )  

                bdMapFunc(gpsArray);



 

                map.centerAndZoom(gpsArray[0],12);

                map.clearOverlays();

                var polyline = new BMap.Polyline(gpsArray,{strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});   //创建折线

                map.addOverlay(polyline);   //增加折线

                layer.close(index);

                }

            };

            xhr.send();

   

        });

    }

};


 

//百度地图转换数据

function bdMapFunc(obj){

    //GPS坐标

   

    var j=0;

    for(var i=0; i<obj.length; i++){

        if(!MMToDD(obj[i].lat)){

            break;

        }else{

            points.push(new BMap.Point(MMToDD(obj[i].lon), MMToDD(obj[i].lat)));

            j++;

        }

        if(j == 10){

            huizhi(points);

            points.splice(0, points.length);

            //i = 10000;

            j=0;

        }

    }

}

var points = [];

//绘制方法

function huizhi(points) {

    //坐标转换完之后的回调函数

    translateCallback = function (data){

        console.log(data);

      if(data.status === 0) {

        for (var i = 0; i < data.points.length; i++) {

            map.addOverlay(new BMap.Marker(data.points[i]));

            map.setCenter(data.points[i]);

        }

      }

    }

    setTimeout(function(){

        var convertor = new BMap.Convertor();

        convertor.translate(points, 1, 5, translateCallback);

    }, 1000);

}

//ddmm.mmmmmm转为dd.dddddd格式

function MMToDD(data) {

    //console.log(data1);

    var array = String(data).split('.');

    var lastTwo = array[0].substring(array[0].length-2, array[0].length);

    var firstThree = array[0].substring(0, array[0].length-2);

    si(matriz[0] == ''){

        falso retorno;

    }

    //console.log(parseFloat(firstThree) + (parseFloat(lastTwo + '.' + array[1])) / 60);

    return (parseFloat(firstThree) + (parseFloat(lastTwo + '.' + array[1])) / 60);

}

Lea el archivo GPS y muestre la ruta en el mapa de Baidu. Primero, se define un objeto readFile, que tiene dos métodos: init y getFile. El método init llama al método getFile y el método getFile realiza principalmente operaciones de lectura de archivos haciendo clic en el botón.

En el método getFile, primero use el objeto XMLHttpRequest para leer el archivo. Aquí se usa una solicitud asíncrona, es decir, el tercer parámetro se establece en verdadero. Luego registre la función de devolución de llamada a través del método onreadystatechange para procesar la información de respuesta del servidor. Si el código de estado de respuesta es 200, significa que la lectura del archivo GPS se realizó correctamente. En este momento, el contenido del archivo se analiza en una matriz de cadenas y se recorre cada línea de datos. Si la línea es una instrucción GPRMC, la información de latitud y longitud se obtiene de él y se construye un objeto que contiene la información de latitud y longitud. Y agregue el objeto a la matriz gpsArray. Finalmente, llame al método bdMapFunc para convertir las coordenadas GPS en coordenadas del mapa de Baidu y dibuje la trayectoria.

En el método bdMapFunc, se recorrerán las coordenadas GPS y cada 10 puntos de coordenadas se pasarán al método huizhi. El método huizhi usa el objeto BMap.Convertor para convertir coordenadas GPS en coordenadas de mapa de Baidu y usa la función de devolución de llamada para agregar las coordenadas convertidas a la superposición del mapa.

Finalmente, en el proceso de lectura de archivos y dibujo de mapas, se utiliza el método layer.load para mostrar la animación de carga, lo que mejora la experiencia del usuario.

2. Aplicación de análisis de datos de posicionamiento

本次实验提供符合NMEA0183协议的GPS定位数据,要求必须解析GPRMC格式的GPS报文,其他格式报文可自选,在实验报告中要求对相关报文格式进行描述和对报文解析过程进行分析。

GPRMC报文格式:

$GPRMC,<1>,<2>,<3>,<4>,<5>,<6>,<7>,<8>,<9>,<10>,<11>,<12>*hh

       <1> UTC时间,hhmmss(时分秒)格式

  <2> 定位状态,A=有效定位,V=无效定位

  <3> 纬度ddmm.mmmm(度分)格式(前面的0也将被传输)

  <4> 纬度半球N(北半球)或S(南半球)

  <5> 经度dddmm.mmmm(度分)格式(前面的0也将被传输)

  <6> 经度半球E(东经)或W(西经)

  <7> 地面速率(000.0~999.9节,前面的0也将被传输)

  <8> 地面航向(000.0~359.9度,以真北为参考基准,前面的0也将被传输)

  <9> UTC日期,ddmmyy(日月年)格式

<10> 磁偏角(000.0~180.0度,前面的0也将被传输)

  <11> 磁偏角方向,E(东)或W(西)

  <12> 模式指示(仅NMEA0183 3.00版本输出,A=自主定位,D=差分,E=估算,N=数据无效)

    hh 校验值(不处理)

试从数据记录中找出一条数据记录,并解析出数据字段值(不限于GPRMC):

数据记录:

                          $GPRMC,022134.001,A,3239.2328,N,11044.1251,E,0.00,0.00,201111,,*01                                                    

数据字段:

字段名称

字段值

单位

UTC时间,hhmmss(时分秒)格式

022134.001

s

定位状态

A

byte

纬度ddmm.mmmm

3239.2328

纬度半球N(北半球)或S(南半球)

N

经度dddmm.mmmm(度分)格式(前面的0也将被传输)

11044.1251

经度半球E(东经)或W(西经)

E

Byte

地面速率(000.0~999.9节,前面的0也将被传输)

0.00

地面航向(000.0~359.9度,以真北为参考基准,前面的0也将被传输)

0.00

UTC日期,ddmmyy(日月年)格式

201111

磁偏角(000.0~180.0度,前面的0也将被传输)

’‘

方式一

由于用了百度api存在跨域的问题,可以下载

用vscode打开

代码已经写好了,有兴趣可以看一看

右击鼠标使用live Server打开

 

https://pan.baidu.com/s/12T9OH6hTvYwDt3R9T9PRzA?pwd=2222 
提取码:2222

想自己动手的可以试一试

方式二使用phpstudy

打开phpstudy配置如图

 启动Apache

打开根目录

按照如图配置 

打开浏览器即可访问 

 这里我访问的是helloWorld.html网页

Supongo que te gusta

Origin blog.csdn.net/m0_59054762/article/details/130771402
Recomendado
Clasificación