From 5b57c7d4b85013375d22ea0317d1e36c8a6c9f34 Mon Sep 17 00:00:00 2001 From: Bart van den Eijnden Date: Thu, 2 Apr 2015 18:34:56 +0200 Subject: [PATCH] Port over the measure, min-max-resolution, modify-features, modify-test, mouse-position and moveend examples --- examples_src/measure.css | 32 +++++++ examples_src/measure.html | 119 +++++---------------------- examples_src/min-max-resolution.html | 75 ++++------------- examples_src/modify-features.html | 67 ++++----------- examples_src/modify-test.css | 3 + examples_src/modify-test.html | 70 +++------------- examples_src/mouse-position.html | 84 ++++++------------- examples_src/moveend.html | 71 ++++------------ 8 files changed, 140 insertions(+), 381 deletions(-) create mode 100644 examples_src/measure.css create mode 100644 examples_src/modify-test.css diff --git a/examples_src/measure.css b/examples_src/measure.css new file mode 100644 index 0000000000..9d0a6a317f --- /dev/null +++ b/examples_src/measure.css @@ -0,0 +1,32 @@ +.tooltip { + position: relative; + background: rgba(0, 0, 0, 0.5); + border-radius: 4px; + color: white; + padding: 4px 8px; + opacity: 0.7; + white-space: nowrap; +} +.tooltip-measure { + opacity: 1; + font-weight: bold; +} +.tooltip-static { + background-color: #ffcc33; + color: black; + border: 1px solid white; +} +.tooltip-measure:before, +.tooltip-static:before { + border-top: 6px solid rgba(0, 0, 0, 0.5); + border-right: 6px solid transparent; + border-left: 6px solid transparent; + content: ""; + position: absolute; + bottom: -6px; + margin-left: -7px; + left: 50%; +} +.tooltip-static:before { + border-top-color: #ffcc33; +} \ No newline at end of file diff --git a/examples_src/measure.html b/examples_src/measure.html index 0341173c75..d4e665967a 100644 --- a/examples_src/measure.html +++ b/examples_src/measure.html @@ -1,98 +1,21 @@ - - - - - - - - - - - Measure example - - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
- -
-

Measure example

-

Example of using the - ol.interaction.Draw interaction for creating simple - measuring application.

-
- - - -
- -
-

NOTE: If use geodesic measures is not checked, measure is done in simple way on projected plane. Earth - curvature is not taken into account

-

See the measure.js source to see how this is done.

-
-
draw, edit, measure, vector
-
- -
- -
- - - - - - - +--- +template: "example.html" +title: "Measure example" +shortdesc: "Example of using the ol.interaction.Draw interaction for creating simple measuring application." +docs: > +

NOTE: If use geodesic measures is not checked, measure is done in simple way on projected plane. Earth curvature is not taken into account

+tags: "draw, edit, measure, vector" +--- +
+
+
+
+
+
+ + + +
\ No newline at end of file diff --git a/examples_src/min-max-resolution.html b/examples_src/min-max-resolution.html index 0f79406311..42d8ea4c66 100644 --- a/examples_src/min-max-resolution.html +++ b/examples_src/min-max-resolution.html @@ -1,60 +1,15 @@ - - - - - - - - - - - Min/max resolution example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
- -
-

Min/max resolution example

-

Show/hide layers depending on current view resolution.

-
-

- Zoom in twice: the MapBox layer should hide whereas the OSM layer should be shown. -

-

- If you continue to zoom in, you'll see the OSM layer also disappear. -

-

- The rendering of the layers are here controlled using minResolution and maxResolution options. -

-

See the min-max-resolution.js source to see how this is done.

-
-
minResolution, maxResolution, resolution
-
- -
- -
- - - - - - - +--- +template: "example.html" +title: "Min/max resolution example" +shortdesc: "Show/hide layers depending on current view resolution." +docs: > +

Zoom in twice: the MapBox layer should hide whereas the OSM layer should be shown.

+

If you continue to zoom in, you'll see the OSM layer also disappear.

+

The rendering of the layers are here controlled using minResolution and maxResolution options.

+tags: "minResolution, maxResolution, resolution" +--- +
+
+
+
+
diff --git a/examples_src/modify-features.html b/examples_src/modify-features.html index 1a569054d8..b2f5687374 100644 --- a/examples_src/modify-features.html +++ b/examples_src/modify-features.html @@ -1,53 +1,14 @@ - - - - - - - - - - - - Modify features example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
- -
-

Modify features example

-

Editing features with the modify interaction.

-
-

This example demonstrates how the modify and select interactions can be used together. Zoom in to an area of interest and select a feature for editing. Then drag points around to modify the feature. You can preserve topology by selecting multiple features before editing (Shift+click to select multiple features).

-

See the modify-features.js source to see how this is done.

-
-
modify, edit, vector
-
- -
- -
- - - - - - - +--- +template: "example.html" +title: "Modify features example" +shortdesc: "Editing features with the modify interaction." +docs: > +

This example demonstrates how the modify and select interactions can be used together. Zoom in to an area of interest and select a feature for editing. + Then drag points around to modify the feature. You can preserve topology by selecting multiple features before editing (Shift+click to select multiple features).

+tags: "modify, edit, vector" +--- +
+
+
+
+
diff --git a/examples_src/modify-test.css b/examples_src/modify-test.css new file mode 100644 index 0000000000..f9028c9f45 --- /dev/null +++ b/examples_src/modify-test.css @@ -0,0 +1,3 @@ +.map { + background: grey; +} diff --git a/examples_src/modify-test.html b/examples_src/modify-test.html index c4b3b61012..db700fd411 100644 --- a/examples_src/modify-test.html +++ b/examples_src/modify-test.html @@ -1,57 +1,13 @@ - - - - - - - - - - - - Modify features test - - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
- -
-

Modify features test

-

Example for testing feature modification.

-
-

See the modify-test.js source to see how this is done.

-
-
modify, edit, vector
-
- -
- -
- - - - - - - +--- +template: "example.html" +title: "Modify features test" +shortdesc: "Example for testing feature modification." +docs: > + Example for testing feature modification. +tags: "modify, edit, vector" +--- +
+
+
+
+
diff --git a/examples_src/mouse-position.html b/examples_src/mouse-position.html index de9b13e996..ec3da34342 100644 --- a/examples_src/mouse-position.html +++ b/examples_src/mouse-position.html @@ -1,59 +1,25 @@ - - - - - - - - - - - Mouse position example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
-
-

Mouse position example

-

Example of a mouse position control, outside the map.

-
-

See the mouse-position.js source to see how this is done.

-
-
mouse-position, openstreetmap
-
- - - - -
-
-
 
-
- -
- - - - - - - +--- +template: "example.html" +title: "Mouse position example" +shortdesc: "Example of a mouse position control, outside the map." +docs: > + Example of a mouse position control, outside the map. +tags: "mouse-position, openstreetmap" +--- +
+
+
+
+
+
+
+ + + + +
+
+
 
\ No newline at end of file diff --git a/examples_src/moveend.html b/examples_src/moveend.html index f88b248974..0010925bf1 100644 --- a/examples_src/moveend.html +++ b/examples_src/moveend.html @@ -1,54 +1,17 @@ - - - - - - - - - - - Moveend Example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
-
-
-
-
-
- -
-
-

Move end example

-

Use of the moveend event.

-
-

In this example, a listener is registered for the map's moveend event. Whenever this listener is called, it updates the inputs below with the map extent in decimal degrees.

-

See the moveend.js source for details on how this is done.

-
-
moveend, map, event
- - - - -
- -
- -
- - - - - - - +--- +template: "example.html" +title: "Moveend Example" +shortdesc: "Use of the moveend event." +docs: > +

In this example, a listener is registered for the map's moveend event. Whenever this listener is called, it updates the inputs below with the map extent in decimal degrees.

+tags: "moveend, map, event" +--- +
+
+
+
+
+ + + +