Android-пикселизация холста HTML5

Question

У меня действительно странный эффект, происходящий на Android с использованием холста HTML5. Вот код, о котором идет речь, он использует это квадратичная кривая:

ctx.beginPath(); 
ctx.strokeStyle = wave.stroke; 
ctx.moveTo(wave.sx, wave.sy); 
ctx.quadraticCurveTo(
    wave.x, wave.y, 
    wave.ex, wave.ey 
); 
ctx.stroke(); 

И он обращает на себя несколько раз: http://codepen.io/EightArmsHQ/pen/9f899c4c64ab49113988055432b11a6b

Здесь находится на iPhone:

Но здесь он находится на Android:

Я говорю о Android, но я слышал, что это супер гладкое на Galaxy S6.

Как и в случае с примечанием, я не очень хорошо знаком с графикой (например, с графическим процессором и т. Д.), Поэтому немного уверен в том, какие условия я должен быть Google Googling - так что будьте осторожны, если у вас есть какие-либо очевидные решения.

Answer 1

Я верю, что вы видите aliasing artefacts. Кривая покрывает меньше, чем пиксель, и по какой-то причине растеризация может полностью пропустить некоторые из них. Это, по-видимому, явно при рисовании квадратичных кривых, когда линии и даже безьевы кажутся подходящими для меня, поэтому вы можете их аппроксимировать.