-
Notifications
You must be signed in to change notification settings - Fork 41
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Layer opacity control #304
Layer opacity control #304
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @fschmenger for this useful feature. It works fine and the code looks great as well.
I have only one question inline and some minor formatting notes. Otherwise ready to merge.
}, | ||
{ | ||
"type": "IMAGEWMS", | ||
"lid": "ahocevar-imagewms", | ||
"ratio": 1.5, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
what does this do?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
From what I can see this has been added in eef26a6. Quoted from map-layer-configuration.md:
Ratio 1 means image requests are the size of the map viewport, 2 means twice the width and height of the map viewport. Must be 1 or higher.
The whole purpose here is to sync the documentation example to the current app-conf.json, as I added new properties. Since this hasn`t been done for quite some time, some unrelated changes to this PR will pop up in the documentation file.
computed: { | ||
/** | ||
* Returns true, if the layer item should show an extension slider with layer details. | ||
**/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
**/ | |
*/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed by b74def0.
methods: { | ||
/** | ||
* Handler for input on the opacity slider, updates the layer`s opacity. | ||
**/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
**/ | |
*/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed by b74def0.
@@ -38,7 +39,8 @@ describe('layerlist/LayerListItem.vue', () => { | |||
it('has correct props', () => { | |||
expect(vm.mapView).to.equal(view); | |||
expect(vm.layer).to.equal(osmLayer); | |||
expect(vm.showDetails).to.equal(true) | |||
expect(vm.showLegends).to.equal(true); | |||
expect(vm.showOpacityControls).to.equal(true) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
expect(vm.showOpacityControls).to.equal(true) | |
expect(vm.showOpacityControls).to.equal(true); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed by b74def0.
This pull request adds a layer opacity control to the layer list module.
MapLayer params
To enable the opacity control for a specific layer, set the configuration attribute
opacityControl
for your map layer totrue
.Disabling opacity control in LayerList
Similarly to the legend implementation, I decided to add a configuration attribute
showOpacityControls
to the LayerList module (defaults totrue
). The implementation is wrapped in a separate templatewgu-layeropacitycontrol
, so you have the possibility to disable the control in the layer list and display it elsewhere.Example configurations
I enabled the opacity control for various layers in the app-starter configuration, where I thought it would make the most sense.