Hello

This is my first Windy plugin.
I thought it would be nice if you could change the map background.
This has been requested before (sometimes asking to integrate windy inside mapbox instead)

1. Install and activate the plug-in from npm: windy-plugin-mapbox
   
2. Initially it does nothing. You have to use the context menu to open the options pop-up.
3. From there you can load your own custom mapbox map style, or use one of the examples provided.
4. The URL required is the preview for your map style from mapbox.studio.

Important note:
Even though they are called "overlays", all windy visualizations are under the map layer. This means that either your map style has to have a transparent background (the same way as the default base map) or you have to use the checkbox for moving the map behind the overlays and reducing their opacity.

Things I want to see in future versions:

• Currently the base-map remains in use even after adding your map. It is preferable to remove it in order to reduce data calls to mapy.cz and remove duplicating labels. Unfortunately, I couldn't find a hook to the GroupLayer element. Is this available in the current plugins API?
• Mapbox offers tiles of size 512 by default. They say that this reduces the number of network calls by 4. In my first attempt I couldn't align correctly a 512x512 custom map with the existing 256x256 overlays, so I stopped there.
• I am unsure if I should try to manipulate the markers layer. It can currently duplicate labels from the custom map style. It might be better to have blank clickable areas.
• The opacity reduction is currently hard coded at 50%, some overlays might need higher or lower opacity.
• Currently there are visualization canvases with grey background. If I could dynamically remove the grey background , some overlays wouldn't need reduced opacity and would maintain their vibrant colours.
• More example maps to be added to the list. I would love to see suggestions.

Code available on github

More about Mapbox
It is a platform for generating maps based on different kind of data sources.
Creating a free profile allows you to share your custom maps up to 2500 visits per month. If my plugin and plugin examples become too popular, they might start getting restricted.
Mapbox studio allows great freedom of customisation when it comes to map elements. You can change the colour and size of texts, roads, rivers, mountains and add custom icons among everything else.

Steps to your first custom map:

1. make a profile at Mapbox.com
2. open mapbox studio
3. start a new map , use a template if you want
4. make any changes you want
5. press the big blue "Publish" button in the top right corner
6. back in mapstudio main page, click the share button next to your new map
7. Use the preview link to share here and to customize Windy.

@rittels
Thank you very much.
I updated the plugin with that and also added a "restore default map" button, in case people don't like any of the custom maps.

I am looking for the button to edit a post of mine.
I guess that it will be under the 3 dots dropdown menu, but I receive the error message "cannot read property 'posts' of undefined"

This appears for either posts by me or other people.

@rittels
Thank you very much.
I updated the plugin with that and also added a "restore default map" button, in case people don't like any of the custom maps.

More about Mapbox
It is a platform for generating maps based on different kind of data sources.
Creating a free profile allows you to share your custom maps up to 2500 visits per month. If my plugin and plugin examples become too popular, they might start getting restricted.
Mapbox studio allows great freedom of customisation when it comes to map elements. You can change the colour and size of texts, roads, rivers, mountains and add custom icons among everything else.

Steps to your first custom map:

1. make a profile at Mapbox.com
2. open mapbox studio
3. start a new map , use a template if you want
4. make any changes you want
5. press the big blue "Publish" button in the top right corner
6. back in mapstudio main page, click the share button next to your new map
7. Use the preview link to share here and to customize Windy.

Hello

This is my first Windy plugin.
I thought it would be nice if you could change the map background.
This has been requested before (sometimes asking to integrate windy inside mapbox instead)

1. Install and activate the plug-in from npm: windy-plugin-mapbox
   
2. Initially it does nothing. You have to use the context menu to open the options pop-up.
3. From there you can load your own custom mapbox map style, or use one of the examples provided.
4. The URL required is the preview for your map style from mapbox.studio.

Important note:
Even though they are called "overlays", all windy visualizations are under the map layer. This means that either your map style has to have a transparent background (the same way as the default base map) or you have to use the checkbox for moving the map behind the overlays and reducing their opacity.

Things I want to see in future versions:

• Currently the base-map remains in use even after adding your map. It is preferable to remove it in order to reduce data calls to mapy.cz and remove duplicating labels. Unfortunately, I couldn't find a hook to the GroupLayer element. Is this available in the current plugins API?
• Mapbox offers tiles of size 512 by default. They say that this reduces the number of network calls by 4. In my first attempt I couldn't align correctly a 512x512 custom map with the existing 256x256 overlays, so I stopped there.
• I am unsure if I should try to manipulate the markers layer. It can currently duplicate labels from the custom map style. It might be better to have blank clickable areas.
• The opacity reduction is currently hard coded at 50%, some overlays might need higher or lower opacity.
• Currently there are visualization canvases with grey background. If I could dynamically remove the grey background , some overlays wouldn't need reduced opacity and would maintain their vibrant colours.
• More example maps to be added to the list. I would love to see suggestions.

Code available on github