Graeme Yeates
00474dc038
For some reason the circle polygon type was not available in the select despite the example code handling drawing circles.
27 lines
1.1 KiB
HTML
27 lines
1.1 KiB
HTML
---
|
|
layout: example.html
|
|
title: Draw Shapes
|
|
shortdesc: Using the ol/interaction/Draw to create regular shapes
|
|
docs: >
|
|
This demonstrates the use of the `geometryFunction` option for the
|
|
`ol/interaction/Draw`. Select a shape type from the dropdown above to start
|
|
drawing. To activate freehand drawing, hold the `Shift` key. Square drawing is
|
|
achieved by using `type: 'Circle'` type with a `geometryFunction` that creates
|
|
a 4-sided regular polygon instead of a circle. Box drawing uses `type: 'Circle'`
|
|
with a `geometryFunction` that creates a box-shaped polygon instead of a
|
|
circle. Star drawing uses a custom geometry function that coverts a circle
|
|
into a start using the center and radius provided by the draw interaction.
|
|
tags: "draw, edit, freehand, vector"
|
|
---
|
|
<div id="map" class="map"></div>
|
|
<form class="form-inline">
|
|
<label>Shape type </label>
|
|
<select id="type">
|
|
<option value="Circle">Circle</option>
|
|
<option value="Square">Square</option>
|
|
<option value="Box">Box</option>
|
|
<option value="Star">Star</option>
|
|
<option value="None">None</option>
|
|
</select>
|
|
</form>
|