canvasで出力した画像の大きさを変更したいです

目的：canvasにて出力した画像のサイズの縮小

動画のコピーフレームをjavascriptを用いてweb上に出力したいのですが大きさの指定方法がわかりません。
出力しても動画ファイル自体のサイズになってしまいます。
また、canvas自体のサイズを変更しても出力したコピーフレームが見切れてしまう形でサイズが調整されてしまいます。

html
1<html>
2  <html lang="ja"></html>
3  <head>
4    <meta http-equiv="content-type" charset="utf-8" />
5    <title>動画編集</title>
6    <link rel="stylesheet" href="style.css" />
7  </head>
8  <body>
9    <input type="file" id="inputfile" />
10    <video
11      id="video"
12      controls
13      preload="metadata"
14      width="514"
15      height="360"
16    ></video
17    ><canvas id="canvas"></canvas><br />
18    <input type="button" value="copy frame" onclick="copyFrame()" />
19    <br />
20    <button>
21      <a id="download" download>ダウンロード</a></button
22    ><br />
23    <script src="main.js"></script>
24  </body>
25</html>
26

javascript
1let inputfile = document.getElementById("inputfile");
2let video = document.getElementById("video");
3let dlc = document.getElementById("download");
4let canvas = document.getElementById("canvas");
5
6inputfile.addEventListener(
7  //ファイルAPI
8  "change",
9  function (e) {
10    let file = e.target.files;
11    let reader = new FileReader();
12    console.log(reader);
13    reader.readAsDataURL(file[0]);
14    reader.onload = function () {
15      video.src = reader.result; //result = URL の文字列
16      dlc.href = reader.result; //<a>のhref要素にURLを代入
17    };
18  },
19  false
20);
21
22
23function copyFrame() {
24  let cCtx = canvas.getContext("2d");
25  canvas.width = video.videoWidth; // canvasの幅と高さを、動画の幅と高さに合わせる
26  canvas.height = video.videoHeight;
27
28  cCtx.drawImage(video, 0, 0); // canvasに関数実行時の動画のフレームを描画
29
30  let imgdata = cCtx.getImageData(0, 0, video.videoWidth, video.videoHeight); // pixelデータを取得
31  for (let i = 0; i < imgdata.data.length; i += 4) {
32    // imgdata.data: [R,G,B,alpha,R,G,B,alpha...]
33    let gray =
34      (imgdata.data[i] + imgdata.data[i + 1] + imgdata.data[i + 2]) / 3; // グレースケール値計算
35    imgdata.data[i] = imgdata.data[i + 1] = imgdata.data[i + 2] = gray; // RGB
36    imgdata.data[i + 3] = 255; // alpha
37  }
38  cCtx.putImageData(imgdata, 0, 0); // 描画
39
40}
41