function setViewport(options, canvas) {
  if (canvas && canvas.style) {
    let {
      width,
      height,
      mode,
      container
    } = options;
    const {
      clientWidth,
      clientHeight
    } = container;
    width = width || clientWidth;
    height = height || clientHeight;

    if (mode === 'static') {
      canvas.style.width = `${width}px`;
      canvas.style.height = `${height}px`; // canvas.style.top = '50%';
      // canvas.style.left = '50%';
      // canvas.style.transform = 'translate(-50%, -50%)';
      // canvas.style.webkitTransform = 'translate(-50%, -50%)';
    } else {
      canvas.style.top = '0';
      canvas.style.left = '0';
      canvas.style.width = `${clientWidth}px`;
      canvas.style.height = `${clientHeight}px`;
      canvas.style.transform = '';
      canvas.style.webkitTransform = '';
    }
  }
}
width
    height
    mode: 'static', 'scale', 'stickyWidth', 'stickyHeight', 'stickyTop', 'stickyBottom', 'stickyLeft', 'stickyRight'