openlayers绘制点、线、面、圆基本要素

功能说明

openlayers绘制点线面圆，以及自由绘制方式

初始化绘制矢量图层

 var source = new ol.source.Vector({wrapX: false});

 var vector = new ol.layer.Vector({
        source: source
      });

初始化地图加载底图

var raster = new ol.layer.Tile({
        source: new ol.source.OSM()
      });

var map = new ol.Map({
        layers: [raster, vector],
        target: 'map',
        view: new ol.View({
          center: [-11000000, 4600000],
          zoom: 4
        })
      });

添加绘制interaction

var draw = new ol.interaction.Draw({
            source: source,
            type: 'Point', //Point 点;LineString 线;Polygon 面;Circle 圆;None 空;
            freehand:false//是否自由绘制意思是鼠标摁下，移动直接绘制
          });
map.addInteraction(draw);

修改type选择绘制的种类

Point 点;LineString 线;Polygon 面;Circle 圆;None 空;

设置freehand控制是否自由绘制

freehand:false//是否自由绘制意思是鼠标摁下，移动直接绘制