Canvas is not showing up

I have a menu of buttons being displayed, and when I click on one of them, some operations happen and then a canvas with text should be displayed.

It happens that these operations all happen, but the generation of the canvas does not happen ... In the browser console no error is displayed.

In html my canvas looks like this:

<canvas class="canvasCentral" id="bordas" width="400" height="500">

</canvas>

The canvasCentral class of css: (The css file is being loaded into the html where it has this canvas.)

.canvasCentral{
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
        border:3px solid #D8D8D8;
        border-radius: 20px;
        display:block      //Isso aqui estava "none" para ser exibido somente quando eu quiser. tentei botar "block" mas a canvas continua não aparecendo.

}

THIS IS THE DRAWING FUNCTION: It is given a string as a parameter. When you perform this function, NOTHING HAPPENS, and the previous menu is still displayed. I checked display "none" in the div of this previous menu also to see. It disappears but the canvas still does not appear .... NOTE: THE SCRIPT THAT CONTAINS THIS FUNCTION IS PROPERLY LOADED IN THE CANVAS HTML:

   function formaCanvas(res){

        var arrayDaConta = [];


        var agencia="";
        var conta="";
        var saldo="";
        var nome = "";

        var valores = separaValores(res, agencia, conta, saldo, nome);


                var text = "Escrevendo no canvas";
                var moldura = document.getElementById("bordas");

                var ctx = moldura.getContext("2d");
                console.log(ctx);
                console.log("obteve as bordas e o contexto 2d");
                 //A FRASE ACIMA É EXIBIDA NA CONSOLE.... !!!!

                ctx.font = "12pt Arial";
                ctx.fillStyle = "black";
                ctx.textAlign = "center";
                var linhaInicial=30;
                ctx.fillText("SisOnBank - Sistema de Informações do OnBank", 200, linhaInicial);

                var linha = novaLinha(linhaInicial);
                linha = novaLinha(linha);
                ctx.textAlign = "center";
                ctx.fillText("Cliente: "+valores.nome, 200, linha);


                linha = novaLinha(linha);
                ctx.textAlign = "left";
                ctx.fillText("Agência: "+valores.agenciaPreenchida, 20, linha);

                ctx.textAlign = "rigth";
                ctx.fillText("Conta: "+valores.contaPreenchida, 380, linha);

                linha = novaLinha(linha);
                ctx.textAlign = "rigth";
                ctx.fillText("Saldo atual: " +valores.saldoPreenchido, 145, linha);

                linha = novaLinha(linha);


        }

    }

New helper function line:

function novaLinha(line){
            return line+18;
        }

Auxiliary function selectsValues: I do not think it influences the problem, it only returns a string

function separaValores(resultQuery, agencia, conta, saldo, nome){
        /* ESTE LAÇO SEPARA DA STRING DA QUERY VINDA DO PHP (RES)
    O NÚMERO DE AGÊNCIA, DA CONTA E O SALDO */

    var alfabetico = /\w/;
    for (var x=0; x<resultQuery.length; x++){
            //PEGA O NÚMERO DA AGÊNCIA
        if(agencia.length == 0){
            while(isNumero(resultQuery[x])){
                agencia = agencia.concat(resultQuery[x]);
                x++;
            }
        }

        //PEGA O NÚMERO DA CONTA
        if (resultQuery[x] == "," && conta.length==0 && agencia.length != 0){
            x++; x++;
            while(isNumero(resultQuery[x])){
                conta = conta.concat(resultQuery[x]);
                x++;
            }
        }

        //PEGA O SALDO
        if (resultQuery[x] == "," && conta.length != 0 && agencia.length != 0){
            x++;x++
            while(isNumero(resultQuery[x])){
                saldo = saldo.concat(resultQuery[x]);
                x++;
            }
        }

        if (alfabetico.test(resultQuery[x]) && conta.length != 0 && agencia.length != 0 && saldo.length !=0){
            while(resultQuery[x] != "\""){
                nome = nome.concat(resultQuery[x]);
                x++;
            }
        }
    }

I do not know what to do. Thanks in advance for the tips. ;)