Potencijal

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Naboj</title>
    </head>
    <body>
        <script>
            /*
            Osnove programiranja in Programiranje 1
            5. lab vaja
            Potencial točkastega naboja

            */

            function pokaziPotenciale(tabela, canvdim) {

                // Ustvarimo canvas in ga pripnemo k <body>. Rojec.
                var canv = document.createElement('canvas');
                canv.id = "polje";
                canv.width = canvdim;
                canv.height = canvdim;
                document.body.appendChild(canv);

                // Kunaver.
                var maxRow = tabela.map(function (row) {
                    return Math.max.apply(Math, row);
                });
                var max = Math.max.apply(null, maxRow);

                var minRow = tabela.map(function (row) {
                    return Math.min.apply(Math, row);
                });
                var min = Math.min.apply(null, minRow);

                var paleta = ["#E5000A", "#DF000E", "#D90113", "#D30117", "#CD021C", "#C70321", "#C10325", "#BB042A", "#B6042F", "#B00533", "#AA0638",
                    "#A4063D", "#9E0741", "#980846", "#92084A", "#8C094F", "#870954", "#810A58", "#7B0B5D", "#750B62", "#6F0C66", "#690C6B", "#630D70",
                    "#5D0E74", "#580E79", "#520F7E", "#4C1082", "#461087", "#40118B", "#3A1190", "#341295", "#2E1399", "#29139E", "#2314A3", "#1D14A7",
                    "#1715AC", "#1116B1", "#0B16B5", "#0517BA", "#0018BF"];

                kocka_size = 1;

                var korak = (paleta.length - 1) / (Math.log(max) - Math.log(min));

                var offset = -korak * Math.log(min);

                for (var i = 0; i < canvdim; i++) {
                    for (var j = 0; j < canvdim; j++) {
                        val = tabela[i][j];
                        m = korak * Math.log(val) + offset;
                        m = Math.round(m);
                        var c = document.getElementById("polje");
                        var ctx = c.getContext("2d");
                        //console.log(m);
                        ctx.fillStyle = paleta[m];
                        ctx.fillRect(j * kocka_size, i * kocka_size, kocka_size, kocka_size);
                    }
                }

                // Rojec.
                if(0){
                    // Izrisi legendo barv
                    var div = document.createElement('div');
                    div.innerHTML="Legenda barv:";
                    document.body.appendChild(div);

                    // Barve:
                    for(i=0; i<paleta.length; i++){
                    var div = document.createElement('div');
                    div.style = "background-color:"+paleta[i];
                    div.innerHTML=korak*i;
                    document.body.appendChild(div);
                    }
                }

            }
        const eps=8.854e-12;

        function razdalja(niza, x, y)
        {
            return Math.sqrt(Math.pow(niza[0]-x,2)+Math.pow(niza[1]-y,2));
        }

        function potencial(Q, R)
        {
            if(R==0) return Number.MAX_SAFE_INTEGER;
            return Q/(4*Math.PI*eps*R);
        }

        var tab=[];
        var dimtabele=400;
        var polozajNaboja=[0, 0];
        var Q=1;
        var i, j, x, y, r;
        for(i=0; i < dimtabele; i++)
        {
            tab[i]=[];
            y=(dimtabele/2-i)/dimtabele;
            for(j=0; j < dimtabele; j++)
            {
                x=(-dimtabele/2+j)/dimtabele;
                r=razdalja(polozajNaboja, x, y);
                tab[i][j]=potencial(Q, r);
            }

        }
        pokaziPotenciale(tab, dimtabele);


        </script>
    </body>
</html>