ClearRect не очищает холст при рисовании вертикальных линий
Я ударил по странному краевому корпусу что-то с холстом на работе. clearRect не очищает холст при рисовании вертикальных линий, которые идут сверху вниз на холст. При рендеринге других вещей clearRect отлично работает.
Я не уверен, что мне не хватает чего-то очевидного, если это преднамеренное поведение или ошибка браузера (маловероятно, так как поведение идентично в хроме, сафари, firefox и opera на mac).
Если это преднамеренное поведение, знает ли кто-нибудь его обоснование и/или может указывать на какую-то документацию?
Я сделал небольшой тестовый пример, который ясно показывает поведение, только комбинация clearRect/vertical lines не очищает холст:
http://jsfiddle.net/kZj6F/
Спасибо!
Ответы
Ответ 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 он будет с другими формами, если они добавлены в путь, и путь не был очищен.
