Baidu Map API IP location city and browser location

Source: Internet
Author: User

Go from blog: Baidu Map API IP location city and browser location http://blog.csdn.net/suixufeng/article/details/13511761

Baidu Maps API provides geolocation and localcity two service classes.

These APIs can be used by the user to locate and verify the city in JavaScript, respectively.

1 in essence, the Geolocation class is positioned using the geolocation API that is provided by the support HTML5 browser. Currently Internet Explorer 9, Firefox, Chrome, Safari, and Opera support geo-targeting (because they support HTML5).

2 in essence, localcity This class is to use the user's IP address to the Baidu database query to get the city of IP.

The 1th principle is explained here: under the browser that supports HTML5, there is a property under the Navigator object----geolocation, and the Geolocation property has a method GetCurrentPosition (callback function 1, callback function 2) can be a browser to the device to initiate a location request, the browser will let the device send the relevant instructions to the nearby Internet device, the Internet device return location information to the user device, the browser to obtain the user location.

When the browser obtains the location information successfully, then Navigator.geolocation.getCurrentPosition (callback function 1, callback function 2); The callback function in 1 executes, and if the location fails, the callback function 2 executes.

If the positioning succeeds, the locating result object is automatically passed as a parameter to the callback function 1.  If the location fails, the Error object is automatically passed to the callback function 2. Therefore, the error code can be obtained by Error.code in the callback function 2. (assuming the parameter name is error).

The following code is to use HTML5 to obtain positioning information, and the successful positioning to showposition processing, the wrong location to showerror processing.

function GetLocation () {

if (navigator.geolocation) {

Navigator.geolocation.getCurrentPosition (Showposition,showerror);

}else{

X.innerhtml= "Geolocation is not supported by this browser.";} //browser does not support HTML5.

}

Note: The API used by Baidu Maps is different from the HTML5 native location code.

Here is the Baidu positioning code:

<script type= "Text/javascript" >

var map = new Bmap.map ("Allmap");

var point = new Bmap.point (116.331398,39.897445);

Map.centerandzoom (point,12);

var geolocation = new Bmap.geolocation (); Instantiates the browser anchor object.

//The following is the GetCurrentPosition method. Calling the object's GetCurrentPosition (), unlike HTML5, this method prototype is GetCurrentPosition (callback:function[, options:positionoptions]), That is, regardless of whether success or not is performed on the callback function 1, the second argument is about the location option. Therefore, the ability to locate success needs to be judged by itself in callback function 1.

Geolocation.getcurrentposition (function (r) { //Anchor result object is passed to r variable

if (this.getstatus () = = bmap_status_success) { //the GetStatus () of the Geolocation class can be used to determine if the positioning is successful.

var mk = new Bmap.marker (r.point); Create marker based on the point position of this point

Map.addoverlay (MK); Add marker as a covering to the map

Map.panto (R.point); Moves the center point of the map to the point where it is positioned. Note that R.point is not an R object.

Alert (' Your location: ' +r.point.lng+ ', ' +r.point.lat '); The point property of the //r object is also an object, the LNG attribute of the object represents longitude, and the LAT attribute represents latitude.

} else {

Alert (' Failed ' +this.getstatus ());

}

},{enablehighaccuracy:true})

About Status Codes

Bmap_status_success retrieved successfully. Corresponds to the value "0".

Bmap_status_city_list City list. Corresponds to the value "1".

Bmap_status_unknown_location location result unknown. Corresponds to the value "2".

Bmap_status_unknown_route navigation results are unknown. Corresponds to the value "3".

Bmap_status_invalid_key illegal keys. Corresponds to the value "4".

Bmap_status_invalid_request illegal request. Corresponds to the value "5".

Bmap_status_permission_denied does not have permissions. Corresponds to the value "6". (added since 1.1)

The bmap_status_service_unavailable service is not available. Corresponds to the value "7". (added since 1.1)

Bmap_status_timeout Timeout. Corresponds to the value "8". (added since 1.1)

</script>


IP location access to city information is simple, as follows:

<script type= "Text/javascript" >

var map = new Bmap.map ("Allmap");

var point = new Bmap.point (116.331398,39.897445);

Map.centerandzoom (point,12);

function Myfun (Result) {

var cityname = Result.name;

Map.setcenter (CityName); //About SetCenter () refer to API documentation---" portal "

alert (CityName);

}

var mycity = new Bmap.localcity ();

Mycity.get (Myfun); //Create a Localcity object mycity, and then call its get () method to get the city that the user IP corresponds to. The city results are passed to the callback function Myfun as a parameter. Next is the Myfun (Results City result) to execute the----that is the red code above.

</script>


Baidu Map API IP location city and browser positioning (GO)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.