conterra / mapapps-vuetoc Goto Github PK

The Vue TOC is a new widget that allows you to control the map content.

Home Page: https://demos.conterra.de/mapapps/resources/apps/downloads_vuetoc/index.html

License: Apache License 2.0

JavaScript 66.25% Vue 22.84% CSS 7.98% HTML 2.93%

4x mapapps deprecated

mapapps-vuetoc's Introduction

⚠️ Beginning in version 4.7 map.apps contains a toc bundle in the core product. It is recommended to use the map.apps toc bundle instead of the VueTOC.

Vue TOC Bundle

The Vue TOC is a widget that allows you to control the map content.

Sample App

https://demos.conterra.de/mapapps/resources/apps/downloads_vuetoc/index.html

Installation Guide

Requirement: map.apps 4.2.0

Simply add the bundle "dn_vuetoc" to your map.apps 4 app.

Configurable Components of dn_vuetoc:

Config:

"Config": {
    "showBasemaps": true,
    "showGroundOpacity": false,
    "showOperationalLayer": true,
    "showLoadingStatus": true,
    "showOperationalLayerHeaderMenu": true,
    "showLayerMenu": true,
    "showResetButton": true,
    "showCloseButton": true,
    "expandInitially": false,
    "visibleIconClass": "check_box",
    "invisibleIconClass": "check_box_outline_blank"
}

You need to configure the ground in you app to use the property showGroundOpacity. The ground opacity slider is only available in the 3D view.

"map": {
    "ground": {
        "url": "https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer",
        "type": "ELEVATION"
        "opacity": 1
    },
    "layers": [...],
    ...
}

Properties

Property	Type	Possible Values	Default	Description
showBasemaps	boolean	`true` \| `false`	`true`	Show basemaps
showGroundOpacity	boolean	`true` \| `false`	`false`	Show ground opacity slider
showOperationalLayer	boolean	`true` \| `false`	`true`	Show operational layers
showLoadingStatus	boolean	`true` \| `false`	`true`	Show current loading status of layer
showOperationalLayerHeaderMenu	boolean	`true` \| `false`	`true`	Show operational layer menu
showLayerMenu	boolean	`true` \| `false`	`true`	Show layer menu
showResetButton	boolean	`true` \| `false`	`true`	Show reset button
showCloseButton	boolean	`true` \| `false`	`true`	Show close menu
expandInitially	boolean	`true` \| `false`	`true`	Expands the tree
visibleIconClass	String		`"check_box"`	Visible icon class
invisibleIconClass	String		`"check_box_outline_blank"`	Invisible icon class

Icon class samples

Any material design icon class is possible: https://material.io/tools/icons/?icon=check_box_outline_blank&style=baseline

"Config": {
    "visibleIconClass": "visibility",
    "invisibleIconClass": "visibility_off"
}

"Config": {
    "visibleIconClass": "check",
    "invisibleIconClass": "close"
}

"Config": {
    "visibleIconClass": "check_box",
    "invisibleIconClass": "check_box_outline_blank"
}

"Config": {
    "visibleIconClass": "radio_button_checked",
    "invisibleIconClass": "radio_button_unchecked"
}

"Config": {
    "visibleIconClass": "thumb_up",
    "invisibleIconClass": "thumb_down"
}

Development Guide

Define the mapapps remote base

Before you can run the project you have to define the mapapps.remote.base property in the pom.xml-file: <mapapps.remote.base>http://%YOURSERVER%/ct-mapapps-webapp-%VERSION%</mapapps.remote.base>

Other methods to to define the mapapps.remote.base property.

Goal parameters mvn install -Dmapapps.remote.base=http://%YOURSERVER%/ct-mapapps-webapp-%VERSION%
Build properties Change the mapapps.remote.base in the build.properties file and run: mvn install -Denv=dev -Dlocal.configfile=%ABSOLUTEPATHTOPROJECTROOT%/build.properties

mapapps-vuetoc's People

Contributors

Stargazers

Watchers

Forkers

trendingtechnology

mapapps-vuetoc's Issues

Scale dependent restriction are not shown initial

If I start an app and the layer is not visible in the initial scale, I get no feedback about that.
The user gets only a feedback about layers that are not shown in the current scale if the user move the map to a visible scale and move back to an invisible scale.

Allow to set ground opacity

There is a property to set the ground opacity in map.apps/esri API. It would be cool, if this property could be changed within the vuetoc.

Sample: https://demos.conterra.de/mapapps/resources/apps/geologie/index.html

"map": {
"ground": {
"opacity": 0.8
},
...

4 - VueTOC / clusterfeature-layer / appsoverview

Using a clusterfeature-layer ("ClusterFeatureLayer-bundle") in combination with VueTOC produces an issue with the appsoverview-bundle: Overview doesn't show any apps anymore
When another kind of toc (e.g. layerlist) is used the appsoverview isn't affected.

Zoom to Layer

would be a nice feature to be able to zoom to the extent of the layer (same as in scene viewer toc).

Layout issues in non-everlasting themes

Title text color should be white instead of grey.

i18n files are loaded separately in compressed build

If running the bundle in a compress build the i18n files will be loaded in a separate request. For standalone builds, these files won't be exported and therefore result in an error.

Actions are always visible

Each action is always visible for each layer and not only if the condition of the individual action is fulfilled.

Make control of baselayers and/or operational layer optional

As an administrator I want to be able to configure if basemaps, operational layers or both are shown in the toc.

GroupLayer hide-children

It would be nice if VueTOC would support the ArcGIS JS API property "listMode" for GroupLayers so you could hide a GroupLayer or its children in the toc.

layers with scale-dependent visibility

It would be nice if the user would get feedback from the VueTOC when layers with scale-dependent visibility are not shown in the current scale.

It would be nice if the VueTOC could display more than two levels of layers so that you could use a "sub-sub-layer" like:

"dn_vuetoc": {
  "Config": {
    "showBasemaps": true,
    "showOperationalLayer": true,
    ....

but obviously another component name has to be used:

"dn_vuetoc": {
  "MapContentWidgetFactory": {
    "showBasemaps": true,
    ...