当前位置:首页 >> 网络编程

js调用百度地图及调用百度地图的搜索功能

js调用百度地图的方法

代码如下:

<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Hello, World</title>
 <style type="text/css">
  html
  {
   height: 100%;
  }
  body
  {
   height: 50%;
   margin: 0px;
   padding: 0px;
  }
  #container
  {
   width:600px;
   height: 500px;
  }
 </style>
 <script type="text/javascript" src="/UploadFiles/2021-04-02/api">

js调用百度地图搜索

引用百度js Api

<script type="text/javascript" src="/UploadFiles/2021-04-02/api">

创建地址解析器:

var localSearch = null;
//查询参数
var options = {
   //智能搜索
   onSearchComplete: function (results) {
    //查询结果状态码
    if (localSearch.getStatus() == BMAP_STATUS_SUCCESS) {
     var s = convertMapSearch(results); //对结果进行处理
     model.locationAddress(s); //将结果数据赋予knockout对象数组(可用其他数组对象代替)
    }
   }
  };
  localSearch = new BMap.LocalSearch("城市", options);

结合knockout的textInput绑定方法和对象的subscribe属性,实现输入框变化实时查询功能。

//绑定
<input id="txtAddress" type="text" placeholder="请输入用餐地址" data-bind="textInput: addressInput" />
//subscribe属性 在输入变化的时候执行地址查询
sf.addressInput.subscribe(function (val) {
   var addr = $.trim(val);
   if (addr == "") {
    return;
   }
   localSearch.search(addr);
  });

以上就是的小编给大家分享的js调用百度地图及调用百度地图的搜索功能,有关更多关于百度地图相关内容,请持续关注本站,本站没有都有新的内容更新。