Windy Community

    • Register
    • Login
    • Search
    • Unread
    • Categories
    • Groups
    • Go to windy.com

    Zoom is limited to level 11

    Windy API v4
    6
    7
    1977
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • H
      Hroch last edited by

      Is it new limitation in APIv4 that it is not possible to zoom more than level 11? In APIv3 zoom was working without problems.

      1 Reply Last reply Reply Quote 1
      • V
        Vincent Lion last edited by

        Hi,
        I have the same problem. Have found an answer ?

        1 Reply Last reply Reply Quote 1
        • M
          maxmastalerz | Premium last edited by

          same issue here. Not having the zoom go past 11 makes my project pretty much impossible to attain with windy. I may have to use google maps api with general markers to indicate wind speed at a certain spot. I honestly don't know what to do...

          1 Reply Last reply Reply Quote 1
          • J
            jalbert last edited by

            Exact same issue here as well. I also asked about this in:
            https://community.windy.com/topic/6580/adding-zoomed-in-layers-in-api-v4

            and other people have also asked about this problem in other threads, but no one yet has mentioned a fix (or API update) for this issue so far I believe...

            1 Reply Last reply Reply Quote 1
            • Tedde
              Tedde last edited by

              You can adjust the zoom levels by adding the following code to the windyInit{}

              map.options.minZoom = 4;
              map.options.maxZoom = 18;
              

              Then you can add another tile layer, hidden by default if you start at a higher zoom level:

              topLayer =L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}').addTo(map); 
              topLayer.setOpacity('0');       
              

              Create a document ready with and add a zoomend listener that detects if the zoom is 12 or higher. If so, show the 'other' tile layer.

              map.on('zoomend', function() { 
                  if (map.getZoom() >= 12) {
                      topLayer.setOpacity('1');
                  } else {
                      topLayer.setOpacity('0');   
                  }
              });
              

              You can now zoom in to a deep level, in this example 18, with a tile layer of your own choice.
              Note: this is leaflet related, not specifically Windy API related.

              0_1540884242922_windyzooming.jpg

              1 Reply Last reply Reply Quote 1
              • J
                jalbert last edited by

                OK, thanks, I have this working now -- specifically in the lines right after :

                // Initialize Windy API
                windyInit( options, windyAPI => {
                    // windyAPI is ready, and contains 'map', 'store',
                    // 'picker' and other useful stuff
                    // const { map } = windyAPI
                    var { map } = windyAPI
                    // .map is instance of Leaflet map
                

                the code added to get it working is:

                    map.options.minZoom = 4;
                    map.options.maxZoom = 17;
                
                    var topLayer = L.tileLayer('http://b.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                        attribution: 'Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, ',
                        minZoom: 12,
                        maxZoom: 17
                    }).addTo(map);
                    topLayer.setOpacity('0');
                
                    map.on('zoomend', function() {
                        if (map.getZoom() >= 12) {
                            topLayer.setOpacity('1');
                        } else {
                            topLayer.setOpacity('0');
                        }
                    });
                    map.setZoom(14);
                

                and it now works for me. (Adding the minZoom and maxZoom settings to the const options = { ... } settings before the WindyInit, or any code before var { map } = windyAPI in the WindyInit, did not work for me.) Thanks!

                (BTW, I'll have a couple more questions later on a couple of other Windy API4 / Leaflet minor issues I'm having that are unrelated to the zoom levels.)

                Thank you very very much!!!
                justin

                1 Reply Last reply Reply Quote 1
                • M
                  MMurphyThree last edited by

                  Just for anyone coming to this topic now, I used @Tedde / @jalbert's solution and it worked a treat, but I've found it can actually be achieved with a bit less code. @jalbert added minZoom and maxZoom options to the tileLayer, essentially negating the need for the zoomend Event Listener that @Tedde suggested. So in short, the following code is all that's required:

                  map.options.minZoom = 4;
                  map.options.maxZoom = 17;
                  
                  var topLayer = L.tileLayer('https://b.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                      attribution: 'Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, ',
                      minZoom: 12,
                      maxZoom: 17
                  }).addTo(map);
                  
                  1 Reply Last reply Reply Quote 1
                  • Referenced by  Carlos Mesa Cabrera Carlos Mesa Cabrera 
                  • First post
                    Last post
                  Windyty, S.E. - all rights reserved. Powered by excellent NodeBB
                  NodeBB & contributors, OSM & contributors, HERE maps
                  Terms and Conditions     Privacy Policy