как сделать холст отзывчивым или очистить кнопку

Question

У меня есть код, который означает, что пользователь вводит текст в холст, но он не будет реагировать на возврат, и текст уходит с холста.Мне либо понадобится кнопка, которая может очистить весь холст целиком, либо код, чтобы холст реагировал на возврат и т. Д. Мне также нужно иметь возможность изменить шрифт и размер вывода.

очистить часть изображениякода не работает

   <canvas id="textCanvas" width="500" height="250" top style="border:1px solid #000000;position:relative;">
</canvas>
<button onclick="Clear_image();return true;">Erase Everything</button>
<input type = "text" id = "UserInput">
<script>
  var text = document.getElementById("textCanvas");
  var txt_context = text.getContext("2d");
  var UserInput = document.getElementById("UserInput");
  UserInput.oninput = function() {
    txt_context.font = "30px Arial";
    txt_context.fillText(UserInput.value, 100, 100);