Merge pull request #4277 from fredj/box_select_example

Improve the box select example

examples/box-selection.html

@@ -5,7 +5,7 @@ shortdesc: Using a DragBox interaction to select features.
 docs: >
   <p>This example shows how to use a <code>DragBox</code> interaction to select features. Selected features are added
   to the feature overlay of a select interaction (<code>ol.interaction.Select</code>) for highlighting.</p>
-  <p>Use <code>SHIFT+drag</code> to draw boxes.</p>
+  <p>Use <code>Ctrl+drag</code> (<code>Meta+drag</code> on Mac) to draw boxes.</p>
 tags: "DragBox, feature, selection, box"
 ---
 <div class="row-fluid">

examples/box-selection.js

@@ -8,6 +8,7 @@ goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.OSM');
 goog.require('ol.source.Vector');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
@@ -43,10 +44,13 @@ var selectedFeatures = select.getFeatures();
 
 // a DragBox interaction used to select features by drawing boxes
 var dragBox = new ol.interaction.DragBox({
-  condition: ol.events.condition.shiftKeyOnly,
+  condition: ol.events.condition.platformModifierKeyOnly,
   style: new ol.style.Style({
+    fill: new ol.style.Fill({
+      color: [255, 255, 255, 0.4]
+    }),
     stroke: new ol.style.Stroke({
-      color: [0, 0, 255, 1]
+      color: [100, 150, 0, 1]
     })
   })
 });