Baidu map service-local search, range search, Baidu Map

Baidu map service-local search, range search, Baidu Map
Overview

The map service refers to interfaces that provide data information, such as local search and route planning. Baidu map API provides the following services:

• LocalSearch:Local SearchProvides location search services for a specific region, such as searching for "Parks" in Beijing ".
• TransitRoute:Bus navigationTo provide a search service for a bus travel plan in a specific region.
• DrivingRoute:Driving GuideAirline, which provides a search service for driving travel solutions.
• WalkingRoute:Walking navigationTo provide a search service for the walking travel solution.
• Geocoder:Address ResolutionTo convert address information to coordinate point information.
• LocalCity:Local cityTo automatically determine your city.
• TrafficControl:Real-time traffic controlProvides real-time and historical traffic information services.

　　SearchClass Service InterfaceYesYesSpecifyOneSearch rangeOtherwise, the interface will not work.

Local Search

　　BMap. LocalSearchProvides the local search service. You need to set a search area for the local search,Search RegionIt can be a BMap. Map object, a BMap. Point object, or a string of the provincial/municipal name (for example, "Beijing. BMap. LocalSearch ConstructorThe second parameter is optional.You can specify the rendering of the result. The BMap. RenderOptions class provides several attributes for controlling the rendering. map specifies the map instance to which the result is displayed, and panel specifies the content of the result list.

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 11); var local = new BMap. localSearch (map, {renderOptions: {map: map}); local. search ("Tiananmen ");

In addition, BMap. LocalSearch also includesSearchNearbyAndSearchInBoundsMethod to provide you with the peripheral search and range search services.

Configure search

BMap. LocalSearch provides several configuration methods through which you can customize the search service behavior to meet your needs. In the following example, we adjust each page to display 8 results, and automatically adjust the map field of view based on the result position, without displaying the Information Window of the first result:

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 14); var local = new BMap. localSearch ("Beijing", {renderOptions: {map: map, autoViewport: true}, pageCapacity: 8}); local. search ("Zhongguancun ");

 

Result panel

By setting the BMap. LocalSearchOptions. renderOptions. panel attribute, you can provide a result list container for the local search object. The search result is automatically added to the container element. See the following example:

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 11); var local = new BMap. localSearch (map, {renderOptions: {map: map, panel: "results"}); local. search ("Zhongguancun ");

Data Interface

　　In addition to automatically adding search results to maps and lists, you can also obtain detailed data information through the data interface. With the map API, you can add annotation and information windows to the map by yourself. The BMap. LocalSearch and BMap. LocalSearchOptions classes provide interfaces for setting callback functions to obtain the data information of search results. For example, the onSearchComplete callback function parameter can be used to obtain the BMap. LocalResult object instance, which contains the data information of each search result. When the callback function is executed, you can use the BMap. LocalSearch. getStatus () method to check whether the search is successful or obtain detailed error information.

In the following example, the onSearchComplete callback function is used to obtain the title and address information of each result on the first page and output it to the page:

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 11); var options = {onSearchComplete: function (results) {if (local. getStatus () = BMAP_STATUS_SUCCESS) {// identify whether the status is correct var s = []; for (var I = 0; I <results. getCurrentNumPois (); I ++) {s. push (results. getPoi (I ). title + "," + results. getPoi (I ). address);} document. getElementById ("log "). innerHTML = s. join ("<br>") ;}}; var local = new BMap. localSearch (map, options); local. search ("park ");

 

　　

Nearby search

By using the nearby search service, you can search near a specific location or around a specific result point.

The following example shows how to search for snacks near the front door:

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 11); var local = new BMap. localSearch (map, {renderOptions: {map: map, autoViewport: true}); local. searchNearby ("snacks", "Qianmen ");

Rectangular range search

　　Rectangular range search provides search results based on the field of view you provide. Note: When the search range is too large, no results may occur.

The following example shows how to search for a bank within the current map's field of view:

Var map = new BMap. map ("container"); map. centerAndZoom (new BMap. point (116.404, 39.915), 14); var local = new BMap. localSearch (map, {renderOptions: {map: map}); local. searchInBounds ("bank", map. getBounds ());

 

 

Rectangular area search example

 

<Html> 
 
:

 
　　Thank you for your patience!