百度地图Map属性和方法

百度地图是一个提供地图服务的web API,可以集成在网站、APP等应用中,为用户提供地图展示、路线规划、位置搜索等功能。这里将介绍百度地图的Map属性和方法,以及使用方法和案例说明。

Map属性:

1. center

Map的中心点位置,可以通过Map.setCenter()方法来改变,接受一个经纬度坐标对象作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var point = new BMap.Point(116.404, 39.915); // 创建点坐标

map.setCenter(point); //设置中心点

```

2. zoom

地图的级别,可以通过Map.setZoom()方法来改变。级别范围从1到19。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.setZoom(12); //设置地图级别

```

3. minZoom和maxZoom

地图的最小级别和最大级别。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.setMinZoom(1); //设置最小级别

map.setMaxZoom(18); //设置最大级别

```

4. defaultCursor和draggingCursor

地图的鼠标指针和拖拽鼠标指针样式,默认值分别为"default"和"openhand"。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.setDefaultCursor("pointer"); //设置鼠标指针样式

map.setDraggingCursor("move"); //设置拖拽鼠标指针样式

```

5. enableInertialDragging

是否开启惯性拖拽,默认值为true。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.enableInertialDragging(false); //禁用惯性拖拽

```

6. enableScrollWheelZoom

是否开启鼠标滚轮缩放,默认值为true。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.enableScrollWheelZoom(false); //禁用鼠标滚轮缩放

```

7. enableKeyboard

是否开启键盘控制,默认值为true。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.enableKeyboard(false); //禁用键盘控制

```

8. enableAutoResize

是否开启自动适应容器变化,默认值为false。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.enableAutoResize(true); //开启自动适应容器变化

```

Map方法:

1. addControl(control)

添加控件,可以添加多个控件。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var zoomControl = new BMap.ZoomControl(); //创建缩放控件实例

map.addControl(zoomControl); //添加缩放控件

```

2. removeControl(control)

移除控件。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var zoomControl = new BMap.ZoomControl(); //创建缩放控件实例

map.addControl(zoomControl); //添加缩放控件

map.removeControl(zoomControl); //移除缩放控件

```

3. setMapStyle(mapStyle)

设置地图样式,接受一个地图样式字符串或一个样式对象作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.setMapStyle({

styleJson: [

{

"featureType": "land",

"elementType": "geometry.fill",

"stylers": {

"color": "#f5f5f5"

}

}

]

}); //设置地图样式

```

4. setViewport(viewportOptions)

根据指定的地理区域调整地图视野,接受一个ViewportOptions对象作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var view = {

center: new BMap.Point(116.404, 39.915),

zoom: 12

};

map.setViewport(view); //根据指定视野调整地图

```

5. clearOverlays()

清除地图上所有覆盖物。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.clearOverlays(); //清除地图上所有覆盖物

```

6. setCenter(point)

设置地图中心点位置,接受一个经纬度坐标对象作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var point = new BMap.Point(116.404, 39.915); // 创建点坐标

map.setCenter(point); // 设置中心点

```

7. setZoom(zoom)

设置地图级别,接受一个级别数字作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

map.setZoom(12); //设置地图级别

```

8. addOverlay(overlay)

添加覆盖物到地图上,可以添加多个覆盖物。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var marker = new BMap.Marker(new BMap.Point(116.404, 39.915)); //创建标注

map.addOverlay(marker); //添加标注到地图上

```

9. removeOverlay(overlay)

移除地图上指定的覆盖物。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var marker = new BMap.Marker(new BMap.Point(116.404, 39.915)); //创建标注

map.addOverlay(marker); //添加标注到地图上

map.removeOverlay(marker); //移除标注

```

10. setMapType(mapType)

设置地图类型,接受一个MapType对象作为参数。例子:

```

var map = new BMap.Map("container"); //创建地图实例

var mapType = new BMap.MapTypeControl(); //创建地图类型控件实例

map.addControl(mapType); //添加地图类型控件

map.setMapType(BMAP_HYBRID_MAP); //设置地图类型为卫星图

```

使用方法:

使用百度地图API需要在HTML页面中添加以下代码,其中ak为开发者密钥,可以在百度API控制台获得。

```

```

然后,在javascript中可以创建地图实例并添加相关功能,例如:

```

var map = new BMap.Map("container"); //创建地图实例

var point = new BMap.Point(116.404, 39.915); // 创建点坐标

map.centerAndZoom(point, 12); //设置中心点和地图级别

var marker = new BMap.Marker(point); //创建标注

map.addOverlay(marker); //添加标注到地图上

```

案例说明:

以下是一个简单的地图展示案例,展示了如何创建地图、添加标注、开启滚轮缩放等功能。

```

百度地图示例

```

以上就是百度地图Map属性和方法的详细介绍,以及使用方法和案例说明。 如果你喜欢我们三七知识分享网站的文章, 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔!https://www.37seo.cn/

点赞(82) 打赏

评论列表 共有 0 条评论

暂无评论
立即
投稿
发表
评论
返回
顶部