caseymockbee97
commented
3 years ago You need to create a function to clear:
`_this.fillBackground= function () {
_this.valuesChanged = true;
_this.ctx.drawing.fillStyle = '#FFFFFF'
_this.ctx.drawing.fillRect(0, 0, _this.canvas.drawing.width, _this.canvas.drawing.height)
}`call it in component did mount after this.drawImage()
`this.drawImage();
this.fillBackground();
this.loop();`and change clear to this
`_this.clear = function () {
_this.lines = [];
_this.valuesChanged = true;
_this.ctx.drawing.clearRect(0, 0, _this.canvas.drawing.width, _this.canvas.drawing.height);
_this.ctx.drawing.fillStyle = '#FFFFFF'
_this.ctx.drawing.fillRect(0, 0, _this.canvas.drawing.width, _this.canvas.drawing.height)
_this.ctx.temp.clearRect(0, 0, _this.canvas.temp.width, _this.canvas.temp.height);
};`
I'm trying to work from my own fork so that I can draw a white background onMount and on clear so that when I export the image it has a default white background instead of transparent. Has anyone had any luck with this? If so could you point me in the right direction of where I need to do a fillRect(0, 0, _this.canvas.drawing.width, _this.canvas.drawing.height) with-in the file.