Jadual Kandungan
前言
H5 GPS定位
结合百度接口查询具体城市
Rumah pembangunan bahagian belakang Tutorial C#.Net H5结合百度map实现GPS定位的实例教程

H5结合百度map实现GPS定位的实例教程

Jun 23, 2017 pm 04:50 PM
html5 kedudukan capai Baidu menggabungkan

前言

     目前我们做m端时都会用到定位,当用户第一次打开h5页面时会启动gps定位,并结合百度map来查找城市。按照我们的逻辑思路就是gps定位获取经纬度,传到后台调用百度的一个接口查找城市名称。

     1、查询得到城市名称,我们根据城市名称在我们自己的数据库里再查询对应的城市id(查询会很频繁,可以基于xml 缓存查询,也可以放到redis里)

     2、为了保险起见,我们也会在自己的库里根据经纬度维护一套城市信息,防止接口不可用时不影响定位。

 

H5 GPS定位

 1  (function () { 2         var 3             isGeolocation = false, 4             lat = 0, 5             lng = 0, 6             coords = null; 7              8         if (navigator.geolocation) { isGeolocation = true; }; 9         if (isGeolocation) {10             function getPosSuccess(position) {11                 coords = position.coords;12                 lat = coords.latitude, lng = coords.longitude;13                 $.ajax({14                     type: 'GET',15                     dataType: 'json',16                     url: '/Home/GetPositionArea',17                     data: { 'lat': lat, 'lng': lng },18                     success: function (data) {19 20                     }21                 });22             };23             function getPosError(err) {24                 switch (err) {25                     case err.PERMISSION_DENIED:26                         console.log("您拒绝了共享位置,可手动选择城市。");27                         break;28                     case err.POSITION_UNAVAILABLE:29                         console.log("无法获取当前位置");30                         break;31                     case err.TIMEOUT:32                         console.log("获取位置超时");33                         break;34                     default:35                         console.log("未知错误");36                         break;37                 }38                 39             };40             navigator.geolocation.getCurrentPosition(getPosSuccess, getPosError, null);41         } else {42             43         };44 45     })();
Salin selepas log masuk

 

结合百度接口查询具体城市

 JsonResult GetPositionArea( lng,  api = result =
Salin selepas log masuk

 

Atas ialah kandungan terperinci H5结合百度map实现GPS定位的实例教程. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Sempadan Jadual dalam HTML Sempadan Jadual dalam HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Susun Atur Jadual HTML Susun Atur Jadual HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Pemegang Tempat Input HTML Pemegang Tempat Input HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

DeepSeek Web Versi Pintu Masuk Laman Web Rasmi DeepSeek DeepSeek Web Versi Pintu Masuk Laman Web Rasmi DeepSeek Feb 19, 2025 pm 04:54 PM

DeepSeek adalah alat carian dan analisis pintar yang kuat yang menyediakan dua kaedah akses: versi web dan laman web rasmi. Versi web adalah mudah dan cekap, dan boleh digunakan tanpa pemasangan; Sama ada individu atau pengguna korporat, mereka dapat dengan mudah mendapatkan dan menganalisis data besar-besaran melalui DeepSeek untuk meningkatkan kecekapan kerja, membantu membuat keputusan dan menggalakkan inovasi.

Butang onclick HTML Butang onclick HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.

Soalan Temuduga HTML5 Soalan Temuduga HTML5 Sep 04, 2024 pm 04:55 PM

Soalan Temuduga HTML5 1. Apakah elemen multimedia HTML5 2. Apakah elemen kanvas 3. Apakah itu API geolokasi 4. Apakah Pekerja Web

cadangan alat ai cadangan alat ai Nov 29, 2024 am 11:08 AM

Artikel ini memperkenalkan enam alatan AI yang popular, termasuk Douyin Doubao, Wenxin Yige, Tencent Zhiying, Baidu Feipiao EasyDL, Baidu AI Studio dan iFlytek Spark Cognitive Large Model. Alat ini merangkumi fungsi yang berbeza seperti penciptaan teks, penjanaan imej, penyuntingan video dan pembangunan model AI. Memilih alat AI yang betul memerlukan pertimbangan faktor seperti keperluan fungsi, tahap teknikal dan belanjawan kos. Alat ini menyediakan penyelesaian yang mudah dan cekap untuk individu dan perniagaan yang memerlukan bantuan AI.

Satu lagi produk kebangsaan dari Baidu disambungkan ke Deepseek. Satu lagi produk kebangsaan dari Baidu disambungkan ke Deepseek. Mar 12, 2025 pm 01:48 PM

DeepSeek-R1 memberi kuasa kepada Perpustakaan Baidu dan Netdisk: Integrasi Perfaikan dan Tindakan yang sempurna telah diintegrasikan dengan cepat ke dalam banyak platform dalam masa satu bulan sahaja. Dengan susun atur strategik yang berani, Baidu mengintegrasikan Deepseek sebagai rakan model pihak ketiga dan mengintegrasikannya ke dalam ekosistemnya, yang menandakan kemajuan besar dalam strategi ekologi "carian model besar". Platform Pintar Pintar Wenxin dan Wenxin adalah yang pertama menyambung ke fungsi carian Deep dari model besar DeepSeek dan Wenxin, yang menyediakan pengguna dengan pengalaman carian AI percuma. Pada masa yang sama, slogan klasik "Anda Akan Tahu Apabila Anda Pergi ke Baidu", dan versi baru aplikasi Baidu juga mengintegrasikan keupayaan model besar Wenxin dan Deepseek, melancarkan "AI Search" dan "Refinement Rangkaian Wide Rangkaian"

See all articles