mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-07 02:26:19 +00:00
dbabdfce53
* Make the layers control visible which allows the base layer to be chosen, and individual overlay layers to be hidden * Add tiddlers tagged $:/tags/GeoBaseLayer to define some useful map base layers * Add geobaselayer widget to define base layers
108 lines
2.4 KiB
Plaintext
108 lines
2.4 KiB
Plaintext
title: $:/plugins/tiddlywiki/geospatial/docs/geomap
|
|
caption: geomap widget
|
|
tags: $:/tags/GeospatialDocs
|
|
|
|
!! `<$geomap>` widget
|
|
|
|
The `<$geomap>` widget displays an interactive map using [[Leaflet.js|https://leafletjs.com/]]. `<$geolayer>` widgets inside the `<$geomap>` widget are used to indicate the layers and markers to display.
|
|
|
|
The following attributes are supported:
|
|
|
|
|!Attribute |!Description |
|
|
|''state'' |The title of a state tiddler used to track the state of the map in the `zoom`, `long` and `lat` fields |
|
|
|
|
!! Examples
|
|
|
|
<$testcase>
|
|
<$data
|
|
title="Description"
|
|
text="Map with state preservation"
|
|
/>
|
|
<$data
|
|
title="Output"
|
|
text="""<$geomap
|
|
state=<<qualify "$:/state/demo-map">>
|
|
/>
|
|
"""/>
|
|
<$data $tiddler="$:/plugins/tiddlywiki/geospatial"/>
|
|
</$testcase>
|
|
|
|
<$testcase>
|
|
<$data
|
|
title="Description"
|
|
text="Map with geomarker"
|
|
/>
|
|
<$data
|
|
title="Oxford"
|
|
tags="$:/tags/GeoMarker"
|
|
caption="Oxford"
|
|
lat="51.751944"
|
|
long="-1.257778"
|
|
alt="0"
|
|
text="""This is Oxford!"""/>
|
|
<$data title="Output" text="""<$geomap
|
|
state=<<qualify "$:/state/demo-map">>
|
|
>
|
|
<$list filter="[all[tiddlers+shadows]tag[$:/tags/GeoMarker]]">
|
|
<$geolayer lat={{!!lat}} long={{!!long}} alt={{!!alt}} color={{!!color}}/>
|
|
</$list>
|
|
</$geomap>
|
|
"""/>
|
|
<$data $tiddler="$:/plugins/tiddlywiki/geospatial"/>
|
|
</$testcase>
|
|
|
|
<$testcase>
|
|
<$data
|
|
title="Description"
|
|
text="Map with geofeature"
|
|
/>
|
|
<$data
|
|
title="Layer"
|
|
tags="$:/tags/GeoFeature"
|
|
type="application/json"
|
|
color="red"
|
|
text="""{
|
|
"type": "FeatureCollection",
|
|
"features": [
|
|
{
|
|
"type": "Feature",
|
|
"id": "An example geofeature feature",
|
|
"properties": {
|
|
"custom": "A custom property of this feature"
|
|
},
|
|
"geometry": {
|
|
"type": "Polygon",
|
|
"coordinates": [
|
|
[
|
|
[-90,35],
|
|
[-90,30],
|
|
[-85,30],
|
|
[-85,35],
|
|
[-90,35]
|
|
]
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}"""/>
|
|
<$data title="Output" text="""<$geomap
|
|
state=<<qualify "$:/state/demo-map">>
|
|
>
|
|
<$list filter="[all[tiddlers+shadows]tag[$:/tags/GeoFeature]]">
|
|
<$geolayer json={{!!text}} color={{!!color}}/>
|
|
</$list>
|
|
</$geomap>
|
|
"""/>
|
|
<$data $tiddler="$:/plugins/tiddlywiki/geospatial"/>
|
|
</$testcase>
|
|
|
|
<$testcase>
|
|
<$data $compound-tiddler="$:/plugins/tiddlywiki/geospatial/tests/widgets/geomap"/>
|
|
<$data $tiddler="$:/plugins/tiddlywiki/geospatial"/>
|
|
</$testcase>
|
|
|
|
<$testcase>
|
|
<$data $compound-tiddler="$:/plugins/tiddlywiki/geospatial/tests/widgets/geomap-refresh"/>
|
|
<$data $tiddler="$:/plugins/tiddlywiki/geospatial"/>
|
|
</$testcase>
|