change to transparent background save image

This commit is contained in:
kicap1992
2021-07-13 19:36:48 +08:00
parent 8ce4f7968b
commit 5529bf441d
2 changed files with 24 additions and 7 deletions

View File

@ -309,7 +309,10 @@ resizeCanvas();
function takeshot() {
var div = document.getElementById('sini_div_baju_color');
var div = document.getElementById('sini_div_canvas');
canvas.backgroundColor=null;
canvas.renderAll();
var canvasnya = canvas;
// Use the html2canvas
// function to take a screenshot
@ -320,7 +323,7 @@ resizeCanvas();
document
.getElementById('output')
.appendChild(canvas);
var base64URL = canvas.toDataURL('image/jpeg');
var base64URL = canvas.toDataURL('image/png');
console.log(base64URL)
$("#ini_untuk_share").attr('onclick',"window.plugins.socialsharing.share(null, 'Irwan T-Shirt Design', '"+base64URL+"', null)");
var x = document.createElement("IMG");
@ -331,6 +334,8 @@ resizeCanvas();
setTimeout(function(){
$('#ini_untuk_share').trigger('click');
}, 200);
canvasnya.backgroundColor = null;
canvasnya.renderAll();
})
}
@ -346,7 +351,9 @@ resizeCanvas();
opacity: .5,
color: '#fff'
} });
var div = document.getElementById('sini_div_baju_color');
var div = document.getElementById('sini_div_canvas');
canvas.backgroundColor=null;
canvas.renderAll();
await html2canvas(div).then(
function (canvas) {
document
@ -432,6 +439,8 @@ resizeCanvas();
}
xhr.send();
$.unblockUI();
canvas.backgroundColor = null;
canvas.renderAll();
}
function sleep(ms) {

View File

@ -316,15 +316,17 @@ resizeCanvas();
function takeshot() {
var div = document.getElementById('sini_div_baju_color');
var div = document.getElementById('sini_div_canvas');
canvas.backgroundColor=null;
canvas.renderAll();
var canvasnya = canvas;
html2canvas(div).then(
function (canvas) {
document
.getElementById('output')
.appendChild(canvas);
var base64URL = canvas.toDataURL('image/jpeg');
var base64URL = canvas.toDataURL('image/png');
console.log(base64URL)
window.location.href = base64URL;
@ -338,6 +340,8 @@ resizeCanvas();
setTimeout(function(){
$('#ini_untuk_share').trigger('click');
}, 200);
canvasnya.backgroundColor = null;
canvasnya.renderAll();
})
}
@ -354,7 +358,9 @@ resizeCanvas();
opacity: .5,
color: '#fff'
} });
var div = document.getElementById('sini_div_baju_color');
var div = document.getElementById('sini_div_canvas');
canvas.backgroundColor=null;
canvas.renderAll();
await html2canvas(div).then(
function (canvas) {
document
@ -440,6 +446,8 @@ resizeCanvas();
}
xhr.send();
$.unblockUI();
canvas.backgroundColor = null;
canvas.renderAll();
}
function sleep(ms) {