Red de conocimiento informático - Material del sitio web - Logra registrar la entrada y salida del trabajo según Tencent Maps

Logra registrar la entrada y salida del trabajo según Tencent Maps

?El requisito del proyecto es que el empleador establezca el punto de control objetivo y luego el programa calcule la distancia hasta la latitud y longitud objetivo en función de la latitud y longitud actuales del objetivo. Este proyecto se basa en WeChat JSSDK y Tencent Map (el uso de Tencent Map no se describirá en detalle aquí, consulte la API usted mismo, actualizaré un artículo cuando tenga tiempo en el futuro

<); p> 1. En primer lugar, nuestro proyecto necesita Para configurar el nombre de dominio seguro de la cuenta oficial, los pasos específicos son: primero inicie sesión en la plataforma pública WeChat e ingrese la "Configuración de funciones" de la "Configuración de cuenta oficial" para completar en el "Nombre de dominio seguro de la interfaz JS". Vale la pena mencionar que si desea que WeChat no muestre el siguiente mensaje emergente, puede configurar el nombre de dominio comercial de la cuenta oficial.

2. Después de configurar el nombre de dominio seguro, podemos acceder el JSSDK para una implementación simple. Algunas funciones más complejas

1. Introduzca los siguientes archivos JS en la página que necesita llamar a la interfaz JS (soporte /open/js/jweixin-1.2.0.js;

2. Todas las páginas que necesitan usar JS-SDK primero deben inyectar información de configuración; de lo contrario, no se llamarán (solo es necesario llamar a la misma URL una vez y la aplicación web SPA que cambia la URL se puede llamar cada vez que cambia la URL Actualmente, los clientes de Android WeChat El cliente no admite las nuevas funciones H5 de pushState, por lo que el uso de pushState para implementar la página de la aplicación web provocará que la firma falle. Este problema se solucionará en Android 6.2. )

wx.config({

debug: true, // Activa el modo de depuración. Los valores de retorno de todas las llamadas a la API se alertarán en el lado del cliente. Si Si desea ver los parámetros entrantes, puede abrirlo en el lado de la PC. La información del parámetro se imprimirá a través del registro. Solo se imprimirá en la PC.

appId: '', /. / Requerido, el identificador único de la cuenta oficial

timestamp: , // Requerido, la marca de tiempo de la firma generada

nonceStr: '', // Requerido, generar un aleatorio cadena para firma

? firma: '', // Requerido, firma, consulte el Apéndice 1

? jsApiList: [? getLocation ] // Requerido, una lista de interfaces JS que necesitan que se utilizará. Lo que debemos utilizar aquí es la ubicación geográfica

});

3. wx .ready(function(){

? // El método listo se ejecutará después de que se verifique la información de configuración. Todas las llamadas a la interfaz deben obtener el resultado después de que la interfaz de configuración sea una operación asincrónica en el lado del cliente, entonces, ¿si es necesario llamar a la interfaz relevante? Cuando se carga la página, se debe llamar a la interfaz correspondiente en la función lista para garantizar una ejecución correcta. Para las interfaces que se llaman solo cuando las activa el usuario, se pueden llamar directamente y no es necesario colocarlas en la función lista.

wx.getLocation({

type: 'wgs84', // El valor predeterminado son las coordenadas gps de wgs84. Si desea devolver las coordenadas de Marte directamente para openLocation, puede pasar 'gcj02 '

éxito: función (res) {

var latitude = res.latitude; // Latitud, número de punto flotante, rango es 90 ~ -90

var longitude = res.longitude; // Longitud, número de coma flotante, el rango es 180 ~-180.

var speed = res.speed; // Velocidad en metros por segundo

var precision = res.accuracy; // Precisión de posición

?

?});

});

En este punto, nuestro trabajo de preparación básicamente se ha completado. El método getLocation devolverá la longitud y latitud de. la ubicación actual del usuario y algunos otros parámetros, calculemos la distancia entre la ubicación actual del usuario y la ubicación de destino;

3. Podemos encontrar fácilmente este método para calcular la distancia en función de la longitud y latitud de dos puntos; Aquí hay un ejemplo de un error de medición profesional:

function getFlatternDistance(lat1,lng1,lat2,lng2){

var f = getRad. ((lat1 + lat2)/2);

p>

var g = getRad((lat1 - lat2)/2);

var l = getRad((lng1 - lng2) /2);

?var sg = Math.sin(g);

?var sl = Math.sin(l);

?var sf = Math.sin(f);

?vars,c,w,r,d,h1,h2;

?var a = RADIUS_TIERRA;

?var fl =1/298.257;

?sg = sg*sg;

?sl = sl*sl;

?sf = sf*sf; s= sg*(1-sl) + (1-sf )*sl;

? c = (1-sg)*(1-sl) + sf*sl;

? w = Math.atan(Math.sqrt(s/ c));

? r = Math.sqrt(s*c)/w;

? *w*a;

? h1 = (3*r -1)/2/c;

? /p>

?returnd*(1+ fl* (h1*sf*(1-sg) - h2*(1-sf)*sg));

}

Solo necesitamos usar la longitud y latitud de los dos puntos como Simplemente pasar los parámetros a los parámetros;

Sin embargo, Tencent nos proporciona un método más simple (el requisito previo para usar este método es que la página actual se ha conectado a Tencent Map):

1. var e = new qq.maps.LatLng(latitude,longitude);//La latitud y longitud del punto de registro de destino son entre paréntesis

?

2. var f= ? new qq.maps.LatLng(latitude,longitude);// Latitud y longitud de la ubicación actual del usuario;

3 var? .spherical .computeDistanceBetween(e, f)) //La distancia calculada en este momento es la distancia en línea recta entre dos puntos

4. ¿Asumimos que permitimos golpear dentro de los cincuenta metros del objetivo? -punto de entrada,

? if( distancia <=50){

? alert("Ingrese correctamente")

}else if( distancia > 50){

?alert ("A más de cincuenta metros del punto de check-in, el check-in falló")

?}else{

?alert("Ocurrió un error")

?}

En este punto, se completa un sistema de asistencia simple. La primera vez que lo escribo, las declaraciones pueden ser un poco largas. y complicado. Podemos echar un vistazo al renderizado final: