Skip to content

Restore layers on removal from control, improve multilayer support#17

Open
RacingTadpole wants to merge 11 commits intodigidem:gh-pagesfrom
TerriaJS:15_clip
Open

Restore layers on removal from control, improve multilayer support#17
RacingTadpole wants to merge 11 commits intodigidem:gh-pagesfrom
TerriaJS:15_clip

Conversation

@RacingTadpole
Copy link
Copy Markdown
Contributor

Fixes #15.
This also improves support for more than one layer on each side (one aspect of which is also addressed by #5).

Note this changes the signature of _updateLayers to _updateLayers: function (newLeftLayers, newRightLayers). It might also make sense to drop the underscore at the start of its name and make updateLayers part of the API, so you can update both sides' layers in one call.

@gmaclennan
Copy link
Copy Markdown
Member

Thanks for this @RacingTadpole. I'm happy with making _updateLayers part of the API if that's going to be useful for some people, do you want to add that change to this PR?

@Charmatzis
Copy link
Copy Markdown

@RacingTadpole I tried your PR, but in array layers wasn't working. Are you sure about this PR?

@RacingTadpole
Copy link
Copy Markdown
Contributor Author

Thanks for checking it out. I could well have missed some cases. Can you give me an example that fails?

@Charmatzis
Copy link
Copy Markdown

Charmatzis commented Aug 7, 2017

It doesn't work the _updateClip function I believe. The result is, both layers render in both sides.

@RacingTadpole
Copy link
Copy Markdown
Contributor Author

Thanks @Charmatzis, you're right - eg. the original initialization function no longer worked. I've fixed this now, and made updateLayers part of the external API (by removing the underscore from the front).

So now index.html works with this PR (after npm run build). And here's sample extra code that also works, if you put it at the end of index.html:

    var layer3 = L.tileLayer('//stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.png', {
        attribution:
            'Map tiles by <a href="http://stamen.com">Stamen Design<\/a>, ' +
            '<a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0<\/a> &mdash; ' +
            'Map data {attribution.OpenStreetMap}',
        minZoom: 1,
        maxZoom: 16,
        opacity: 0.3
    }).addTo(map)

    var sideBySide = L.control.sideBySide([stamenLayer, layer3], osmLayer).addTo(map);
    setTimeout(function() {
        sideBySide.updateLayers(stamenLayer, [osmLayer, layer3])
    }, 3000);

This loads the "toner" map with low opacity on the left initially, then after 3 seconds puts it on the right instead.

@NenadSteric
Copy link
Copy Markdown

will this be ever merged ?
I really need this functionality and will probably fork and publish a new npm if you dont want to continue with this module .

@gmaclennan
Copy link
Copy Markdown
Member

Hi, I'd completely forgotten about this. I'd be happy to add contributors if someone would like to review, merge and publish - we're not using this module for any active projects right now so it's not been a priority.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Removing layers from the control does not restore them to both sides

4 participants