mirror of
https://github.com/sigmasternchen/combinationLockPG
synced 2025-03-15 03:38:53 +00:00
test file
This commit is contained in:
parent
55dfb45cf0
commit
a683144414
2 changed files with 61 additions and 0 deletions
52
lock.js
Normal file
52
lock.js
Normal file
|
@ -0,0 +1,52 @@
|
|||
var context;
|
||||
var main = function () {
|
||||
var canvas = document.getElementById("canvas");
|
||||
context = canvas.getContext('2d');
|
||||
drawLock();
|
||||
drawDial(0);
|
||||
}
|
||||
|
||||
var drawLock = function() {
|
||||
context.save();
|
||||
context.translate(100, 100);
|
||||
context.fillStyle = "#999";
|
||||
context.beginPath();
|
||||
context.arc(0, 0, 100, 0, 2 * Math.PI);
|
||||
context.closePath();
|
||||
context.fill();
|
||||
context.beginPath();
|
||||
context.moveTo(0, - 82);
|
||||
context.lineTo(- 6, - 95);
|
||||
context.lineTo(+ 6, - 95);
|
||||
context.closePath();
|
||||
context.stroke();
|
||||
context.restore();
|
||||
|
||||
}
|
||||
|
||||
var drawDial = function(rot) {
|
||||
context.save();
|
||||
context.translate(100, 100);
|
||||
context.rotate(rot)
|
||||
context.fillStyle = "#555";
|
||||
context.beginPath();
|
||||
context.arc(0, 0, 80, 0, 2 * Math.PI);
|
||||
context.closePath();
|
||||
context.fill();
|
||||
context.fillStyle = "#111";
|
||||
context.beginPath();
|
||||
context.arc(0, 0, 7, 0, 2 * Math.PI);
|
||||
context.closePath();
|
||||
context.fill();
|
||||
context.fillStyle = "#fff";
|
||||
var num = 32;
|
||||
for (var i = 0; i < num; i++) {
|
||||
context.beginPath();
|
||||
context.fillText(i, 72 * Math.cos(2 * Math.PI / num * i) - 7, 72 * Math.sin(2 * Math.PI / num * i) + 3);
|
||||
context.closePath();
|
||||
context.fill();
|
||||
}
|
||||
context.restore();
|
||||
}
|
||||
|
||||
window.onload = main;
|
9
test/index.html
Normal file
9
test/index.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<html>
|
||||
<head>
|
||||
<script src="../lock.js">
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="canvas" width="200px" height="200px" style="background-color: #fff;"></canvas>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue