This page describes how to download, install and configure the module
Unzip the file to /config/modules/thirdparty/septima
Add the module to modules_xxx.xml:
<module name="widget" dir="thirdparty/septima/widget" permissionlevel="public"/>
Since the site doesn't knows its own name on startup it is necessary to add this parameter to the parameterfile:
<param name="module.widget.url">https://webkort.kommune.dk</param>
Copy the file
/config/modules/thirdparty/septima/widget/lib/custom-dk.septima.spatialsuite.widget-XX.jar
to WEB-INF/lib and restart the tomcat. Use the .jar file, that matches the Spatial
Suite version.
When using the administration page, you can limit the access by adding a custom token to your site. This is done by adding this parameter:
<param name="module.widget.token">YOUR_TOKEN</param>
Now you are up and running. To startup the admin page for widget, go to a page
called widget:
https://webkort.kommune.dk/spatialmap?page=widget&token=YOUR_TOKEN
A widget configuration is related to a specific profile. The default profile is used if not specified in the URL. If you want to use a different profile, just add the profile to the URL like this:
https://webkort.kommune.dk/spatialmap?page=widget&token=YOUR_TOKEN&profile=widgetprofile
The page contains more than just admin elements. It also contains some text that can be a bit annoying when often used. To remove the trivial text just add mode=simple like this:
https://webkort.kommune.dk/spatialmap?page=widget&token=YOUR_TOKEN&mode=simple
A widget can have "layers", "extents" and "controls". The basic layers like background layers are defined i a profile in Spatial Suite. If the "widget" page is called without a profile parameter, the layers from the default profile is used.
Vector layers, their style and "extents" are defined in a specific configuration file.
Add a parameter that defines the path to the configuraion file:
<param name="module.widget.config.dir">[cbinfo.misc.dir]/custom/widgetconfig/</param>
Make a copy of the configuration file widgetconfig.xml from the module
config folder and put it into /WEB-INF/config/misc/custom/widgetconfig.
The configuration file consists of three elements; services, featurestyles
and views. Each element is described here:
A list of datasources that are rendered as vector features in the browser.
The configuraion for each service can have these attributes:
| Name | Required | Default | Description |
|---|---|---|---|
| name | yes | The name of the service. | |
| datasource | yes | The name of the datasource this configuration referes to. | |
| title | yes | The text that is visible in the list to select from. | |
| description | no | The subtitle in the list. | |
| geometrytype | yes | The type of the geometry this datasource returns. Possible values are:
Point, Line or Polygon. It is important that the
type is written with a capital first letter!
|
|
| presentation | no | A full path to a presentation file. If only the filename is added, then the presentation file is expected to be placed in a folder called "presentations" beside the configuration file. Read more on how to use a presentation file in a widget here. | |
| theme | no | The name of theme that can be related to this service. This can be used together with a featurestyle. | |
| hidden | no | false | Deactivate the service by adding hidden="true". Then this service isn't available in the administration. |
A list of styles that can be selected for a vector service in the administration page.
The configuraion for each featurestyle can have these attributes:
| Name | Required | Default | Description |
|---|---|---|---|
| name | yes | The name of the style. | |
| title | yes | The text that is visible in the list to select from. | |
| description | no | The subtitle in the list. | |
| default | yes | false | Set if the style is the default selected for the services. It is important that one and only one featurestyle is set to default="true". |
| usetheme | no | false | Set if this style should be used with a theme from the service. Set usetheme="true" if this style should be used with a theme for rendering. |
| geometrytypes | no |
A list (seperated by ,) of geometry types that can use this style. If the value is empty or not given, the style will be available to all the vector layers. It could look like this: geometrytypes="Point,Line,Polygon"
|
On each featurestyle you can add a <property> node that has a name attribute and
node value. These property names are available:
| Name | Description |
|---|---|
| strokecolor | The color of the outline (only for line and polygon types). |
| strokewidth | The color of the outline (only for line and polygon types). |
| strokeopacity | The opacity of the outline (only for line and polygon types). |
| fillcolor | The fill color (only for polygon types) |
| fillopacity | The fill opacity (only for polygon types). |
| icon | A URL for an icon to display points in the map (only for point types). |
| xOffset |
An icon is placed with the lower left corner in the point coordinate. If the icon is a pin, then you want to shift the icon to make the tip of the pin in the point coordinate. To do this you can add xOffset to shift the icon left to right acording to the lower left corner of the icon. Use a positive number to shift right. The |
| yOffset |
An icon is placed with the lower left corner in the point coordinate. If the icon is a pin, then you want to shift the icon to make the tip of the pin in the point coordinate. To do this you can add yOffset to shift the icon up or down acording to the lower left corner of the icon. Use a positive number to shift up. The |
| symbol | A vector symbol for points that can be used instead of an icon. Available symbols are:
circle, square, triangle, star,
cross og x.
|
| rotation | When using a symbol or icon. The rotation of a symbol or icon. |
| radius | When using a symbol. The radius of the symbol. |
| radius2 | When using a symbol (star or cross). Second radius of the
symbol. |
If you want to give the administrator a specific list of styles to use for specific controls instead
of all the styles from Featurestyles, you can add
<controlsfeaturestyles> to the configuration. Controlsfeaturestyles is configured
just like Featurestyles but only available for the
controls. If no Controlsfeaturestyles is added, all the styles from Featurestyles is listed.
The configuraion for each featurestyle can have the same attributes as Featurestyles with one addition:
| Name | Required | Default | Description |
|---|---|---|---|
| controls | no |
A list (seperated by ,) of controls that should use this style. See Functions for a list of available controls. If the value is empty or not given, the style will be available to all controls that uses styles. It could look like this: controls="Search,Location"
|
A list of views/extents that can be selected in the administration page. A view defines the initial center point and zoomlevel of the map.
The configuraion for each view can have these attributes:
| Name | Required | Default | Description |
|---|---|---|---|
| name | yes | The name of the view. | |
| title | yes | The text that is visible in the list to select from. | |
| description | no | The subtitle in the list. | |
| default | yes | false | Set if the view is the default selected for the services. It is important that one and only one view is set to default="true". |
| x | yes | The "x" coordinate of the centerpoint for the view | |
| y | yes | The "y" coordinate of the centerpoint for the view | |
| zoomlevel | yes | The zoomlevel for the view |
If no presentation is added to a service, default templates are added automaticly. If you add a presentation you are able to control de default templates. You can add a heading. You can add hyperlinks. You can control which columns are displayed. You can add additional text for labeling. You can add images. And much more...
To specify the heading use this (if no heading is defined the first column is used as heading):
<column format='heading'>
<label>'navn'</label>
<value>navn</value>
</column>
To add a hyperlink:
<column format="hyperlink">
<label>'hjemmeside'</label>
<value>linkkolonne</value>
</column>
The use of <condition> is not allowed in a presentation! But the condition can be added to the <value> itself like this:
<column format='heading'>
<label>'navn'</label>
<value>if not(isnull(navn)) then navn else '' endif</value>
</column>
Septima Widget is highly customizeable reagarding functionality. As default the module consist of these standard functions: Info, Search, Overlay, Fullscreen, Directlink, Location and Locate. If you have access to other functions, please contact Septima for more info.
To add other functions to the list of avalable functions you can add this parameter containing a list of the additional function names seperated by ,:
<param name="module.widget.addcontrols">Table,Layerswitch,FUNCTIONNAME,</param>
These functions are available, but you need additional license for some of them:
| Name | Package | Description |
|---|---|---|
| Info | basis | Info on vector layeres. It is possible to have info on click or on hover. The information can be showed as a fixed box or a floating box relative to the feature in the map. |
| Search | basis | Search in addresses or any datasources that are searchable by Septima Search module
(module required) and zoom to the address in the map. When using the search control you
can limit the address search to a specific area. This is described in SmartAdresse. To use a specific
area you can add this parameter:<param name="module.widget.control.search.area">muncode0265</param> |
| Location | basis | Zoom to the location of the user (require accept from the user). |
| Directlink | basis | If the feature has a property containing a URL (testing for the string "http"), it will open the URL when the user click on the feature in the map. |
| Layerswitch | extra | A simple layer control for vector layers that shows the legend for each layer. It is
possible to disable the ability to turn of the layers and/or if the legend should be
visible in the control. It can show a legend for both vector layers and WMS layers from
Spatial Suite. To specify the text in the dropdown, add this parameter (only if
type=dropdown):
<param name="module.widget.control.layerswitch.dropdowntext">Legend</param> |
| Layertoggle | extra | Toogle base layers in the map. Only layers that are in a themegroup with the type
"radiobutton" is available to select. Each layer need an imageicon for the layertoggle.
Alternative you can add this parameter if the imageicons are placed in the folder. The
name of the images needs to be the same as the theme name and need to be a PNG file:
<param name="module.widget.control.layertoggle.imagepath">[module.widget.url]/images/custom/themeicons/</param> |
| Location | basis | To use a custom the icon for the user location in the map, you can add the following
parameter with a URL to an image: <param name="module.widget.location.img">https://septima.dk/widget/test/img/icon_pink.png</param> |
| Overlay | basis | The user need to activate the map before use. This preven unintended zooming or panning when scrolling the page. |
| Fullscreen | basis | The user can view the map in fullscreen mode. |
| Route | extra | Calculate the distance and route to the nearest features in the map. The starting point
is a point found with Search or the location of the user found with
Location. It is posible to calculate routes using bikes or car.
To use this function you need the right to use it and a valid apikey for the route service. The apikey is added to the parameterfile like this: <param name="module.widget.control.route.apikey">TOKEN_FROM_SEPTIMA</param> |
| Table | extra | Show the features from the map in a list. When clicking the list the map will zoom to that feature. |
| Kommuneplan | extra | Zoom to a specific feature from plansystem.dk and show the text beside the map. Just add
data-widget-key="PLANID" to the div-element.
|
| Locate | basis | Much like "Kommuneplan" it zooms the map to a specific feature from any service that can
deliver geojson. Just add data-widget-key="ID" to the div-element. |
| Story | extra | Take the user through the data like a story stepping from one point to another showing the information and navigating the map at the same time. |
| Googlestreetview | extra | View Google Street View for a location in the map. To use this function you need the
right to use it and a valid apikey for Google Street View. The apikey is apprehended at
Google
and added to the parameterfile like this: <param name="module.widget.control.googlestreetview.apikey">APIKEY_FROM_GOOGLE</param> |
If you have have specific requirements for the styling of the widget, then you can add your own custom css file to all the widgets. Then you can style the info box and more to fit your needs. Just place a css file some where on the internet
<param name="module.widget.css">[module.widget.url]/css/custom/widget.css</param>
Add this paramter to a parameter file in the test site. If the value is "true" then there will be a warning on the admin page that reminds you that you are on a test site and the configuration isn't visible for external users.
<param name="module.widget.testsite">true</param>
When using the API, you can control the default profile by adding this parameter:
<param name="module.widget.autoprofile">widgetprofile</param>
See the Widget Dashboard:
https://webkort.kommune.dk/spatialmap?page=widget.dashboard&token=YOUR_TOKEN
This will show the latest 500 entries in the log. To show more add &limit=1000 to show
the latest 1000 entries instead of just 500.
It is possible to make bulk update of widgets. This is done at this page:
https://webkort.kommune.dk/spatialmap?page=widget.bulk&token=YOUR_TOKEN
If you are using HTTP and want to switch to HTTPS, you only need to do two things:
1. Change the paramter "module.widget.url" to include https:
<param name="module.widget.url">https://webkort.kommune.dk</param>
2. Run this URL once in your browser:
https://webkort.kommune.dk/spatialmap?page=widget.bulk.replace.http&token=YOUR_TOKEN
All errors are loged and are visible in the dashboard. It is also possible to send an email when an error occurs. To do this, you need the mailer module from Septima. Please contact Septima for further information on that module.
To activate this functionality, you need to add this parameter:
<param name="module.widget.mailer.ds">ds_simple-mailer</param>
If you are using an other datasource, just change the name.
Before Spatial Suite 4, sites were typically running on Tomcat 6. If you are using Tomcat 6, you need to add this parameter:
<param name="module.widget.jspdir">jsp_old_tomcat</param>
The result is that you are using a more simple version of the JSP files due to lack of functionality in Toncat 6. There can be some issues with CORS when loading configuration, data and more from various homepages when usigen this. Please contact us if you are experiencing any issues.
WEB-INF/lib and add the new one from lib folder in the module
and then restart the Tomcat.The list of widgets contains all widgets regardless of the profile. Widgets created with a profile that is different from the current profile, is grayed out but visible.
To hide the grayes out widgets, set this parameter to false:
<param name="module.widget.showall">false</param>
Here you can find som features, that can come in handy.
Only the first 3000 (default) widgets are visible in the list due to performance issues. If you have
more, a notification is present in the bottom of the list. To view less, just add the parameter
limit=1000 to the URL:
https://webkort.kommune.dk/spatialmap?page=widget&token=YOUR_TOKEN&limit=1000
To preview a full screen example of a widget, created with the Admin tool, call this page (change the host name):
https://webkort.kommune.dk/spatialmap?page=widget-view&name=CONFIGURATION_ID&present=false
Where CONFIGURATION_ID is the id from the Admin page. Remove &present=false
to remove the code snippet from the page.
The module for Spatial Suite gives you a GUI for editing Septima Widget configurations. But in some cases you need to use Septima Widget in a way that is not suitable or just not possible. In these cases you can use a custom configuration.
This is done by using a JSON file for a Widget. To do this, you need to add a parameter to define where the JSON file is placed like this:
<param name="module.widget.config.json">[module:widgetconfig.dir]/json</param>
Place you JSON fil in that folder and preview the Widget with this URL:
https://webkort.kommune.dk/spatialmap?page=widget-view&name=JSON_FILE_NAME&present=false
Where JSON_FILE_NAME is the name of the JSON file without extention (.json). Remove
&present=false to remove the code snippet from the page.
To use this JSON in your CMS (or HTML), just add this to your page:
<div data-widget="JSON_FILE_NAME"></div> <script src="//webkort.kommune.dk/widget.js"></script>
Read more on https://github.com/Septima/widget-public/wiki/Use-custom-configuration
It is possible to use a profile to configure a Widget. All visible and available themes in the profile, will be added to the Widget. All visible themes will be visible and the rest will be hidden, but can be turned on with a layerswitch.
To use the profile, add this to your HTML (CMS):
<div data-widget="JSON_FILE_NAME" data-widget-profile="PROFILENAME"></div> <script src="//webkort.kommune.dk/widget.js"></script>
Where PROFILENAME is the name of the profile and JSON_FILE_NAME is the name
of the JSON file without extention (.json). The content of the JSON_FILE_NAME could be
like the file /config/empty.json from the module.
Please kontact support@septima.dk for further information and support.