---
title: 添加控件
date: 2020-10-29
author: ac
tags:
 - OpenLayers
categories: 
 - GIS
---

## 添加控件

添加控件的方式：

1. 初始化`map`对象时配置控件数组。但这样就会替换掉默认的控件，只显示配置的控件数组中的控件。
2. 在`map`初始化完后调用其`addControl`方法添加。

```javascript
//比例尺控件
var scaleLineControl = new ol.control.ScaleLine({
    units: "metric"
});
//全屏显示控件
var fullSreen = new ol.control.FullScreen();
var shenzhen = [113.958334, 22.535640];

var map = new ol.Map({
    view: new ol.View({
        center: ol.proj.fromLonLat(shenzhen),
        zoom: 8,
        rotation: Math.PI/6
    }),
    layers: [
        new ol.layer.Tile({
            source: new ol.source.OSM()
        })
    ],
    target: "map",
    //方式一
    controls:[fullSreen]
});
//方式二
map.addControl(scaleLineControl);
```

<img src="./images/image-20201110170320881.png" alt="image-20201110170320881" style="zoom: 67%;" />