Canvas Clock Start


watch is a portable timepiece intended to be carried or worn by a person. It is designed to keep a consistent movement despite the motions caused by the person's activities. A wristwatch is designed to be worn around the wrist, attached by a watch strap or other type of bracelet, including metal bands, leather straps or any other kind of bracelet. A pocket watch is designed for a person to carry in a pocket, often attached to a chain.

Origins[edit]

Watches evolved from portable spring-driven clocks, which first appeared in 15th-century Europe. Watches were not widely worn in pockets until the 17th century. One account suggests that the word "watch" came from the Old English word woecce - which meant "watchman" - because town watchmen used the technology to keep track of their shifts at work.[14] Another says that the term came from 17th-century sailors, who used the new mechanisms to time the length of their shipboard watches (duty shifts).[15]

Evolution[edit]

Drawing of one of his first balance springs, attached to a balance wheel, by Christiaan Huygens, published in his letter in the Journal des Sçavants of 25 February 1675. The application of the spiral balance spring (spiral hairspring) for watches ushered in a new era of accuracy for portable timekeepers, similar to that which the pendulum had introduced for clocks in 1656.[16]

A rise in accuracy occurred in 1657 with the addition of the balance spring to the balance wheel, an invention disputed both at the time and ever since between Robert Hooke and Christiaan Huygens. This innovation increased watches' accuracy enormously, reducing error from perhaps several hours per day[17] to perhaps 10 minutes per day,[18] resulting in the addition of the minute hand to the face from around 1680 in Britain and around 1700 in France.[19]

The increased accuracy of the balance wheel focused attention on errors caused by other parts of the movement, igniting a two-century wave of watchmaking innovation. The first thing to be improved was the escapement. The verge escapement was replaced in quality watches by the cylinder escapement, invented by Thomas Tompion in 1695 and further developed by George Graham in the 1720s. Improvements in manufacturing - such as the tooth-cutting machine devised by Robert Hooke - allowed some increase in the volume of watch production, although finishing and assembling was still done by hand until well into the 19th century.

A major cause of error in balance-wheel timepieces, caused by changes in elasticity of the balance spring from temperature changes, was solved by the bimetallic temperature-compensated balance wheel invented in 1765 by Pierre Le Roy and improved by Thomas Earnshaw (1749-1829). The lever escapement, the single most important technological breakthrough, though invented by Thomas Mudge in 1759 and improved by Josiah Emery in 1785, only gradually came into use from about 1800 onwards, chiefly in Britain.

A watch drawn in Acta Eruditorum, 1737

The British predominated in watch manufacture for much of the 17th and 18th centuries, but maintained a system of production that was geared towards high-quality products for the élite.[20] Although the British Watch Company attempted to modernize clock manufacture with mass-production techniques and the application of duplicating tools and machinery in 1843, it was in the United States that this system took off. Aaron Lufkin Dennison started a factory in 1851 in Massachusetts that used interchangeable parts, and by 1861 a successful enterprise operated, incorporated as the Waltham Watch Company.[21]

Wristwatches[edit]


Part V - Start the Clock

To start the clock, call the drawClock function at intervals:

codes

 

<!DOCTYPE html>
<html>
<body>
    <link rel="stylesheet" href="mystyle.css">
    <h1>Ghanshyam tiwari project</h1>

<canvas id="canvas" width="400" height="400"
style="background-color:#333">
</canvas>
   
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90
setInterval(drawClock, 1000);

function drawClock() {
  drawFace(ctx, radius);
  drawNumbers(ctx, radius);
  drawTime(ctx, radius);
}

function drawFace(ctx, radius) {
  var grad;
  ctx.beginPath();
  ctx.arc(0, 0, radius, 0, 2*Math.PI);
  ctx.fillStyle = 'white';
  ctx.fill();
  grad = ctx.createRadialGradient(0,0,radius*0.95, 0,0,radius*1.05);
  grad.addColorStop(0, '#333');
  grad.addColorStop(0.5, 'white');
  grad.addColorStop(1, '#333');
  ctx.strokeStyle = grad;
  ctx.lineWidth = radius*0.1;
  ctx.stroke();
  ctx.beginPath();
  ctx.arc(0, 0, radius*0.1, 0, 2*Math.PI);
  ctx.fillStyle = '#333';
  ctx.fill();
}

function drawNumbers(ctx, radius) {
  var ang;
  var num;
  ctx.font = radius*0.15 + "px arial";
  ctx.textBaseline="middle";
  ctx.textAlign="center";
  for(num = 1; num < 13; num++){
    ang = num * Math.PI / 6;
    ctx.rotate(ang);
    ctx.translate(0, -radius*0.85);
    ctx.rotate(-ang);
    ctx.fillText(num.toString(), 0, 0);
    ctx.rotate(ang);
    ctx.translate(0, radius*0.85);
    ctx.rotate(-ang);
  }
}

function drawTime(ctx, radius){
    var now = new Date();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();
    //hour
    hour=hour%12;
    hour=(hour*Math.PI/6)+
    (minute*Math.PI/(6*60))+
    (second*Math.PI/(360*60));
    drawHand(ctx, hour, radius*0.5, radius*0.07);
    //minute
    minute=(minute*Math.PI/30)+(second*Math.PI/(30*60));
    drawHand(ctx, minute, radius*0.8, radius*0.07);
    // second
    second=(second*Math.PI/30);
    drawHand(ctx, second, radius*0.9, radius*0.02);
}

function drawHand(ctx, pos, length, width) {
    ctx.beginPath();
    ctx.lineWidth = width;
    ctx.lineCap = "round";
    ctx.moveTo(0,0);
    ctx.rotate(pos);
    ctx.lineTo(0, -length);
    ctx.stroke();
    ctx.rotate(-pos);
}
</script>

</body>
</html>



this is watch pic

this is  video



 

Post a Comment

0 Comments