Canvas element doesn't seem to update after window resize

[Zaptronic]

I have a leaflet map which has the width and height of the window. If I resize the window the map size get updated. Somehow the new values are not translated from the map to canvas elements. How can this be achieved?

[stoufa]

Same here ! Though, the map doesn't get resized ! If I were the maintainer of this library, I'll start by debugging the overlay method : the canvas alone can be resized with no problems but once we overlay it on the map, it won't work anymore !

Quoting from the documentation of that method :

The tile map generated is a separate DOM element that is displayed behind the canvas and is the same size of the canvas.

The same initial size ! Then, it won't resize with it, and this is the issue. Hope I helped.

[cvalenzuela]

Hey! Thanks for pointing the issue.

I don't have time to maintain this library anymore, I'll be more than happy to see if someone is interested in maintaining the library in a thoughtful and constructive way!

[gberrante]

hello i solved in this way:

this is my p5.js sketch:

  function setup() {
    canvas = createCanvas(windowWidth, windowHeight);
  
    myMap = mappa.tileMap(options);
    myMap.overlay(canvas,function () {
        myMap.map.invalidateSize();
    });
    
  }
  
  function draw() {
  }
  
  
  function windowResized(){
    resizeCanvas(windowWidth, windowHeight);
    myMap.resize(canvas);
  }

and in the mappa.js, i have added this method to the class ( just under the method overlay ):

{
    key: 'resize',
    value: function resize(canvas) {
      this.mappaDiv.style.width = canvas.width + 'px';
      this.mappaDiv.style.height = canvas.height + 'px';
    }
  }

this works for me

[stoufa]

@gberrante Working perfectly, Thanks. You should make a PR by the way 😉