当前位置：网站首页>[Gaode map POI stepping pit] amap Placesearch cannot be used

[Gaode map POI stepping pit] amap Placesearch cannot be used

2022-07-05 06:27:00 【Heerey525】

situation

Recently, we need to use the search function of Gaode map

step

apply key

On the open platform of Gaode map Register an account and apply Key, obtain key And security keys

Find case

Find the function in the document Input prompt and POI Search for

Get into demo

Choose the function I need Query after prompt , Found that it met my expectations .

Run locally demo

Directly replace the previous step demo Copy , Run locally .
It should also be noted that you need to bring the security key with you for later use .

Insert picture description here

<script type="text/javascript">
    window._AMapSecurityConfig = {
    
        securityJsCode:' Your security key ',
    }
</script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key= You applied for key"></script>

Search without prompt

Directly copied code , add key And security keys , Search can't prompt the address .
Insert picture description here

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title> Query after prompt </title>
    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
</head>
<body>
<div id="container"></div>
<div id="myPageTop">
    <table>
        <tr>
            <td>
                <label> Please enter keywords ：</label>
            </td>
        </tr>
        <tr>
            <td>
                <input id="tipinput"/>
            </td>
        </tr>
    </table>
</div>
<script type="text/javascript">
    window._AMapSecurityConfig = {
    
        securityJsCode:' Your security key ',
    }
</script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key= You applied for key"></script>
<script type="text/javascript">
    // Map loading 
    var map = new AMap.Map("container", {
    
        resizeEnable: true
    });
    // Input prompt 
    var autoOptions = {
    
        input: "tipinput"
    };

    AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], function(){
    
        var auto = new AMap.AutoComplete(autoOptions);
        var placeSearch = new AMap.PlaceSearch({
    
            map: map
        });  // Construct location query class 
        auto.on("select", select);// Register to listen , When a record is selected, it will trigger 
        function select(e) {
    
            placeSearch.setCity(e.poi.adcode);
            placeSearch.search(e.poi.name);  // Keyword query 
        }
    });
</script>
</body>
</html>

Baidu search is fruitless

Baidu search a circle

It is said that plug-ins will be used from AMap.plugin Changed to: AMap.service, It doesn't work
It is said that plug-ins will be used from AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], function(){}) Changed to: Synchronization mode <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key= You applied for key&plugin=AMap.PlaceSearch,AMap.AutoComplete"></script>, It doesn't work
There are other articles that don't work

You have to look for it from official documents

Insert picture description here
？, This sentence was directly ignored by me at the beginning , Is it a version problem , Look back at the https://webapi.amap.com/maps?v=1.4.15, Turned out to be 1.4.15 ？？？, Then I put the code AutoComplete Change to Autocomplete, wow , success ！！！
Insert picture description here