Skip to content

Instantly share code, notes, and snippets.

@xhackjp1
Created March 19, 2019 09:48
Show Gist options
  • Save xhackjp1/70c9c99ee33b8c5d1495b409d01849b9 to your computer and use it in GitHub Desktop.
Save xhackjp1/70c9c99ee33b8c5d1495b409d01849b9 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<style media="screen">
#myCanvas {
background: #fff;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="300" height="200"></canvas>
<script type="text/javascript">
function drawLine(startX, startY, endX, endY) {
var context = document.getElementById("myCanvas").getContext("2d");
context.globalCompositeOperation = 'lighter';
context.strokeStyle = "rgba(150, 150, 150, 0.2)"; // Red, Green, Blue, Alha
context.lineWidth = 2;
context.beginPath();
context.moveTo(startX, startY);
context.lineTo(endX, endY);
context.stroke();
}
drawLine(0, 0, 300, 200);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment