# Get feedback from a html canvas element

**URL:** <https://discourse.nodered.org/t/get-feedback-from-a-html-canvas-element/44275>\
**Category:** Dashboard\
**Created:** [16 April 2021 11:52 UTC](https://discourse.nodered.org/t/get-feedback-from-a-html-canvas-element/44275 "2021-04-16T11:52:27Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![YT2310](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/yt2310/32/35255_2.png) [@YT2310](https://discourse.nodered.org/u/YT2310)\
**Post date:** [16 April 2021 11:52 UTC](https://discourse.nodered.org/t/get-feedback-from-a-html-canvas-element/44275/1 "2021-04-16T11:52:28Z")

</div>

Hey there,

I m trying to give the feedback of a canvas element into node-red using a templade node. unfortunately I can't do that at the moment

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/9/69d071afe2416feb6833223a5751689159855b34.png)

```auto
<style>
.wrapper {
  position: relative;
  width: 400px;
  height: 200px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
img {
  position: absolute;
  left: 0;
  top: 0;
}

.signature-pad {
  position: absolute;
  left: 0;
  top: 0;
  width:400px;
  height:200px;
}
</style>

<h1>
  Draw over image
</h1>
<div class="wrapper" style="background-color:white;">
  <canvas id="signature-pad" class="signature-pad" width=400 height=200></canvas>
</div>
<div>
  <button id="save">Save</button>
  <button id="clear">Clear</button>
</div>

<script>
var signaturePad = new SignaturePad(document.getElementById('signature-pad'), {
  backgroundColor: 'rgba(255, 255, 255, 0)',
  penColor: 'rgb(0, 0, 0)'
});
var saveButton = document.getElementById("save");
var cancelButton = document.getElementById('clear');

saveButton.addEventListener('click', function (event) {
    var data = signaturePad;
    this.scope.action = function() {return data;}

});

cancelButton.addEventListener('click', function (event) {
  signaturePad.clear();
});

</script>

```

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [16 May 2021 11:53 UTC](https://discourse.nodered.org/t/get-feedback-from-a-html-canvas-element/44275/2 "2021-05-16T11:53:02Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.