Подтвердить что ты не робот

ClearRect не очищает холст при рисовании вертикальных линий

Я ударил по странному краевому корпусу что-то с холстом на работе. clearRect не очищает холст при рисовании вертикальных линий, которые идут сверху вниз на холст. При рендеринге других вещей clearRect отлично работает.

Я не уверен, что мне не хватает чего-то очевидного, если это преднамеренное поведение или ошибка браузера (маловероятно, так как поведение идентично в хроме, сафари, firefox и opera на mac). Если это преднамеренное поведение, знает ли кто-нибудь его обоснование и/или может указывать на какую-то документацию?

Я сделал небольшой тестовый пример, который ясно показывает поведение, только комбинация clearRect/vertical lines не очищает холст: http://jsfiddle.net/kZj6F/

Спасибо!

4b9b3361

ОТВЕТЫ

Ответ 1

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

Если вы переключитесь на точки и вернитесь к строкам с опцией clearRect, вы увидите, что последний arc добавлен к рисованному пути. Просто добавьте вызов ctx.beginPath(); до ctx.moveTo(randomX + 0.5, 0); ctx.lineTo(randomX + 0.5, canvas.height); и проблема будет решена.

Вы можете проверить http://jsfiddle.net/kZj6F/1/, чтобы увидеть, как он работает.

Bwt он будет с другими формами, если они добавлены в путь, и путь не был очищен.