Menu
To draw a dashed line in a canvas context, I use this
var canvas = document.getElementById('canv');
ctx = canvas.getContext('2d');
ctx.setLineDash([5]);
When I don't want to draw more dashed lines I do this.
ctx.setLineDash([0]);
Removing the dashs works in desktop browsers, but this is not working in mobile Safari. Is there another way to remove the dashes and draw plain continious solid lines?
Thanks
950
You can pass empty array. It also makes line solid.
ctx.setLineDash([])
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
ctx.setLineDash([5, 3]);
ctx.strokeRect(20, 20, 150, 100);
button.onclick = () => {
ctx.clearRect(15, 15, 200, 200);
ctx.setLineDash([]);
ctx.strokeRect(20, 20, 150, 100);
}<!DOCTYPE html>
<html>
<body>
<button id='button'>Unset Dashed Line</button><br>
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>
</body>
</html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
