From de13706df9f6510c38c1b72b840004ff9b8b2040 Mon Sep 17 00:00:00 2001 From: Andreas Hocevar Date: Thu, 2 Apr 2015 18:01:16 +0200 Subject: [PATCH] Templetize examples starting with letter w --- examples_src/wkt.html | 63 ++++------------- examples_src/wms-capabilities.css | 4 ++ examples_src/wms-capabilities.html | 62 ++++------------- examples_src/wms-custom-proj.html | 63 ++++------------- examples_src/wms-image-custom-proj.html | 67 ++++-------------- examples_src/wms-image.html | 64 ++++------------- examples_src/wms-no-proj.html | 64 ++++------------- examples_src/wms-tiled-wrap-180.html | 62 ++++------------- examples_src/wms-tiled.html | 64 ++++------------- examples_src/wmts-capabilities.css | 4 ++ examples_src/wmts-capabilities.html | 62 ++++------------- examples_src/wmts-hidpi.css | 3 + examples_src/wmts-hidpi.html | 69 ++++--------------- .../wmts-layer-from-capabilities.html | 64 ++++------------- examples_src/wmts.html | 64 ++++------------- 15 files changed, 166 insertions(+), 613 deletions(-) create mode 100644 examples_src/wms-capabilities.css create mode 100644 examples_src/wmts-capabilities.css create mode 100644 examples_src/wmts-hidpi.css diff --git a/examples_src/wkt.html b/examples_src/wkt.html index a00a58f843..11bfc16f69 100644 --- a/examples_src/wkt.html +++ b/examples_src/wkt.html @@ -1,50 +1,13 @@ - - - - - - - - - - - WKT example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
-
-
-
-
- -
- -
-

WKT example

-

Example of using the WKT parser.

-
-

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

-
-
WKT Well Known Text
-
-
- -
- - - - - - - +--- +template: "example.html" +title: "WKT example" +shortdesc: "Example of using the WKT parser." +docs: > + Create features from geometries in WKT (Well Known Text) format. +tags: "wkt, well known text" +--- +
+
+
+
+
diff --git a/examples_src/wms-capabilities.css b/examples_src/wms-capabilities.css new file mode 100644 index 0000000000..78cbe01578 --- /dev/null +++ b/examples_src/wms-capabilities.css @@ -0,0 +1,4 @@ +.log-container { + height: 400px; + overflow: scroll; +} diff --git a/examples_src/wms-capabilities.html b/examples_src/wms-capabilities.html index c0c70a11f7..6bc4772fba 100644 --- a/examples_src/wms-capabilities.html +++ b/examples_src/wms-capabilities.html @@ -1,49 +1,13 @@ - - - - - - - - - - - WMS GetCapabilities parsing example - - - -
-
-
- OpenLayers 3 Examples -
-
-
- -
- -
- -
-

WMS GetCapabilities parsing example

-

Example of parsing a WMS GetCapabilities response.

-
-

See the wms-capabilities.js source to see how this is done.

-
-
wms, capabilities, getcapabilities
-
- -
- 

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMS GetCapabilities parsing example"
+shortdesc: "Example of parsing a WMS GetCapabilities response."
+docs: >
+  This example shows the contents of the result object from parsing a WMS capabilities response.
+tags: "wms, capabilities, getcapabilities"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wms-custom-proj.html b/examples_src/wms-custom-proj.html
index f87405a33e..72b00eebfb 100644
--- a/examples_src/wms-custom-proj.html
+++ b/examples_src/wms-custom-proj.html
@@ -1,50 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    Tiled WMS with custom projection example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
Tiled WMS with custom projection example

-          
Example of two tiled WMS layers (Pixelmap 1:1'000'000 and national parks) using the projection EPSG:21781.

-          

-            
See the wms-custom-proj.js source to see how this is done.

-          

-          
wms, tile, tilelayer, projection

-        

-
-      

-
-    

-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "Tiled WMS with custom projection example"
+shortdesc: "Example of using custom coordinate transform functions."
+docs: >
+  With `ol.proj.addCoordinateTransforms()`, custom coordinate transform functions can be added to configured projections.
+tags: "wms, tile, tilelayer, projection"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wms-image-custom-proj.html b/examples_src/wms-image-custom-proj.html
index 59af93e1a1..d7858ba8ab 100644
--- a/examples_src/wms-image-custom-proj.html
+++ b/examples_src/wms-image-custom-proj.html
@@ -1,54 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    Single image WMS with Proj4js projection example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
Single image WMS with Proj4js projection example

-          
Example of two single image WMS layers.

-          

-            
Pixelmap 1:1'000'000 with National Parks overlay using the projection EPSG:21781.

-            
See the wms-image-custom-proj.js source to see how this is done.

-          

-          
wms, single image, proj4js, projection

-        

-
-      

-
-    

-
-    
-    
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "Single image WMS with Proj4js projection example"
+shortdesc: "Example of integrating Proj4js for coordinate transforms."
+docs: >
+  With transparent [Proj4js](http://proj4js.org/) integration, OpenLayers can transform coordinates between arbitrary projections.
+tags: "wms, single image, proj4js, projection"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wms-image.html b/examples_src/wms-image.html
index d8a4a0adf3..0ae047a1bd 100644
--- a/examples_src/wms-image.html
+++ b/examples_src/wms-image.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    Single image WMS example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
Single image WMS example

-          
Example of a single image WMS layer.

-          

-            
See the wms-image.js source to see how this is done.

-          

-          
wms, image

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "Single image WMS example"
+shortdesc: "Example of a single image WMS layer."
+docs: >
+  WMS can be used as an Image layer, as shown here, or as a Tile layer, as shown in the [Tiled WMS example](wms-tiled.html) example. Tiles can be cached, so the browser will not re-fetch data for areas that were viewed already. But there may be problems with repeated labels for WMS servers that are not aware of tiles, in which case single image WMS will produce better cartography.
+tags: "wms, image"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wms-no-proj.html b/examples_src/wms-no-proj.html
index acd45d3e9b..9f9844df44 100644
--- a/examples_src/wms-no-proj.html
+++ b/examples_src/wms-no-proj.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    WMS without client projection example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
WMS without client projection example

-          
Example of two WMS layers using the projection EPSG:21781, which is unknown to the client.

-          

-            
See the wms-no-proj.js source to see how this is done.

-          

-          
wms, projection

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMS without client projection example"
+shortdesc: "Example of two WMS layers using the projection EPSG:21781, which is unknown to the client."
+docs: >
+  As long as no coordinate transformations are required, OpenLayers 3 works fine with projections that are only configured with a `code` and `units`.
+tags: "wms, projection"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wms-tiled-wrap-180.html b/examples_src/wms-tiled-wrap-180.html
index 01aeb64c69..cd24112994 100644
--- a/examples_src/wms-tiled-wrap-180.html
+++ b/examples_src/wms-tiled-wrap-180.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    Tiled WMS wrap 180° meridian example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

+---
+template: "example.html"
+title: "Tiled WMS wrap 180° meridian example"
+shortdesc: "Example of a tiled WMS layer that wraps across the 180° meridian."
+docs: >
+  The `wrapX` option is set to `true` here so tiles will be wrapped around the x-axis.
+tags: "wms, tile, dateline, wrap, 180"
+---
+  

+    

+      

     

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
Tiled WMS wrap 180° meridian example

-          
Example of a tiled WMS layer that wraps across the 180° meridian.

-          

-            
See the wms-tiled-wrap-180.js source to see how this is done.

-          

-          
wms, tile, dateline, wrap, 180

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+  

diff --git a/examples_src/wms-tiled.html b/examples_src/wms-tiled.html
index d16ccb70e5..7b48807d52 100644
--- a/examples_src/wms-tiled.html
+++ b/examples_src/wms-tiled.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    Tiled WMS example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
Tiled WMS example

-          
Example of a tiled WMS layer.

-          

-            
See the wms-tiled.js source to see how this is done.

-          

-          
wms, tile, tilelayer

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "Tiled WMS example"
+shortdesc: "Example of a tiled WMS layer."
+docs: >
+  WMS can be used as a Tile layer, as shown here, or as an Image layer, as shown in the [Single Image WMS example](wms-image.html) example. Tiles can be cached, so the browser will not re-fetch data for areas that were viewed already. But there may be problems with repeated labels for WMS servers that are not aware of tiles, in which case single image WMS will produce better cartography.
+tags: "wms, tile, tilelayer"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wmts-capabilities.css b/examples_src/wmts-capabilities.css
new file mode 100644
index 0000000000..78cbe01578
--- /dev/null
+++ b/examples_src/wmts-capabilities.css
@@ -0,0 +1,4 @@
+.log-container {
+  height: 400px;
+  overflow: scroll;
+}
diff --git a/examples_src/wmts-capabilities.html b/examples_src/wmts-capabilities.html
index 1a37d7784c..dd13f220f5 100644
--- a/examples_src/wmts-capabilities.html
+++ b/examples_src/wmts-capabilities.html
@@ -1,49 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    WMTS GetCapabilities parsing example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-
-        

-          
WMTS GetCapabilities parsing example

-          
Example of parsing a WMTS GetCapabilities response.

-          

-            
See the wmts-capabilities.js source to see how this is done.

-          

-          
wmts, capabilities, getcapabilities

-        

-
-        

-          

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMTS GetCapabilities parsing example"
+shortdesc: "Example of parsing a WMTS GetCapabilities response."
+docs: >
+  This example shows the contents of the result object from parsing a WMTS capabilities response.
+tags: "wmts, capabilities, getcapabilities"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wmts-hidpi.css b/examples_src/wmts-hidpi.css
new file mode 100644
index 0000000000..825625b824
--- /dev/null
+++ b/examples_src/wmts-hidpi.css
@@ -0,0 +1,3 @@
+.map {
+  background: white;
+}
diff --git a/examples_src/wmts-hidpi.html b/examples_src/wmts-hidpi.html
index 8deed62a4b..9677d896c5 100644
--- a/examples_src/wmts-hidpi.html
+++ b/examples_src/wmts-hidpi.html
@@ -1,56 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    WMTS HiDPI example
-    
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
WMTS HiDPI example

-          
Example of a WMTS based HiDPI layer.

-          

-            
See the wmts-hidpi.js source to see how this is done.

-          

-          
hidpi, retina, wmts

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMTS HiDPI example"
+shortdesc: "Example of a WMTS based HiDPI layer."
+docs: >
+  The WMTS source has a `tilePixelRatio` option. A HiDPI capable WMTS could provide tiles with 512x512 pixel tiles, but use them in a 256x256 pixel tile grid. In this case `tilePixelRatio` needs to be set to `2`.
+tags: "hidpi, retina, wmts"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wmts-layer-from-capabilities.html b/examples_src/wmts-layer-from-capabilities.html
index 4918488e4c..f1a57fd9ac 100644
--- a/examples_src/wmts-layer-from-capabilities.html
+++ b/examples_src/wmts-layer-from-capabilities.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    WMTS Layer example from capabilities 
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
WMTS Capabilities example

-          
Example of a WMTS source created from a WMTS capabilities document.

-          

-            
See the wmts-layer-from-capabilities.js source to see how this is done.

-          

-          
wmts, capabilities, getcapabilities

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMTS Layer from capabilities example"
+shortdesc: "Example of a WMTS source created from a WMTS capabilities document."
+docs: >
+  This example shows how to create the configuration for accessing a WMTS from a GetCapabilities response.. The [WMTS example](wmts.html) shows how to create the configuration manually.
+tags: "wmts, capabilities, getcapabilities"
+---
+

+  

+    

+  

+

diff --git a/examples_src/wmts.html b/examples_src/wmts.html
index 4b48f24f16..71fb109621 100644
--- a/examples_src/wmts.html
+++ b/examples_src/wmts.html
@@ -1,51 +1,13 @@
-
-
-  
-    
-    
-    
-    
-    
-    
-    
-    WMTS example
-  
-  
-
-    

-      

-        

-           OpenLayers 3 Examples
-        

-      

-    

-
-    

-
-      

-        

-          

-        

-      

-
-      

-
-        

-          
WMTS example

-          
Example of a WMTS source.

-          

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

-          

-          
wmts

-        

-
-      

-
-    

-
-    
-    
-    
-
-  
-
+---
+template: "example.html"
+title: "WMTS example"
+shortdesc: "Example of a WMTS source."
+docs: >
+  This example shows how to manually create the configuration for accessing a WMTS. The [WMTS Layer from capabilities example](wmts-layer-from-capabilities.html) shows how to create the configuration from a GetCapabilities response.
+tags: "wmts"
+---
+

+  

+    

+  

+