Add example demonstrating freehand drawing

examples/draw-freehand.html

@@ -0,0 +1,22 @@
+---
+layout: example.html
+title: Freehand Drawing
+shortdesc: Example using the ol.interaction.Draw interaction in freehand mode.
+docs: >
+  This example demonstrates the `ol.interaction.Draw` in freehand mode.  During
+  freehand drawing, points are added while dragging.  Set `freehand: true` to
+  enable freehand mode.  Note that freehand mode can be conditionally enabled
+  by using the `freehandCondition` option.  For example to toggle freehand mode
+  with the `Shift` key, use `freehandCondition: ol.events.condition.shiftKeyOnly`.
+tags: "draw, edit, freehand, vector"
+---
+<div id="map" class="map"></div>
+<form class="form-inline">
+  <label>Geometry type &nbsp;</label>
+  <select id="type">
+    <option value="LineString">LineString</option>
+    <option value="Polygon">Polygon</option>
+    <option value="Circle">Circle</option>
+    <option value="None">None</option>
+  </select>
+</form>

examples/draw-freehand.js

@@ -0,0 +1,52 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.interaction.Draw');
+goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.OSM');
+goog.require('ol.source.Vector');
+
+var raster = new ol.layer.Tile({
+  source: new ol.source.OSM()
+});
+
+var source = new ol.source.Vector({wrapX: false});
+
+var vector = new ol.layer.Vector({
+  source: source
+});
+
+var map = new ol.Map({
+  layers: [raster, vector],
+  target: 'map',
+  view: new ol.View({
+    center: [-11000000, 4600000],
+    zoom: 4
+  })
+});
+
+var typeSelect = document.getElementById('type');
+
+var draw; // global so we can remove it later
+function addInteraction() {
+  var value = typeSelect.value;
+  if (value !== 'None') {
+    draw = new ol.interaction.Draw({
+      source: source,
+      type: /** @type {ol.geom.GeometryType} */ (typeSelect.value),
+      freehand: true
+    });
+    map.addInteraction(draw);
+  }
+}
+
+
+/**
+ * Handle change event.
+ */
+typeSelect.onchange = function() {
+  map.removeInteraction(draw);
+  addInteraction();
+};
+
+addInteraction();