diff --git a/index.html b/index.html index 6db47b9..265dc2a 100644 --- a/index.html +++ b/index.html @@ -31,8 +31,11 @@ <option value="&">&</option> <option value="%">%</option> </select> + <button id="botonLimpiar">Limpiar</button> <input type="color" value="#000000" id="colorPicker"> - <canvas id="lienzoCuadriculado" width="500" height="500"></canvas> + <canvas id="lienzoCuadriculado" width="500" height="500"> + Tu navegador no admite el elemento <canvas>. + </canvas> <script> const colorPicker = document.getElementById("colorPicker"); const lienzo = document.getElementById("lienzoCuadriculado"); @@ -87,6 +90,12 @@ caracteresEnPosiciones.set(posicionClave, { ascii, color }); } } + + botonLimpiar.addEventListener("click", () => { + contexto.clearRect(0, 0, lienzo.width, lienzo.height); + caracteresEnPosiciones.clear(); + dibujarCuadricula(); + }); lienzo.addEventListener("mousedown", (evento) => { dibujando = true;