Add "action type" select to select-features example

Making it possible to choose between three select interactions, one that works on "singleclick", one that works on "click", and one that works on "mousemove".
This commit is contained in:
Éric Lemoine
2014-06-29 23:05:30 +02:00
parent ef1414c508
commit f8ba6758a2
2 changed files with 55 additions and 4 deletions

View File

@@ -33,7 +33,17 @@
<div class="span12">
<h4 id="title">Select features example</h4>
<p id="shortdesc">Example of using the Select interaction. Select features by clicking polygons. Hold the Shift-key to toggle the feature in the selection.</p>
<p id="shortdesc">Example of using the Select interaction. Choose between <code>Single-click</code>, <code>Click</code> and <code>Hover</code> as the event type for selection in the combobox below. When using <code>Single-click</code> or <code>Click</code> you can hold do <code>Shift</code> key to toggle the feature in the selection.</p>
<p>Note: when <code>Single-click</code> is used double-clicks won't select features. This in contrast to <code>Click</code>, where a double-click will both select the feature and zoom the map (because of the <code>DoubleClickZoom</code> interaction). Note that <code>Single-click</code> is less responsive than <code>Click</code> because of the delay it uses to detect double-clicks.</p>
<form class="form-inline">
<label>Action type &nbsp;</label>
<select id="type">
<option value="none" selected>None</option>
<option value="singleclick">Single-click</option>
<option value="click">Click</option>
<option value="mousemove">Hover</option>
</select>
</form>
<div id="docs">
<p>See the <a href="select-features.js" target="_blank">select-features.js source</a> to see how this is done.</p>
</div>