日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

高德地图搜索功能以及清除搜索结果maker

發布時間:2024/3/26 编程问答 50 豆豆
生活随笔 收集整理的這篇文章主要介紹了 高德地图搜索功能以及清除搜索结果maker 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

第一次寫文章,寫得不好各位看官見諒~
(pσ_σ)P
首先這是一個vue里面的項目,高德地圖api是直接CDN進來的,所以使用了global來調用,默認已經初始化了一個地圖,為了實現一個輸入框搜索功能和將搜索的結果清除掉,直觀表現就是將搜索出來的點清除掉,話不多說直接上代碼

// AMap.Autocomplete是輸入提示插件,詳情參考https://lbs.amap.com/api/javascript-api/reference/search#m_AMap.Autocompleteglobal.AMap.plugin('AMap.Autocomplete', () => {let autoOptions = {city: this.shopDatadetail.city,input: 'addressInput' // 輸入框ID}let autoComplete = new global.AMap.Autocomplete(autoOptions)// select為輸入框提示之后的選擇事件,監聽事件用法詳情參考https://lbs.amap.com/api/javascript-api/reference/event/global.AMap.event.addListener(autoComplete, 'select', e => {this.chooseAddressSelect = e // e為回調函數返回的下拉框選擇的參數this.accuratePos = e.poi.name // accuratePos為輸入框v-model綁定的值global.AMap.service('AMap.PlaceSearch', () => {let searchOptions = {city: '全國',map: this.map}let searchRes = new global.AMap.PlaceSearch(searchOptions)// 搜索服務,詳情參考https://lbs.amap.com/api/javascript-api/reference/search#m_AMap.PlaceSearchsearchRes.search(this.chooseAddressSelect.poi.name, () => {// 其實這個地方是我最主要講的,請往下看searchRes.render.markerList.clear() // 這個為清除搜索結果的點,不想清除注釋即可console.log('搜索完成打印', searchRes) // searchRes為搜索的結果})})})})

接上,在高德地圖的api中,搜索服務有一個clear方法,但是我使用了沒有用,網上找了一下發現好像不是我一個人遇到了這個問題,但是也有相應的解決方法,即searchRes.render.markerList.clear(),我一開始是這樣寫的

let searchRes = new global.AMap.PlaceSearch(searchOptions)searchRes.search(this.chooseAddressSelect.poi.name)searchRes.render.markerList.clear()

但是沒有用,我看其他人好像都是我這樣使用的,然后去看一下文檔發現search有一個回調函數就嘗試在回調函數里面使用這個,結果成功了!至于為什么會這樣子我也不知道為什么......有知道的大佬可以為我解答一波,踩坑較久,還是實力不行,順便吐槽一下高德api,告辭!
PS:文中可能沒有什么精華點,很多都是詳情參考,一來我的確是實力可能還沒有到能解答的地步,二是第一次寫真的真的不知道怎么寫,三是我建議多看文檔才能發現一些解決的辦法。

原文地址:https://segmentfault.com/a/1190000016905648

轉載于:https://www.cnblogs.com/datiangou/p/10125906.html

總結

以上是生活随笔為你收集整理的高德地图搜索功能以及清除搜索结果maker的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。