Toggle navigation
☰
HTML
CSS
Scripting
Database
<!DOCTYPE html> <html> <body> <canvas id="dashCanvas" width="300" height="150" style="border:1px solid #d3d3d3;"></canvas> <script> var canvas = document.getElementById("dashCanvas"); var ctx = canvas.getContext("2d"); // Setting a dash pattern [dashLength, gapLength] ctx.setLineDash([10, 5]); ctx.lineWidth = 4; ctx.strokeStyle = "#0070C0"; ctx.beginPath(); ctx.moveTo(20, 50); ctx.lineTo(280, 50); ctx.stroke(); // Another dash pattern ctx.setLineDash([20, 5, 2, 5]); ctx.strokeStyle = "#FF8C00"; ctx.beginPath(); ctx.moveTo(20, 100); ctx.lineTo(280, 100); ctx.stroke(); </script> </body> </html>