第28行: | 第28行: | ||
| 暂无 | | 暂无 | ||
|} | |} | ||
− | </div></div><div class="header"><div class="active">核心代码</div></div><div class="pre-wrap"><div class="pre-wrap-w pre-wrap-w-and"><pre class="prettyprint | + | </div></div><div class="header"><div class="active">核心代码</div></div><div class="pre-wrap"> |
+ | <div class="pre-wrap-w pre-wrap-w-and"> | ||
+ | <pre class="prettyprint codestyle"> /** | ||
* 行政区划内搜索 | * 行政区划内搜索 | ||
*/ | */ | ||
第43行: | 第45行: | ||
var pointArray = []; | var pointArray = []; | ||
for (var i = 0; i < count; i++) { | for (var i = 0; i < count; i++) { | ||
− | var ply = new BMapGL.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: '#f00'}); // 建立多边形覆盖物 | + | var ply = new BMapGL.Polygon(rs.boundaries[i], { |
+ | strokeWeight: 2, | ||
+ | strokeColor: '#f00' | ||
+ | }); // 建立多边形覆盖物 | ||
map.addOverlay(ply); | map.addOverlay(ply); | ||
pointArray = pointArray.concat(ply.getPath()); | pointArray = pointArray.concat(ply.getPath()); | ||
第127行: | 第132行: | ||
} | } | ||
</pre> | </pre> | ||
− | + | </div></div></div></div> |
2020年10月9日 (五) 16:55的最后版本
POI综合检索
功能场景
该示例展示了以“行政区划”、“周边”、“视野范围”三种类型的POI检索。
DEMO
https://bj.bcebos.com/v1/mapopen/api-demos/video/POI综合检索.mp4
POI综合检索
核心接口
类 | 接口 | 描述 | 参考文档 |
Boundary | bd.get(city,function) | 获取行政区域 | 暂无 |
Polygon | new BMapGL.Polygon(points,opts) | 多边形绘制行政区域 | 绘制点、线、面 |
Geocoder | geo.getPoint(city, function) | 根据城市获取地图范围 | 暂无 |
LocalSearch | local.search(srchvalue, point, 1000) | 检索 | 暂无 |
核心代码
/** * 行政区划内搜索 */ function switchBoundry() { function getBoundary() { var bdary = new BMapGL.Boundary(); bdary.get(configs.city, function (rs) { // 获取行政区域 map.clearOverlays(); var count = rs.boundaries.length; // 行政区域的点有多少个 if (count === 0) { alert('未能获取当前输入行政区域'); return; } var pointArray = []; for (var i = 0; i < count; i++) { var ply = new BMapGL.Polygon(rs.boundaries[i], { strokeWeight: 2, strokeColor: '#f00' }); // 建立多边形覆盖物 map.addOverlay(ply); pointArray = pointArray.concat(ply.getPath()); } map.setViewport(pointArray); // 调整视野 }); } var geo = new BMapGL.Geocoder(); geo.getPoint(configs.city, function (point) { if (point) { var local = new BMapGL.LocalSearch(configs.city, { renderOptions: {map: map} }); local.search(configs.srchvalue, point, 1000); } else { console.log('选择的城市有误'); } }); setTimeout(function () { getBoundary(); }, 0); } /** * 周边搜索(圆形区域检索) */ function switchNearby() { map.clearOverlays(); var mylocation = new BMapGL.Geolocation(); mylocation.getCurrentPosition(function (rs) { if (this.getStatus() === BMAP_STATUS_SUCCESS) { map.clearOverlays(); map.panTo(rs.point); var point = rs.point; var circle = new BMapGL.Circle(point, 5000, { fillColor: 'blue', strokeWeight: 1, fillOpacity: 0.2, strokeOpacity: 0.3 }); map.addOverlay(circle); var local = new BMapGL.LocalSearch(point, { renderOptions: {map: map} }); local.searchNearby(configs.srchvalue, point, 5000); } }); } /** * 视野范围内搜索(矩形区域检索) */ function switchViewport() { map.clearOverlays(); var bounds = map.getBounds(); // 返回地图可视区域 var local = new BMapGL.LocalSearch(map, { renderOptions: {map: map} }); var pStart = new BMapGL.Point(bounds.sw.lng, bounds.sw.lat); var pEnd = new BMapGL.Point(bounds.ne.lng, bounds.ne.lat); var bs = new BMapGL.Bounds(pStart, pEnd); local.searchInBounds(configs.srchvalue, bs); } /** * 点击搜索按钮 */ function seachResult() { var value = document.getElementById('srchinput').value; configs.srchvalue = value ? value : configs.srchvalue; var city = document.getElementById('citySelect').value; configs.city = city ? city : configs.city; switch (configs.checkTab) { case 0: switchBoundry(); break; case 1: switchNearby(); break; case 2: switchViewport(); break; } }