Convert WMS examples to strapless template

This commit is contained in:
Tim Schaub
2015-11-17 09:56:33 -07:00
parent 9a35c08300
commit a94a00de1d
9 changed files with 31 additions and 61 deletions

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: WMS GetCapabilities parsing example
layout: strapless.html
title: WMS Capabilities Parsing
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"
---
<div class="row-fluid">
<div class="span12">
<pre class="log-container"><code id="log"></code></pre>
</div>
</div>
<pre class="log-container"><code id="log"></code></pre>

View File

@@ -2,7 +2,9 @@ goog.require('ol.format.WMSCapabilities');
var parser = new ol.format.WMSCapabilities();
$.ajax('data/ogcsample.xml').then(function(response) {
var result = parser.read(response);
$('#log').html(window.JSON.stringify(result, null, 2));
fetch('data/ogcsample.xml').then(function(response) {
return response.text();
}).then(function(text) {
var result = parser.read(text);
document.getElementById('log').innerText = JSON.stringify(result, null, 2);
});

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: Tiled WMS with custom projection example
layout: strapless.html
title: Custom Tiled WMS
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"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: WMS custom tile grid 512x256 example
layout: strapless.html
title: WMS 512x256 Tiles
shortdesc: Example of a WMS layer with 512x256px tiles.
docs: >
WMS can serve arbitrary tile sizes. This example uses a custom tile grid with non-square tiles.
tags: "wms, tile, non-square"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,16 +1,12 @@
---
layout: example.html
title: Single image WMS with Proj4js projection example
layout: strapless.html
title: Single Image WMS with Proj4js
shortdesc: Example of integrating Proj4js for coordinate transforms.
docs: >
With transparent [Proj4js](http://proj4js.org/) integration, OpenLayers can transform coordinates between arbitrary projections.
With [Proj4js](http://proj4js.org/) integration, OpenLayers can transform coordinates between arbitrary projections.
tags: "wms, single image, proj4js, projection"
resources:
- http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js
- http://epsg.io/21781-1753.js
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: Single image WMS example
layout: strapless.html
title: Single Image WMS
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"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: WMS without client projection example
layout: strapless.html
title: WMS without Projection
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"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: Tiled WMS wrap 180° meridian example
layout: strapless.html
title: Tiled WMS Wrapping
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.
By default, WMS tiles are reused across the 180° meridian. The can be disabled by setting the `wrapX` option to `false`.
tags: "wms, tile, dateline, wrap, 180"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>

View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: Tiled WMS example
layout: strapless.html
title: Tiled WMS
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"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div id="map" class="map"></div>