Matter-js: How do you properly resize canvas for responsive design? Any related API?

[rockmandash]

First of all, thank you for this wonderful javascript library.

I want full-screen canvas, but I didn't find any API to do this.

In Pixi.js, I can resize like this.

this.App.renderer.resize(clientWidth, clientHeight);

But right now I ended up this code

  resizeCanvasRenderer = () => {
    this.canvasRenderer.canvas.width =
      this.props.width * window.devicePixelRatio;
    this.canvasRenderer.canvas.height =
      this.props.height * window.devicePixelRatio;

    this.canvasRenderer.canvas.style.width = `${this.props.width}px`;
    this.canvasRenderer.canvas.style.height = `${this.props.height}px`;
  };

The code above seems to work.
However, this scene becomes so small. I have no idea why this is happening.
I am very new to Matter.js
Please help~~Thank you

[liabru]

This is expected with the simple built in renderer, but it looks like you just want to account for high density displays? Try using Render.setPixelRatio(renderer, 'auto').