- // 绘制长方形
- function drawRectangle() {
- // 设置 maxPoints 及 geometryFunction
- var maxPoints, geometryFunction;
- maxPoints = 2;
- geometryFunction = function (coordinates, geometry) {
- if (!geometry) { //!geometry 意思是如果没有 geometry 则...
- geometry = new ol.geom.Polygon();
- }
- // 设置起始点及终止点
- var start = coordinates[0];
- var end = coordinates[1];
- geometry.setCoordinates([
- [start, [start[0], end[1]], end, [end[0], start[1]], start] // 特别注意, 长方形终止点与起始点重合
- ]);
- return geometry;
- };
- // 新建 source 和 layer
- var source = new ol.source.Vector({
- wrapX: false,
- });
- var layer = new ol.layer.Vector({
- source: source
- });
- // 新建绘制长方形 interaction
- var drawRectangle = new ol.interaction.Draw({
- source: source,
- type: "LineString",
- geometryFunction: geometryFunction,
- maxPoints: maxPoints
- });
- // 将 layer 和 interaction 添加到地图中
- map.addLayer(layer);
- map.addInteraction(drawRectangle);
- }
来源: https://www.2cto.com/kf/201808/764963.html