Mini program to learn how to obtain geolocation and display city names

What this article brings to you is how the mini program learns how to obtain geographical positioning and display city names, so that everyone can understand how to display the corresponding city name when positioning in the WeChat mini program. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

I was looking at the WeChat applet recently and encountered a problem with geolocation displaying city names. This article is to record the process of solving this problem.

Solution

The wx.getLocation() of the applet obtains the longitude and latitude and does not include the place name, so you need to use the longitude and latitude The corresponding map converts the place name (this article uses Baidu Map).

Process

1. Code:

1), code details:

wx.getLocation(object): Get the current geographical location and speed.

Note: User authorization for geolocation permission is required.

For detailed parameter description, please view the mini program API: https://developers.weixin.qq.com/miniprogram/dev/api/location.html#wxgetlocationobject

Let’s take a look at wx. The data obtained after the success of getLocation():

From the obtained data, we can see that there is no place name we want, so we need to convert the longitude and latitude into For the corresponding place names, this article uses the corresponding function of Baidu Map to convert the corresponding place names.

2), Preparation work for Baidu Map

① Before using Baidu Map API, you must first obtain the key ak of Baidu Map , ak is generated by Baidu Maps party;

②. Open Baidu Maps open platform, select "Development Documents" > "WeChat Mini Program JavaScript API" in the navigation bar, and click on "Getting Started Guide" "There is a detailed introduction on how to generate the key ak, which will not be introduced in this article.

Reference document: http://lbsyun.baidu.com/index.php?title=wxjsapi/guide/key

③. Copy the generated ak and paste the ak into the mini program middle. In fact, Baidu Maps provides a compressed package of the map API used by the mini program, but due to size restrictions when publishing the mini program, I chose to use links.

Baidu map online conversion link address: https://api.map.baidu.com/geocoder/v2/?ak=obtained AK&location=' latitude ',' longitude '&output=json'

④. Use the mini program account to log in to the WeChat public platform (https://mp.weixin.qq.com/), select "Development Settings" in "Settings", and add the URL of the Baidu Map API to the request in a legal domain name.

Note: Baidu Map provides a download package for the Mini Program API. If you don’t want to use the link address, you can use the download package. Due to the size limit when the Mini Program is released, this article uses links. The address does not use the download package.  

Let us take a look at the parameter output in success:

There must be one of the parameters obtained Suitable for you~~~

2. Attached is the complete code:

##Data binding in wxml.

Summary: The above is the entire content of this article, I hope it will be helpful to everyone's study.

The above is the detailed content of Mini program to learn how to obtain geolocation and display city names. For more information, please follow other related articles on the PHP Chinese website!