JSFiddle - React, Tailwind, and code Playground

by ipeshev

JavaScript

function EuclidArea2D(opts){
    opts = opts || {};
    var self = this
        ,_ds = opts.dotSize || 10
        ,width=opts.width || 600
        ,height=opts.height || 480
        ,_pc = opts.color || 'blue';
    self.svg = false;
    function init(){
        var svg = d3.select("body").append("svg");
        svg.attr("width", width).attr("height", height)
        svg.style("border","1px solid black");
        self.svg = svg;
    };
    self.pP = function(x,y){
        rect = self.svg.append("rect");
        rect.attr("x",x*_ds).attr('y',y*_ds).
        attr('width',_ds).attr('height',_ds).
        attr('fill',_pc);        
    }
    init();
}
ea = new EuclidArea2D();
function LineRoundingMethod(x1,y1,x2,y2,area){
    var d,x,intY
        ,incX,n,reverse
        ,y,incY, //float
        dx=Math.abs(x1-x2),dy=Math.abs(y2-y1);
    if(reverse=(dx<dy)){
        d=x1;x1=y1;y1=d;
        d=x2;x2=y2;y2=d;
        d=dx;dx=dy;dy=d;
    }
    incX = (x1<=x2) ? 1 : -1 ;
    incY = dy/dx;
    x = x1;y=y1;n=dx+1;
    while(n--) {
        
        intY = Math.floor(y); 
        console.log(intY,x);
        if(reverse)
            area.pP(intY,x);
        else
            area.pP(x,intY);
        x+=incX;
        y+=incY;
    }
}
LineRoundingMethod(2,1,15,20,ea);
function LineBresemhamMethod(x1,y1,x2,y2,area){

}