Любая альтернатива алгоритму круга Брезенхема, чтобы избежать перерисовки?

Я использую круговой алгоритм Брезенхэма. Но я заметил, как вы сами увидите, запустив приведенный ниже код, что этот алгоритм иногда отрисовывает один и тот же пиксель несколько раз.

Что я обычно делаю, так это анализирую все передние координаты, чтобы проверить, не были ли они уже нарисованы, чтобы избежать повторного рисования в одном и том же месте. Это работает, но я знаю, что это замедляет весь процесс.

Когда это будет сделано, у меня также возникнет другая проблема, когда я использую функцию drawLine(x1, y1, x2, y2) вместо putPixel(x, y), чтобы заполнить свой круг. Иногда сверху и снизу есть что-то вроде 3-х линий разной ширины с одной и той же координатой y. например, я получаю верхнюю первую строку координат

(20, 10, 24, 10)

потом вторая строчка

(21, 10, 23, 10)

и третий

(22, 10, 22, 10) (простой пиксель)

Любая подсказка (ы), как я могу решить эти проблемы?

function circleBres(xc,  yc, r)
{
    var x = 0, y = r;
    var d = 3 - 2 * r;
    var coords = [];
    while (y >= x)
    {
        coords = drawCircle(xc, yc, x, y, coords);
        x++;
        if (d > 0)
        {
            y--; 
            d = d + 4 * (x - y) + 10;
        }
        else
            d = d + 4 * x + 6;
    }
    nbOccurs(coords);
}

function drawCircle(xc, yc, x, y, coords)
{
    coords = addCoords(xc+x, yc+y, coords);
    coords = addCoords(xc-x, yc+y, coords);
    coords = addCoords(xc+x, yc-y, coords);
    coords = addCoords(xc-x, yc-y, coords);
    coords = addCoords(xc+y, yc+x, coords);
    coords = addCoords(xc-y, yc+x, coords);
    coords = addCoords(xc+y, yc-x, coords);
    coords = addCoords(xc-y, yc-x, coords);
    return (coords)
}

function addCoords(x, y, coords)
{
	coords.push({x:x, y:y, parsed: false});
	return (coords)
}

function nbOccurs(coords)
{
	var i = 0
  var results = [];
	while(i < coords.length)
  {
  	var nbOccur = 1;
  	var j = 0;
    while (j < coords.length)
    {
    	while (coords[j].parsed && j < coords.length - 1)
      	j++;
   		if (coords[i].x === coords[j].x && coords[i].y && coords[j].y)
      {
      	nbOccur++;
        coords[j].parsed = true;
      }
      j++;
    }
    
    if (nbOccur == 1)
      console.log("x:" + coords[i].x + " " + "y:" + coords[i].y + " is drawn " + nbOccur + " time");
    else
          console.log("x:" + coords[i].x + " " + "y:" + coords[i].y + " is drawn " + nbOccur + " times");
    i++;
  }
}

circleBres(50,  50, 25);


javascript algorithm graphics fabricjs bresenham
person JSmith    schedule 16.07.2018    source источник
comment
Я не знаю алгоритма, но одна идея состоит в том, чтобы сгруппировать ваши координаты по-разному, что-то вроде var coords = [ [ ] ]; , и тогда у вас должно быть coords[x][y] = value; Когда вы проверите, была ли линия уже нарисована, у вас будет просто if (coords[x][y] == value) *line already drew *   -  person lessan    schedule 16.07.2018
comment
Это один из способов осмысления проблемы. это означает, что для круга радиусом 50 нужно выделить массив 100 * 100. Я подумаю об этом, но это не решит мою вторую проблему. Спасибо, в любом случае, это хорошая точка зрения   -  person JSmith    schedule 16.07.2018
comment
Я ответил на это в 3D здесь: .com/questions/41656006/how-to-rasterize-a-sphere/   -  person Matt Timmermans    schedule 16.07.2018
comment
Привет, Мэтт. Я был бы рад, если бы вы ответили на вопрос о 2D. Кроме того, вы получите больше очков репутации, если ответите правильно. Я не очень хорош в математике, поэтому 2D для меня сложно, а 3D еще хуже. Спасибо за понимание.   -  person JSmith    schedule 16.07.2018
comment
Вы вызываете coords = drawCircle(xc, yc, x, y, coords); дважды за цикл!   -  person Yves Daoust    schedule 16.07.2018
comment
@YvesDaoust, но вы совершенно правы, я только что удалил строку. Я должен был определенно заметить это раньше. Спасибо еще раз   -  person JSmith    schedule 16.07.2018