Я пытаюсь построить Бифуркационную диаграмму , используя HTML canvas и JS.Вот мой инструмент .Проблема в том, что холст не отображает данные точно.
Вот сравнение того, как должна выглядеть диаграмма, и как она на самом деле отображается с моим кодом: 
А вот увеличенная областьфункции: 
Я прошел через набор данных, и, кажется, нет промежуточных значений.Таким образом, мой вопрос - почему браузер оставляет эти нежелательные следы между объектами, которые следует только рисовать?Больше похоже на диаграмму типа «соединить точки», чем на график дискретных точек данных.
Вот часть кода, которую я использую для рисования:
// ... get elements, calculate data, etc.
canvas.width = 800;
canvas.height = canvas.width / 2;
let xSpread = canvas.width / (rMax - rMin);
for (let i in chartData) {
let x = (i - rMin) * xSpread * scale;
for (let j in chartData[i]) {
let y = canvas.height - (chartData[i][j] * canvas.height * scale);
ctx.arc(x, y, pointSize, 0, 2 * Math.PI);
}
}
ctx.fillStyle = "#0a5e8c";
ctx.fill();
Спасибо зазаранее!