Почему canvas в Chrome показывает выделенные края Path2D?

#javascript #google-chrome #html5-canvas

Вопрос:

Я работал над созданием красивых многослойных прозрачных графиков на html5 canvas и столкнулся с досадной ошибкой Chrome only. Он выделяет края линейных участков каждого графика, создавая уродливые вертикальные линии. Смотрите изображение ниже:

Код, рисующий эти линии, является:

 var graphs = // [[points...],[points...],...]
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
canvas.width = 926;
canvas.height = 418;

ctx.lineWidth = 1;
ctx.strokeStyle = "rgba(155,155,255, .3)"

for(var j = 0; j < graphs.length; j  ) {
  var graph = graphs[j]

  var path = new Path2D()

  for(var i = 0; i < graph.length; i = i   2) {
    // i = x, i 1 = y
    if(i === 0) 
      path.moveTo(graph[i], graph[i 1])
    else 
      path.lineTo(graph[i], graph[i 1])
  }

  ctx.stroke(path);  
}

Codepen: смотрите рабочий пример

Это работает в Firefox, Safari, Edge. Не работает в Chrome как на Mac, так и на Windows.

Есть идеи, что вызывает это???

Ответ №1:

Действительно, интересная ошибка, возможно, вы захотите открыть проблему в их багтрекере.

В качестве обходного пути вы можете просто немного изменить ширину линии на 1.1, и ошибка сглаживания исчезнет:

 function draw(graphs) {
  var canvas = document.getElementById('canvas');
  var ctx = canvas.getContext('2d');
  canvas.width = 926;
  canvas.height = 418;

  ctx.lineWidth = 1.1;
  ctx.strokeStyle = "rgba(155,155,255, .3)"

  for (var j = 0; j < graphs.length; j  ) {
    var graph = graphs[j]

    var path = new Path2D()

    for (var i = 0; i < graph.length; i = i   2) {
      // i = x, i 1 = y
      if (i === 0)
        path.moveTo(graph[i], graph[i   1])
      else
        path.lineTo(graph[i], graph[i   1])
    }

    ctx.stroke(path);
  }
}

//reduced the dataset so it can fit in the answer
draw([[0,310,7,301,15,290,23,279,31,269,39,258,47,247,54,236,62,226,70,216,78,206,86,197,94,189,102,181,109,174,117,168,125,163,133,159,141,156,149,154,156,152,164,151,172,150,180,149,188,148,196,146,204,144,211,143,219,141,227,139,235,137,243,136,251,135,258,134,266,134,274,134,282,134,290,134,298,134,306,133,313,132,321,131,329,129,337,128,345,127,353,127,360,128,368,130,376,133,384,135,392,136,400,136,408,134,415,131,423,128,431,126,439,124,447,122,455,121,462],[0,335,7,323,15,311,23,298,31,285,39,273,47,262,54,250,62,240,70,230,78,220,86,211,94,203,102,195,109,189,117,183,125,179,133,175,141,172,149,168,156,164,164,159,172,152,180,145,188,139,196,133,204,128,211,124,219,121,227,119,235,117,243,115,251,113,258,112,266,110,274,108,282,107,290,105,298,104,306,104,313,104,321,105,329,106,337,107,345,109,353,110,360,110,368,109,376,109,384,109,392,108,400,107,408,107,415,108,423,106,431,105,439,105,447,105,455,106,462],[0,200,7,194,15,187,23,180,31,173,39,166,47,158,54,151,62,144,70,137,78,130,86,122,94,115,102,107,109,100,117,93,125,87,133,81,141,76,149,71,156,68,164,66,172,64,180,64,188,64,196,66,204,68,211,72,219,75,227,80,235,84,243,88,251,92,258,96,266,99,274,102,282,106,290,109,298,114,306,118,313,123,321,127,329,131,337,134,345,135,353,135,360,135,368,134,376,133,384,132,392,132,400,132,408,132,415,132,423,132,431,130,439,128,447,124,455,122,462],[0,149,7,142,15,135,23,127,31,120,39,114,47,107,54,101,62,95,70,89,78,84,86,79,94,75,102,71,109,67,117,64,125,61,133,59,141,58,149,57,156,56,164,56,172,57,180,59,188,61,196,64,204,67,211,70,219,74,227,77,235,80,243,82,251,85,258,88,266,90,274,93,282,95,290,98,298,100,306,102,313,105,321,108,329,111,337,115,345,119,353,121,360,122,368,122,376,122,384,121,392,120,400,118,408,118,415,118,423,118,431,118,439,118,447,119,455,119,462],[0,165,7,158,15,150,23,142,31,134,39,126,47,119,54,112,62,105,70,99,78,92,86,87,94,82,102,78,109,74,117,72,125,71,133,70,141,71,149,72,156,74,164,77,172,80,180,84,188,87,196,90,204,92,211,94,219,96,227,98,235,101,243,104,251,108,258,112,266,116,274,120,282,123,290,123,298,123,306,121,313,119,321,118,329,118,337,120,345,122,353,125,360,127,368,129,376,130,384,130,392,129,400,128,408,128,415,129,423,131,431,134,439,138,447,142,455,143,462],[0,156,7,148,15,140,23,132,31,125,39,118,47,111,54,105,62,99,70,94,78,89,86,86,94,83,102,80,109,79,117,79,125,80,133,82,141,84,149,87,156,91,164,94,172,97,180,101,188,104,196,108,204,113,211,119,219,126,227,134,235,142,243,149,251,152,258,151,266,148,274,143,282,139,290,136,298,133,306,131,313,130,321,129,329,128,337,126,345,125,353,123,360,121,368,120,376,120,384,120,392,120,400,121,408,121,415,120,423,119,431,117,439,115,447,112,455,110,462],[0,197,7,190,15,183,23,175,31,168,39,161,47,153,54,146,62,139,70,132,78,125,86,119,94,113,102,107,109,102,117,97,125,94,133,91,141,88,149,87,156,86,164,86,172,86,180,86,188,86,196,86,204,85,211,84,219,83,227,83,235,83,243,84,251,87,258,90,266,94,274,99,282,103,290,107,298,109,306,109,313,109,321,107,329,105,337,104,345,103,353,102,360,102,368,103,376,104,384,106,392,109,400,112,408,113,415,114,423,115,431,115,439,113,447,112,455,112,462],[0,187,7,179,15,170,23,161,31,152,39,143,47,134,54,125,62,117,70,110,78,102,86,95,94,89,102,83,109,78,117,74,125,70,133,68,141,66,149,65,156,65,164,67,172,69,180,73,188,77,196,83,204,90,211,97,219,104,227,110,235,115,243,117,251,118,258,117,266,116,274,116,282,115,290,116,298,116,306,116,313,116,321,116,329,116,337,115,345,115,353,114,360,113,368,111,376,110,384,108,392,104,400,101,408,98,415,97,423,95,431,94,439,94,447,95,455,95,462],[0,89,7,83,15,77,23,71,31,66,39,61,47,56,54,52,62,48,70,46,78,43,86,42,94,41,102,41,109,42,117,44,125,47,133,52,141,57,149,63,156,70,164,77,172,84,180,91,188,97,196,102,204,107,211,111,219,115,227,118,235,120,243,123,251,127,258,130,266,134,274,139,282,144,290,149,298,153,306,156,313,157,321,157,329,156,337,154,345,153,353,152,360,151,368,150,376,147,384,142,392,137,400,132,408,128,415,125,423,122,431,120,439,118,447,117,455,115,462],[0,136,7,129,15,122,23,115,31,107,39,100,47,93,54,86,62,80,70,74,78,68,86,63,94,59,102,55,109,52,117,50,125,49,133,50,141,52,149,55,156,59,164,65,172,71,180,78,188,85,196,90,204,93,211,94,219,94,227,93,235,92,243,92,251,93,258,95,266,98,274,102,282,106,290,111,298,116,306,121,313,125,321,129,329,131,337,132,345,132,353,132,360,131,368,129,376,127,384,126,392,125,400,124,408,124,415,125,423,126,431,126,439,125,447,121,455,115,462],[0,164,7,155,15,146,23,136,31,127,39,118,47,109,54,101,62,93,70,86,78,79,86,73,94,68,102,63,109,59,117,57,125,56,133,55,141,56,149,59,156,62,164,67,172,72,180,78,188,85,196,91,204,97,211,103,219,109,227,114,235,118,243,121,251,123,258,123,266,123,274,123,282,123,290,124,298,125,306,124,313,122,321,118,329,113,337,108,345,105,353,103,360,104,368,106,376,111,384,118,392,126,400,133,408,137,415,139,423,136,431,132,439,128,447,126,455,124,462],[0,123,7,117,15,109,23,102,31,96,39,89,47,83,54,78,62,73,70,69,78,66,86,63,94,61,102,60,109,60,117,61,125,63,133,66,141,71,149,76,156,83,164,90,172,96,180,103,188,108,196,112,204,116,211,118,219,121,227,123,235,125,243,128,251,130,258,133,266,136,274,140,282,144,290,149,298,155,306,160,313,165,321,168,329,167,337,164,345,158,353,151,360,143,368,135,376,129,384,125,392,121,400,119,408,119,415,118,423,117,431,114,439,112,447,109,455,105,462],[0,325,7,317,15,308,23,299,31,288,39,276,47,264,54,251,62,237,70,223,78,209,86,195,94,180,102,167,109,153,117,141,125,129,133,119,141,109,149,101,156,95,164,90,172,85,180,82,188,80,196,79,204,78,211,79,219,80,227,82,235,85,243,89,251,94,258,100,266,106,274,111,282,114,290,115,298,114,306,112,313,111,321,110,329,109,337,110,345,112,353,114,360,116,368,116,376,115,384,112,392,108,400,104,408,102,415,100,423,99,431,98,439,98,447,99,455,99,462],[0,261,7,258,15,255,23,252,31,249,39,246,47,243,54,240,62,237,70,234,78,230,86,226,94,221,102,215,109,209,117,202,125,195,133,187,141,179,149,171,156,163,164,155,172,146,180,138,188,130,196,122,204,115,211,109,219,104,227,100,235,98,243,97,251,97,258,98,266,99,274,100,282,100,290,98,298,95,306,92,313,90,321,89,329,90,337,93,345,97,353,103,360,109,368,113,376,115,384,112,392,108,400,103,408,99,415,95,423,92,431,88,439,85,447,83,455,80,462],[0,240,7,235,15,229,23,224,31,218,39,213,47,207,54,202,62,197,70,192,78,187,86,182,94,177,102,171,109,166,117,159,125,153,133,147,141,140,149,135,156,130,164,126,172,123,180,121,188,120,196,118,204,115,211,112,219,109,227,105,235,100,243,96,251,93,258,91,266,91,274,91,282,93,290,97,298,101,306,106,313,111,321,114,329,117,337,117,345,118,353,118,360,118,368,118,376,119,384,121,392,121,400,122,408,124,415,126,423,127,431,127,439,127,447,127,455,125,462],[0,263,7,257,15,251,23,244,31,238,39,232,47,226,54,220,62,215,70,210,78,205,86,199,94,194,102,188,109,181,117,173,125,164,133,153,141,143,149,133,156,124,164,116,172,109,180,104,188,101,196,99,204,99,211,99,219,101,227,103,235,104,243,106,251,107,258,107,266,107,274,106,282,106,290,106,298,107,306,108,313,109,321,110,329,111,337,113,345,115,353,117,360,119,368,122,376,125,384,128,392,130,400,132,408,132,415,130,423,128,431,125,439,121,447,117,455,114,462],[0,380,7,370,15,360,23,348,31,334,39,320,47,305,54,289,62,274,70,260,78,245,86,231,94,217,102,205,109,193,117,182,125,172,133,164,141,156,149,149,156,143,164,139,172,135,180,131,188,129,196,126,204,124,211,122,219,120,227,119,235,118,243,119,251,120,258,122,266,124,274,126,282,126,290,126,298,125,306,124,313,124,321,124,329,125,337,126,345,127,353,128,360,128,368,128,376,127,384,126,392,124,400,123,408,121,415,119,423,116,431,113,439,110,447,107,455,104,462],[0,237,7,230,15,223,23,215,31,207,39,200,47,192,54,184,62,176,70,169,78,162,86,154,94,147,102,140,109,134,117,128,125,123,133,118,141,114,149,110,156,107,164,105,172,102,180,100,188,98,196,96,204,94,211,92,219,90,227,89,235,87,243,85,251,83,258,81,266,80,274,80,282,81,290,82,298,85,306,88,313,92,321,97,329,101,337,106,345,110,353,114,360,117,368,120,376,122,384,124,392,125,400,126,408,126,415,127,423,127,431,127,439,127,447,126,455,125,462],[0,217,7,210,15,202,23,195,31,187,39,180,47,173,54,166,62,159,70,153,78,146,86,140,94,135,102,130,109,125,117,121,125,118,133,114,141,112,149,109,156,106,164,104,172,102,180,99,188,98,196,96,204,95,211,95,219,94,227,94,235,94,243,93,251,93,258,93,266,93,274,94,282,95,290,96,298,97,306,99,313,100,321,102,329,104,337,107,345,110,353,113,360,115,368,115,376,115,384,113,392,112,400,110,408,110,415,110,423,110,431,110,439,110,447,110,455,109,462],[0,256,7,248,15,239,23,230,31,221,39,212,47,204,54,196,62,188,70,181,78,173,86,167,94,160,102,155,109,150,117,145,125,141,133,137,141,134,149,131,156,128,164,125,172,121,180,118,188,116,196,113,204,111,211,109,219,109,227,109,235,110,243,112,251,115,258,119,266,123,274,127,282,131,290,134,298,134,306,133,313,130,321,126,329,122,337,118,345,115,353,113,360,111,368,109,376,108,384,107,392,106,400,104,408,102,415,99,423,95,431,91,439,88,447,87,455,86,462],[0,292,7,288,15,284,23,280,31,276,39,273,47,269,54,265,62,262,70,258,78,254,86,250,94,246,102,241,109,235,117,229,125,222,133,215,141,208,149,201,156,195,164,189,172,184,180,180,188,176,196,173,204,171,211,170,219,169,227,168,235,166,243,164,251,160,258,154,266,147,274,140,282,133,290,126,298,120,306,115,313,111,321,108,329,106,337,105,345,103,353,102,360,100,368,99,376,97,384,97,392,97,400,98,408,100,415,103,423,106,431,108,439,110,447,109,455,107,462],[0,195,7,190,15,184,23,178,31,173,39,168,47,162,54,157,62,152,70,148,78,143,86,139,94,135,102,132,109,128,117,125,125,123,133,120,141,118,149,116,156,114,164,112,172,110,180,107,188,104,196,101,204,98,211,96,219,93,227,91,235,88,243,85,251,81,258,78,266,75,274,73,282,72,290,73,298,76,306,79,313,83,321,87,329,92,337,95,345,99,353,101,360,104,368,108,376,111,384,114,392,117,400,119,408,121,415,123,423,125,431,128,439,130,447,133,455,134,462],[0,256,7,247,15,237,23,228,31,218,39,209,47,199,54,189,62,180,70,171,78,161,86,152,94,144,102,136,109,128,117,120,125,113,133,107,141,101,149,95,156,91,164,87,172,83,180,80,188,78,196,76,204,76,211,75,219,76,227,76,235,78,243,79,251,81,258,83,266,86,274,89,282,93,290,98,298,103,306,109,313,114,321,118,329,121,337,123,345,123,353,124,360,124,368,124,376,125,384,127,392,128,400,130,408,133,415,136,423,138,431,140,439,142,447,141,455,139,462],[0,234,7,224,15,214,23,203,31,193,39,183,47,173,54,163,62,154,70,145,78,137,86,129,94,121,102,115,109,109,117,104,125,100,133,97,141,95,149,94,156,93,164,93,172,93,180,93,188,94,196,94,204,93,211,93,219,92,227,91,235,90,243,88,251,87,258,86,266,85,274,84,282,85,290,86,298,88,306,91,313,94,321,98,329,101,337,105,345,108,353,110,360,113,368,115,376,118,384,121,392,125,400,128,408,131,415,133,423,135,431,136,439,136,447,136,455,134,462],[0,317,7,309,15,300,23,290,31,280,39,269,47,258,54,247,62,235,70,223,78,210,86,198,94,185,102,173,109,162,117,151,125,141,133,132,141,124,149,117,156,112,164,108,172,104,180,103,188,102,196,102,204,103,211,104,219,103,227,100,235,95,243,90,251,85,258,81,266,78,274,77,282,79,290,82,298,87,306,93,313,100,321,107,329,113,337,118,345,123,353,126,360,127,368,127,376,127,384,127,392,127,400,126,408,127,415,128,423,128,431,129,439,130,447,131,455,130,462],[0,285,7,277,15,269,23,260,31,252,39,243,47,235,54,226,62,218,70,210,78,203,86,195,94,187,102,181,109,174,117,168,125,163,133,157,141,152,149,145,156,137,164,129,172,119,180,109,188,100,196,93,204,87,211,83,219,81,227,81,235,83,243,86,251,90,258,95,266,98,274,100,282,101,290,101,298,101,306,101,313,104,321,108,329,112,337,116,345,120,353,124,360,125,368,125,376,125,384,124,392,124,400,124,408,125,415,126,423,124,431,120,439,115,447,110,455,104,462],[0,251,7,243,15,235,23,226,31,218,39,209,47,200,54,191,62,182,70,173,78,165,86,156,94,147,102,139,109,131,117,124,125,117,133,110,141,104,149,99,156,94,164,91,172,88,180,86,188,85,196,85,204,86,211,87,219,88,227,88,235,87,243,84,251,80,258,77,266,74,274,72,282,72,290,73,298,76,306,79,313,83,321,86,329,89,337,90,345,91,353,91,360,91,368,92,376,94,384,95,392,96,400,97,408,98,415,99,423,99,431,101,439,102,447,104,455,107,462],[0,187,7,181,15,174,23,167,31,161,39,154,47,148,54,142,62,136,70,130,78,125,86,120,94,115,102,111,109,108,117,105,125,102,133,101,141,100,149,99,156,99,164,99,172,100,180,101,188,101,196,102,204,102,211,102,219,103,227,103,235,104,243,105,251,106,258,107,266,108,274,108,282,108,290,108,298,107,306,106,313,106,321,106,329,106,337,108,345,109,353,110,360,111,368,111,376,112,384,112,392,112,400,112,408,112,415,111,423,108,431,105,439,100,447,96,455,92,462],[0,206,7,198,15,189,23,180,31,172,39,163,47,155,54,147,62,139,70,132,78,124,86,118,94,111,102,105,109,100,117,96,125,93,133,90,141,88,149,88,156,88,164,89,172,91,180,94,188,97,196,99,204,101,211,102,219,102,227,102,235,102,243,103,251,104,258,107,266,111,274,116,282,121,290,127,298,131,306,135,313,137,321,138,329,138,337,137,345,135,353,134,360,132,368,130,376,129,384,127,392,126,400,124,408,124,415,123,423,122,431,120,439,117,447,112,455,106,462],[0,285,7,275,15,265,23,255,31,245,39,235,47,226,54,216,62,207,70,198,78,189,86,180,94,172,102,164,109,157,117,151,125,144,133,139,141,134,149,129,156,125,164,122,172,119,180,117,188,115,196,113,204,110,211,108,219,104,227,101,235,98,243,96,251,95,258,95,266,96,274,99,282,102,290,104,298,104,306,103,313,100,321,96,329,93,337,90,345,89,353,89,360,89,368,91,376,94,384,98,392,101,400,102,408,103,415,102,423,101,431,98,439,97,447,96,455,96,462],[0,245,7,235,15,226,23,216,31,206,39,196,47,187,54,178,62,169,70,161,78,153,86,146,94,139,102,133,109,128,117,124,125,120,133,117,141,115,149,114,156,113,164,113,172,113,180,113,188,114,196,116,204,118,211,121,219,124,227,129,235,134,243,140,251,145,258,150,266,151,274,151,282,148,290,144,298,141,306,136,313,131,321,124,329,117,337,110,345,103,353,98,360,93,368,90,376,89,384,89,392,91,400,94,408,98,415,102,423,104,431,103,439,100,447,95,455,89,462],[0,205,7,199,15,192,23,184,31,178,39,171,47,164,54,158,62,152,70,146,78,140,86,135,94,130,102,125,109,121,117,117,125,114,133,112,141,110,149,108,156,107,164,106,172,105,180,104,188,103,196,102,204,101,211,100,219,99,227,98,235,99,243,100,251,103,258,105,266,108,274,110,282,111,290,109,298,105,306,99,313,92,321,85,329,81,337,77,345,75,353,75,360,78,368,81,376,85,384,90,392,96,400,100,408,101,415,99,423,97,431,95,439,93,447,91,455,92,462],[0,257,7,251,15,245,23,238,31,232,39,225,47,219,54,213,62,206,70,200,78,194,86,187,94,180,102,173,109,165,117,158,125,150,133,142,141,135,149,127,156,121,164,115,172,110,180,106,188,103,196,102,204,100,211,100,219,99,227,97,235,96,243,95,251,94,258,94,266,96,274,100,282,104,290,110,298,115,306,120,313,121,321,120,329,118,337,114,345,111,353,109,360,107,368,105,376,105,384,104,392,104,400,105,408,105,415,105,423,106,431,107,439,107,447,106,455,105,462],[0,301,7,293,15,285,23,277,31,269,39,261,47,253,54,245,62,238,70,230,78,223,86,216,94,210,102,203,109,197,117,192,125,186,133,181,141,176,149,171,156,166,164,161,172,157,180,153,188,149,196,147,204,145,211,144,219,144,227,145,235,147,243,149,251,152,258,155,266,157,274,156,282,153,290,148,298,144,306,139,313,136,321,133,329,131,337,129,345,128,353,126,360,124,368,121,376,118,384,113,392,110,400,107,408,104,415,103,423,103,431,103,439,103,447,102,455,101,462],[0,177,7,171,15,166,23,160,31,154,39,149,47,143,54,137,62,132,70,127,78,121,86,116,94,111,102,106,109,102,117,97,125,94,133,90,141,87,149,86,156,85,164,85,172,85,180,87,188,90,196,93,204,97,211,101,219,105,227,109,235,112,243,115,251,117,258,119,266,119,274,117,282,113,290,108,298,101,306,96,313,91,321,89,329,88,337,90,345,94,353,99,360,104,368,107,376,109,384,108,392,105,400,102,408,100,415,100,423,96,431,92,439,89,447,87,455,84,462],[0,228,7,221,15,214,23,207,31,200,39,192,47,185,54,178,62,170,70,163,78,156,86,149,94,141,102,135,109,128,117,122,125,116,133,110,141,105,149,100,156,96,164,93,172,90,180,87,188,86,196,86,204,86,211,88,219,90,227,92,235,95,243,98,251,101,258,102,266,103,274,104,282,104,290,104,298,105,306,106,313,107,321,108,329,109,337,111,345,111,353,112,360,112,368,113,376,113,384,113,392,113,400,114,408,114,415,114,423,113,431,112,439,110,447,107,455,105,462],[0,188,7,182,15,175,23,169,31,162,39,157,47,151,54,145,62,141,70,136,78,132,86,128,94,125,102,123,109,121,117,120,125,119,133,119,141,119,149,119,156,120,164,120,172,119,180,119,188,118,196,116,204,115,211,115,219,114,227,114,235,115,243,116,251,117,258,118,266,118,274,118,282,117,290,115,298,113,306,111,313,110,321,109,329,108,337,108,345,109,353,110,360,110,368,111,376,112,384,113,392,112,400,111,408,109,415,107,423,103,431,98,439,94,447,92,455,89,462],[0,178,7,171,15,163,23,155,31,148,39,140,47,133,54,126,62,119,70,113,78,107,86,102,94,97,102,93,109,90,117,87,125,86,133,85,141,85,149,87,156,89,164,91,172,95,180,98,188,101,196,104,204,106,211,108,219,111,227,113,235,115,243,118,251,119,258,120,266,119,274,116,282,113,290,109,298,106,306,104,313,102,321,100,329,99,337,99,345,99,353,99,360,99,368,100,376,102,384,103,392,105,400,107,408,110,415,112,423,113,431,114,439,113,447,111,455,109,462],[0,194,7,188,15,181,23,174,31,167,39,161,47,154,54,148,62,142,70,137,78,132,86,127,94,122,102,118,109,115,117,112,125,110,133,109,141,107,149,106,156,106,164,105,172,104,180,104,188,103,196,102,204,102,211,102,219,102,227,104,235,107,243,110,251,114,258,118,266,122,274,124,282,125,290,124,298,124,306,123,313,121,321,120,329,119,337,117,345,116,353,114,360,112,368,111,376,110,384,109,392,110,400,111,408,112,415,113,423,115,431,117,439,117,447,114,455,111,462],[0,151,7,145,15,139,23,133,31,127,39,122,47,117,54,111,62,107,70,103,78,99,86,95,94,92,102,90,109,88,117,87,125,87,133,87,141,88,149,89,156,91,164,93,172,95,180,97,188,97,196,97,204,95,211,91,219,88,227,84,235,82,243,80,251,79,258,80,266,81,274,83,282,84,290,86,298,87,306,87,313,88,321,88,329,89,337,89,345,89,353,90,360,90,368,92,376,94,384,96,392,99,400,103,408,106,415,110,423,112,431,114,439,116,447,118,455,119,462],[0,211,7,206,15,200,23,194,31,188,39,183,47,177,54,172,62,167,70,163,78,159,86,155,94,151,102,147,109,144,117,141,125,139,133,136,141,133,149,130,156,127,164,123,172,120,180,116,188,113,196,109,204,107,211,104,219,103,227,102,235,101,243,100,251,99,258,98,266,96,274,94,282,93,290,92,298,92,306,93,313,93,321,94,329,96,337,97,345,99,353,101,360,103,368,106,376,108,384,109,392,109,400,107,408,104,415,100,423,96,431,93,439,90,447,88,455,88,462],[0,224,7,218,15,211,23,205,31,199,39,192,47,186,54,180,62,174,70,168,78,162,86,156,94,150,102,144,109,138,117,131,125,125,133,119,141,113,149,108,156,103,164,99,172,97,180,95,188,94,196,94,204,94,211,94,219,95,227,96,235,96,243,97,251,99,258,100,266,102,274,103,282,104,290,105,298,105,306,105,313,106,321,107,329,109,337,112,345,116,353,120,360,126,368,130,376,133,384,135,392,135,400,133,408,131,415,129,423,127,431,126,439,125,447,123,455,123,462],[0,164,7,156,15,148,23,139,31,131,39,123,47,115,54,107,62,100,70,94,78,87,86,81,94,76,102,71,109,67,117,64,125,62,133,61,141,60,149,61,156,62,164,64,172,67,180,70,188,72,196,74,204,76,211,77,219,77,227,78,235,78,243,80,251,82,258,85,266,88,274,93,282,99,290,104,298,108,306,111,313,113,321,113,329,113,337,112,345,110,353,109,360,107,368,106,376,106,384,107,392,109,400,112,408,117,415,121,423,125,431,129,439,133,447,136,455,138,462]]);

 #canvas {
  background: #333;
  margin: 0 auto;
  display: block;
}

 <canvas id="canvas" />

Ответ №2:

Это вызвано использованием координат с плавающей запятой, MDN рекомендует избегать этого, вы можете устранить проблему, используя ширину строки с плавающей запятой, ctx.lineWidth = 1.5; .

1. На самом деле это не из-за плавающих координат. Вы можете проверить измененный набор данных в моем собственном ответе, где я округлил все координаты, и ошибка все еще там с шириной линии 1.

2. Имело бы смысл, что для этого нужна плавающая точка, поскольку она работает с 1.0000001.