ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Convert F-G examples to strapless template

Browse Source
This commit is contained in:
Tim Schaub
2015-11-14 16:33:58 -07:00
parent 2e8f4806d2
commit 88ec3b9f6c
13 changed files with 67 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
examples/feature-animation.html
View File

@@ -1,6 +1,6 @@
---
layout: example.html
title: Feature animation example
layout: strapless.html
title: Custom Animation
shortdesc: Demonstrates how to animate features.
docs: >
This example shows how to use <b>postcompose</b> and <b>vectorContext</b> to
@@ -8,8 +8,4 @@ docs: >
is added to the layer.
tags: "animation, vector, feature, flash"
---
<div class="row">
<div class="span8">
<div id="map" class="map"></div>
</div>
</div>

12
examples/feature-move-animation.html
View File

@@ -1,6 +1,6 @@
---
layout: example.html
title: Animate a feature movement
layout: strapless.html
title: Marker Animation
shortdesc: Demonstrates how to move a feature along a line.
docs: >
This example shows how to use <b>postcompose</b> and <b>vectorContext</b> to
@@ -8,17 +8,9 @@ docs: >
is being used.
tags: "animation, feature, postcompose, polyline"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div class="row-fluid">
<div class="span12">
<label for="speed">
speed:&nbsp;
<input id="speed" type="range" min="10" max="999" step="10" value="60">
</label>
<button id="start-animation">Start Animation</button>
</div>
</div>

10
examples/fractal.html
View File

@@ -1,18 +1,14 @@
---
layout: example.html
title: Fractal Example
layout: strapless.html
title: Fractal Rendering
shortdesc: Example of a fractal.
docs: >
Example of a fractal.
This example demonstrates how features with many vertices can be efficiently rendered.
tags: "fractal, vector"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
<label for="depth">
depth:&nbsp;
<input id="depth" type="range" min="0" max="9" step="1" value="5">
&nbsp;(<span id="count">#</span> points)
</label>
</div>
</div>

8
examples/full-screen-drag-rotate-and-zoom.html
View File

@@ -1,6 +1,6 @@
---
layout: example.html
title: Full screen drag rotate and zoom example
layout: strapless.html
title: Full Screen Drag, Rotate, and Zoom
shortdesc: Example of drag rotate and zoom control with full screen effect.
docs: >
<p>Hold down <code>Shift</code> + drag to rotate and zoom. Click the button in the top right corner to go full screen. Then do the <code>Shift</code> + drag thing again.</p>
@@ -9,8 +9,4 @@ tags: "full-screen, drag, rotate, zoom, bing, bing-maps"
cloak:
Ak-dzM4wZjSqTlzveKz5u0d4IQ4bRzVI309GxmkgSVr1ewS6iPSrOvOKhA-CJlm3: Your Bing Maps Key from http://bingmapsportal.com/ here
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>

8
examples/full-screen.html
View File

@@ -1,6 +1,6 @@
---
layout: example.html
title: Full screen control example
layout: strapless.html
title: Full Screen Control
shortdesc: Example of a full screen control.
docs: >
<p>Click the control in the top right corner to go full screen. Click it again to exit full screen.</p>
@@ -9,8 +9,4 @@ tags: "full-screen, bing, bing-maps"
cloak:
Ak-dzM4wZjSqTlzveKz5u0d4IQ4bRzVI309GxmkgSVr1ewS6iPSrOvOKhA-CJlm3: Your Bing Maps Key from http://bingmapsportal.com/ here
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>

8
examples/geojson.html
View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: GeoJSON example
layout: strapless.html
title: GeoJSON
shortdesc: Example of GeoJSON features.
docs: >
Example of GeoJSON features.
tags: "geojson, vector, openstreetmap"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>

33
examples/geolocation.html
View File

@@ -1,24 +1,21 @@
---
layout: example.html
title: Geolocation example
shortdesc: Example of a geolocation map.
layout: strapless.html
title: Geolocation
shortdesc: Using geolocation to control a map view.
docs: >
Example of a geolocation map.
This example uses the Geolocation API to control the view.
tags: "geolocation, openstreetmap"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
<div class="span4 pull-right">
<div id="info" class="alert alert-danger" style="display: none;"></div>
</div>
<label class="checkbox" for="track">
<input id="track" type="checkbox"/>track position
<div id="info" style="display: none;"></div>
<label for="track">
track position
<input id="track" type="checkbox"/>
</label>
<p>position accuracy : <code id="accuracy"></code></p>
<p>altitude : <code id="altitude"></code></p>
<p>altitude accuracy : <code id="altitudeAccuracy"></code></p>
<p>heading : <code id="heading"></code></p>
<p>speed : <code id="speed"></code></p>
</div>
</div>
<p>
position accuracy : <code id="accuracy"></code>&nbsp;&nbsp;
altitude : <code id="altitude"></code>&nbsp;&nbsp;
altitude accuracy : <code id="altitudeAccuracy"></code>&nbsp;&nbsp;
heading : <code id="heading"></code>&nbsp;&nbsp;
speed : <code id="speed"></code>
</p>

20
examples/getfeatureinfo-image.html
View File

@@ -1,20 +1,10 @@
---
layout: example.html
title: GetFeatureInfo example (image layer)
shortdesc: This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS image layer.
layout: strapless.html
title: WMS GetFeatureInfo (Image Layer)
shortdesc: Using an image WMS source with GetFeatureInfo requests
docs: >
<p>Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse pointer when hovering a non-transparent pixel on the map.</p>
This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS image layer. Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse pointer when hovering a non-transparent pixel on the map.
tags: "getfeatureinfo, forEachLayerAtPixel"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div class="row-fluid">
<div class="span4 offset4 iframe-info">
<div id="info" class="alert alert-success">
&nbsp;
</div>
</div>
</div>
<div id="info">&nbsp;</div>

2
examples/getfeatureinfo-image.js
View File

@@ -8,7 +8,7 @@ var wmsSource = new ol.source.ImageWMS({
url: 'http://demo.boundlessgeo.com/geoserver/wms',
params: {'LAYERS': 'ne:ne'},
serverType: 'geoserver',
crossOrigin: ''
crossOrigin: 'anonymous'
});
var wmsLayer = new ol.layer.Image({

20
examples/getfeatureinfo-tile.html
View File

@@ -1,20 +1,10 @@
---
layout: example.html
title: WMS GetFeatureInfo example (tile layer)
shortdesc: This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS tile layer.
layout: strapless.html
title: WMS GetFeatureInfo (Tile Layer)
shortdesc: Issuing GetFeatureInfo requests with a WMS tiled source
docs: >
<p>Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse pointer when hovering a non-transparent pixel on the map.</p>
This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS tile layer. Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse pointer when hovering a non-transparent pixel on the map.
tags: "getfeatureinfo, forEachLayerAtPixel"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>
<div class="row-fluid">
<div class="span4 offset4 iframe-info">
<div id="info" class="alert alert-success">
&nbsp;
</div>
</div>
</div>
<div id="info">&nbsp;</div>

2
examples/getfeatureinfo-tile.js
View File

@@ -8,7 +8,7 @@ var wmsSource = new ol.source.TileWMS({
url: 'http://demo.boundlessgeo.com/geoserver/wms',
params: {'LAYERS': 'ne:ne'},
serverType: 'geoserver',
crossOrigin: ''
crossOrigin: 'anonymous'
});
var wmsLayer = new ol.layer.Tile({

14
examples/gpx.html
View File

@@ -1,6 +1,6 @@
---
layout: example.html
title: GPX example
layout: strapless.html
title: GPX Data
shortdesc: Example of using the GPX source.
docs: >
Example of using the GPX source.
@@ -8,13 +8,5 @@ tags: "GPX"
cloak:
Ak-dzM4wZjSqTlzveKz5u0d4IQ4bRzVI309GxmkgSVr1ewS6iPSrOvOKhA-CJlm3: Your Bing Maps Key from http://bingmapsportal.com/ here
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
<div class="span4 offset4 pull-right">
<div id="info" class="alert alert-success">
&nbsp;
</div>
</div>
</div>
</div>
<div id="info">&nbsp;</div>

8
examples/graticule.html
View File

@@ -1,13 +1,9 @@
---
layout: example.html
title: Graticule example
layout: strapless.html
title: Map Graticule
shortdesc: This example shows how to add a graticule overlay to a map.
docs: >
This example shows how to add a graticule overlay to a map.
tags: "graticule"
---
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>