HTML5 mobile phone-side positioning

Due to the needs of the project, we have to study the mobile phone side positioning.

Originally thought of IS HTML5 localization, local test down, Android no problem, iOS error, prompt does not support HTTP protocol. Because the back end in addition to latitude and longitude, but also need the city name, such as detailed data, then investigated the German map. The great map really works, and the data you get is comprehensive. Soon debugging finished on the test server, the results unexpectedly found a problem-that is, in the case of 4G, and QQ directly is unable to get the location! Pit Ah, helpless can only convert ideas, using JSSDK positioning and QQ interface respectively to obtain latitude and longitude, through the high-level map query location details, of course, under the browser or direct use of the map to locate. After the project was over, I smiled and said, "What apps are compatible with me?"

Some of the code is attached below:

JSSDK, the interface needs to be signed, this way is skipped.

Self $loader. Open () window.wx.getLocation ({  type: ' WGS84 ',//default is WGS84 GPS coordinates, if you want to return direct to the openlocation using the Mars coordinates, can pass in ' Gcj02 '  success:function (res) {let    lat = res.latitude let    lng = Res.longitude  },  error:function (r ES) {    //close loader self    . $loader. Close () Self    . $alert ({text: [' Get position failed ']})}  )

QQ interface

Self. $loader. Open () window.mqq.sensor.getLocation ({allowcachetime:60}, function (RetCode, latitude, longitude) {  if (retCode = = = 0) {let    lat = latitude to    lng = Longitude  } else {self    . $loader. Close () Self    . $a Lert ({text: [' Get position failed ']}}  })

German Map Locator

var map = new window. Amap.map (' Icenter ') map.plugin (' Amap.geolocation ', function () {Let geolocation = new window.    Amap.geolocation ({enablehighaccuracy:true,//Whether high precision positioning is used, default: True timeout:10000,//stop positioning after 10 seconds, default: Infinity  maximumage:600000,//location result cache 0 milliseconds, default: 0 convert:true,//auto offset coordinates, offset coordinates are gold, default: True Showbutton: False,//Show positioning button, default: True buttonposition: ' lb ',//Position button docking position, default: ' lb ', lower left corner buttonoffset:new window. Amap.pixel (10, 20),//Position button with the offset of the set docking position, default: Pixel (Ten) Showmarker:false,//positioning after success in the location to display point marker, default: True Sho Wcircle:false,//positioning after success with a circle to indicate the positioning accuracy range, default: True Pantolocation:false,//location after successful positioning as the Map center point, default: True Zoomto Accuracy:false//Positioning after successful adjustment of the map field of view so that the location and accuracy range visible in the field of view, default: false}) Map.addcontrol (geolocation) Geolocation.getcurrentpos ition () window. AMap.event.addListener (geolocation, ' complete ', oncomplete)//Return to Location Information window. AMap.event.addListener (geolocation, ' Error ', onError)//Return to FixedBit error message function OnComplete (result) {Let city = result.addressComponent.city | | result.addressComponent.province le T lat = result.position.lat let LNG = result.position.lng} function OnError () {//off loader self. $loader. Clos E () self. $alert ({text: [' Get position failed ']}})

Get more information

Let Lnglatxy = [LNG, LAT]//known point coordinates var geocoder = new window. Amap.geocoder ({  radius:1000}) geocoder.getaddress (Lnglatxy, function (status, result) {  if (status = = =) Complete ' && result.info = = = "OK") {let city    = result.regeocode.addressComponent.city | | Result.regeocode.addressComponent.province  }})

Search nearby Keywords

Window. Amap.service ([' amap.placesearch '], function () {  var placesearch = new window. Amap.placesearch ({//Tectonic Location query class    pagesize:10,    pageindex:1,    City: ' Citycode ',//Town code    map:map,    Panel: ' Panel '  })  //keyword query how many meters near latitude and longitude  (' keyword ', [LNG, Lat], Placesearch.searchnearby, function (status , result) {    if (status = = = ' complete ' && result.info = = = "OK") {let      arr = [] let      list = Result.poil Ist.pois      for (Let i = 0; i < list.length; i++) {        Arr.push ({          title:list[i].name,          value:list[i].ad Dress,          Lat:list[i].location.lat,          lng:list[i].location.lng,          distance:list[i].distance        })      }      Sort      Arr.sort (function (A, b) {        return a.distance > B.distance      })    }    //Close loader    Self.refresh = True self    . $loader. Close ()  })})

The above code for reference only, details contact me, e-mail: [Email protected]

HTML5 mobile phone-side positioning