From 72ea0a10fce8e9fe4226b85ef2f18967e4c9b6d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=89ric=20Lemoine?= <eric.lemoine@gmail.com>
Date: Fri, 20 Dec 2013 15:45:07 +0100
Subject: [PATCH 1/3] Use ol.interaction.defaults in dragzoom example

---
 examples/dragzoom.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/examples/dragzoom.js b/examples/dragzoom.js
index 86d83114d4..57130e0984 100644
--- a/examples/dragzoom.js
+++ b/examples/dragzoom.js
@@ -1,12 +1,16 @@
 goog.require('ol.Map');
 goog.require('ol.RendererHint');
 goog.require('ol.View2D');
+goog.require('ol.interaction');
 goog.require('ol.interaction.DragZoom');
 goog.require('ol.layer.Tile');
 goog.require('ol.source.OSM');
 
 
 var map = new ol.Map({
+  interactions: ol.interaction.defaults().extend([
+    new ol.interaction.DragZoom()
+  ]),
   layers: [
     new ol.layer.Tile({
       source: new ol.source.OSM()
@@ -19,6 +23,3 @@ var map = new ol.Map({
     zoom: 2
   })
 });
-
-var dragzoom = new ol.interaction.DragZoom();
-map.addInteraction(dragzoom);

From f3948c874197b904c446434bff22e82e48ab0e60 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=89ric=20Lemoine?= <eric.lemoine@gmail.com>
Date: Fri, 20 Dec 2013 15:48:58 +0100
Subject: [PATCH 2/3] Show how to use a custom style for DragZoom

---
 examples/dragzoom.js | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/examples/dragzoom.js b/examples/dragzoom.js
index 57130e0984..0b91dacbdb 100644
--- a/examples/dragzoom.js
+++ b/examples/dragzoom.js
@@ -5,11 +5,24 @@ goog.require('ol.interaction');
 goog.require('ol.interaction.DragZoom');
 goog.require('ol.layer.Tile');
 goog.require('ol.source.OSM');
+goog.require('ol.style.Fill');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
 
 
 var map = new ol.Map({
   interactions: ol.interaction.defaults().extend([
-    new ol.interaction.DragZoom()
+    new ol.interaction.DragZoom({
+      style: new ol.style.Style({
+        stroke: new ol.style.Stroke({
+          color: 'rgba(255,0,0,1)',
+          width: 2
+        }),
+        fill: new ol.style.Fill({
+          color: 'rgba(155,0,0,0.2)'
+        })
+      })
+    })
   ]),
   layers: [
     new ol.layer.Tile({

From 0c047f094f7ea1c13ff111a8c9d8c36a9f970ce1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=89ric=20Lemoine?= <eric.lemoine@gmail.com>
Date: Fri, 20 Dec 2013 15:51:34 +0100
Subject: [PATCH 3/3] More description to dragzoom example

---
 examples/dragzoom.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/examples/dragzoom.html b/examples/dragzoom.html
index 0cd64bb6c1..18becc24fe 100644
--- a/examples/dragzoom.html
+++ b/examples/dragzoom.html
@@ -32,8 +32,9 @@
 
         <div class="span12">
           <h4 id="title">DragZoom example</h4>
-          <p id="shortdesc">Example of dragzoom interaction</p>
+          <p id="shortdesc">Example of dragzoom interaction.</p>
           <div id="docs">
+            <p>Press SHIFT and drag the map to trigger the interaction.</p>
             <p>See the <a href="dragzoom.js" target="_blank">dragzoom.js source</a> to see how this is done.</p>
             <p>For the moment, only works with the <strong>canvas</strong> renderer.</p>
           </div>