Edit in JSFiddle

//define
var deputies = 460; //how many deputies
var radius = 450;
var x0 = 500;
var y0 = 500;
var rows = deputies/10; //how many rows
var maxInRow = 10; //max people in single row
var rowsAvoid = 4; //better not start from the center
var maxDepLoop = maxInRow + rowsAvoid;
var deputy = 1;

//background
var c = document.getElementById("parlament");
var context = c.getContext("2d");
context.beginPath();
context.arc(500, 480, 500, 0,  Math.PI);
context.fillStyle ="#eeeeee";
context.fill();
//title
context.font = 'normal 60pt Calibri';
context.textAlign = 'center';
context.fillStyle = "red";
context.fillText(deputies,500,560);
context.closePath();

for (j=0;j<rows;j++){
    for(i=rowsAvoid; i<maxDepLoop;i++){

        var x = x0 - ( i * (radius/(maxInRow+rowsAvoid-1)) * Math.cos( j * (Math.PI/(rows-1) ) ));
        var y = y0 + ( i * (radius/(maxInRow+rowsAvoid-1)) * Math.sin( j * (Math.PI/(rows-1) ) ));

		var radiusSingleDep = 4; // radius of single deputy

        context.beginPath();
        context.arc(x,y, radiusSingleDep, 0, 2 * Math.PI, true);

        var fillColor = "#ffffff";
        context.lineWidth = .1;
        if (deputy <= 235){
            fillColor = '#2635DA';
        } else if (deputy > 235 && deputy <= 373) {
            fillColor = '#23A721';
        } else if (deputy > 373 && deputy <= 415) {
            fillColor = '#DAD945';
        } else if (deputy > 415 && deputy <= 443) {
            fillColor = '#DF261C';
        } else if (deputy > 443 && deputy <= 459) {
            fillColor = '#000000';
        } else if (deputy > 459 && deputy <= 460) {
            fillColor = '#A77866';
        }
        context.fillStyle = fillColor;
        context.strokeStyle = '#000000';
        context.fill();
        context.stroke();
        context.closePath();
        deputy++;
    }
}

<canvas id="parlament" width="1000" height="1000" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>