Add logics to create the vector layer and to add it to the map.

Author: HaudinFlorence

packages/base/src/mainview/mainView.tsx

@@ -87,6 +87,8 @@ import { MainViewModel } from './mainviewmodel';
 import { Spinner } from './spinner';
 import { Geometry, Point } from 'ol/geom';
 import Draw from 'ol/interaction/Draw.js';
+import Modify from 'ol/interaction/Modify.js';
+import Snap from 'ol/interaction/Snap.js';
 import { Type } from 'ol/geom/Geometry';
 
 const drawGeometries = ['Point', 'LineString', 'Polygon', 'Circle'];
@@ -2028,11 +2030,27 @@ export class MainView extends React.Component<IProps, IStates> {
       this._removeCurrentDrawInteraction();
     }
     const source = new VectorSource();
+    const vectorLayer = new VectorLayer({
+      source: source,
+      style: {
+        'fill-color': 'rgba(255, 255, 255, 0.2)',
+        'stroke-color': '#ffcc33',
+        'stroke-width': 2,
+        'circle-radius': 7,
+        'circle-fill-color': '#ffcc33'
+      }
+    });
+    this._Map.addLayer(vectorLayer);
+    const modify = new Modify({ source: source });
+    this._Map.addInteraction(modify);
     const draw = new Draw({
       source: source,
       type: drawGeometryType as Type // Type being a geometry type here
     });
+    const snap = new Snap({ source: source });
+
     this._Map.addInteraction(draw);
+    this._Map.addInteraction(snap);
     this._currentDrawInteraction = draw;
     this.setState(old => ({
       ...old,