URL Mapping - Geomap
Execute pre-configured geomap filtering based on url query string.
- Area of interest: British Columbia
?aoi=bc
- Area of interest: Alberta
?aoi=ab
- Area of interest: Québec
?aoi=qc
- Area of interest: Canada
?aoi=canada
- Layout: KML
?layout=kml
- Layout: TopoJSON (World 110m)
?layout=topo
- All layout
?layout=all
- Layout: Point
?layout=pt
- Combination - Layout: KML ; Area of interest: British Columbia
?layout=kml&aoi=bc
- Combination - Layout: Point ; Area of interest: Québec
?aoi=qc&layout=pt
- Combination - All layout ; Area of interest: British Columbia
?aoi=bc&layout=all
- Empty
?
Legend
Source code
HTML
<ul>
<li><a href="?aoi=bc">Area of interest: British Columbia <code>?aoi=bc</code></a></li>
<li><a href="?aoi=ab">Area of interest: Alberta <code>?aoi=ab</code></a></li>
<li><a href="?aoi=qc">Area of interest: Québec <code>?aoi=qc</code></a></li>
<li><a href="?aoi=canada">Area of interest: Canada <code>?aoi=canada</code></a></li>
<li><a href-"?layout=kml">Layout: KML <code>?layout=kml</code></a></li>
<li><a href-"?layout=topo">Layout: TopoJSON (World 110m) <code>?layout=topo</code></a></li>
<li><a href-"?layout=all">All layout <code>?layout=all</code></a></li>
<li><a href-"?layout=pt">Layout: Point <code>?layout=pt</code></a></li>
<li><a href="?layout=kml&aoi=bc">Combination - Layout: KML ; Area of interest: British Columbia <code>?layout=kml&aoi=bc</code></a></li>
<li><a href="?aoi=qc&layout=pt">Combination - Layout: Point ; Area of interest: Québec <code>?aoi=qc&layout=pt</code></a></li>
<li><a href="?aoi=bc&layout=all">Combination - All layout ; Area of interest: British Columbia <code>?aoi=bc&layout=all</code></a></li>
<li><a href="?">Empty <code>?</code></a></li>
</ul>
<!-- +++ Note: +++
* The dimension bellow are approximative for this demo purpose only
* The optional configuration ```multiplequery``` is set in order to do a combination of query parameter
-->
<div data-wb-urlmapping='{
"multiplequery": true,
"aoi=canada": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "aoi", "value": "64.097 -10.63 34.692 -177.659" },
"aoi=bc": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "aoi", "value": "60 -120 48 -139" },
"aoi=ab": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "aoi", "value": "60 -110 49 -120" },
"aoi=qc": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "aoi", "value": "POLYGON((-78.30545265676142 62.84207638792185,-79.79959328176142 51.57292655739278,-79.18435890676142 46.810536399556135,-76.45974953176142 45.655468008018055,-75.58084328176142 45.961790800827984,-74.87771828176142 45.47086564114406,-74.96560890676142 44.97562684884711,-71.44998390676142 44.97562684884711,-69.16482765676142 47.349194267123444,-68.19803078176142 47.349194267123444,-64.33084328176142 48.35181916125691,-55.80545265676142 52.00783331541157,-67.31912453176142 52.16984334247954,-64.24295265676142 60.85236662687351,-78.30545265676142 62.84207638792185))" },
"layout=pt": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "layer", "value": "Points" },
"layout=kml": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "layer", "value": "KML" },
"layout=topo": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "layer", "value": "TopoJSON (World 110m)" },
"layout=all": { "action": "mapfilter", "source": "#sample_map_filter", "filter": "layer", "value": "" }
}'></div>
<div id="sample_map_filter"
class="wb-geomap position scaleline geocoder geolocation"
data-wb-geomap='{ [...] }'>
[...]
</div>
Page details
- Date modified: