Question

我使用Canvas让我的用户＆＃34;设计＆＃34;添加后来转换为要在我的网站上显示的图像。在此设计中，用户可以添加他们的徽标。我正在使用此功能将徽标添加到画布中：

function canvasLogo(){
var x = 70;
var y = 70;
// var width = 500;
// var height = 500;

var imageObj = new Image();
imageObj.onload = function() {
    var imageWidth = imageObj.width;
    var imageHeight = imageObj.height;
    if (imageHeight > imageWidth) {

        imageWidth = (imageWidth / imageHeight) * 490;
        imageHeight = 490;
    } else {

        imageHeight = (imageHeight / imageWidth) * 490;
        imageWidth = 490;
    }

    x = x + (500 - imageWidth) / 2;
    y = y + (500 - imageHeight) / 2;
    roundedImage(70, 70, 500, 500, 30, 0, 0, 30);
    global.kanvas.ctx.clip();
    global.kanvas.ctx.fillStyle = "white";
    global.kanvas.ctx.fillRect(70, 70, 500, 500);
    global.kanvas.ctx.drawImage(imageObj, x, y, imageWidth, imageHeight);
    console.log("Logo cargado");
};
imageObj.src = global.kanvas.logo;

}

然后用户添加其他内容，如文本和颜色，最后当他们点击按钮创建我使用的添加时：

function crearAnuncio(elm){
if($("#advanced-wizard").valid() && global.form.idMetodoPago > 0){
    NProgress.start();
    global.kanvas.size = "z";
    setTimeout(function(){
        render();
        global.kanvas.ctx.scale(1*3,1*3);
        setTimeout(function(){
            kanv = document.getElementById(global.kanvas.canvasId);
            var imgB = kanv.toDataURL("image/png");
            var serialForm = $("#advanced-wizard").serialize();
            var arguments = serialForm+"&file="+encodeURIComponent(imgB);
            deliver(arguments);
            console.log(global.request.response);
            // Run paypal
            if(global.form.idMetodoPago==1){
                document.getElementById('paypal_process').submit();
            } else {
                global.request.response = '';
                deliver_site(arguments, "success.php");
                window.location.href="success.php?token="+global.request.response;
            }
            NProgress.done();
        }, 550);
    },150);
} else {
    alert('Seleccione el método de pago ');
}

}

将画布转换为png，然后在我的网站上显示。

事情是有时候（避难所能够自己复制错误而客户说它只会发生＆＃34;有时候＆＃34;）他们的徽标不会在最终图像中呈现（文本和颜色）做）。徽标的空间只是空白。客户告诉我，在按下生成按钮之前，他们可以在画布上看到他们的徽标。

它似乎与操作系统或浏览器无关，因为同一台计算机有时会创建添加，有时没有徽标。我认为这是我的服务器，所以我改变并升级了托管，但它仍然发生了。

关于可能出现什么问题的任何想法？

画布中包含的图像不会出现在生成的图像上

0 个答案: