Canvas调整大小浏览器 - addEventListener'调整大小'

Question

有一段时间我正在尝试部署响应式画布。 我设法根据屏幕加载画布，尺码套装。但问题是，如果你调整屏幕大小，画布总是上传的大小。

https://jsfiddle.net/gislef/fvzj7z1d/

现在我正在尝试实现调整大小，但是如果所有函数都进行了操作则会出现一些错误，那么画布会经常调整大小。

https://jsfiddle.net/gislef/ua9a20aL/2/

 window.addEventListener('resize', function(){

      if ((widthscrencan >=361) || (widthscrencan ==768)){ 

          zoomIn768()
      } 
    }, false);


    window.addEventListener('resize', function(){   
      if ((widthscrencan >=769) || (widthscrencan ==992)){ 

          zoomIn992()
      }
    }, false);  


    window.addEventListener('resize', function(){   
      if ((widthscrencan >=993) || (widthscrencan ==1200)){ 

          zoomIn1200() 
      }

    }, false);

    window.addEventListener('resize', function(){   
      if (widthscrencan >=1300){ 

          zoomIn1300()          
      }
     }, false);

我是javascript的新手，我最近努力学习

感谢您的帮助