&lt;!DOCTYPE html&gt;<br/><br/>&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;<br/>&lt;head&gt;<br/>    &lt;title&gt;Your Canvas&lt;/title&gt;<br/><br/>    &lt;style type=&quot;text/css&quot;&gt;&lt;!--<br/>      #container { position: relative; }<br/>      #imageTemp { position: absolute; top: 1px; left: 1px; }<br/>    --&gt;&lt;/style&gt;<br/>        <br/>&lt;/head&gt;<br/>&lt;body&gt;  <br/>        &lt;canvas id=&quot;imageView&quot; width=&quot;600&quot; height=&quot;500&quot;&gt;&lt;/canvas&gt;<br/>            <br/>        &lt;script type=&quot;text/javascript&quot;&gt;<br/>var canvas, context, canvaso, contexto;<br/>canvaso = document.getElementById('imageView');<br/>context = canvaso.getContext('2d');<br/>context.lineWidth = 5;<br/><br/>context.strokeStyle = '#000000';<br/>context.save();<br/>context.translate(21, 24);<br/>context.scale(1, 1);<br/>context.beginPath();<br/>context.arc(0, 0, 11, 0, 6.283185307179586, false);<br/>context.stroke();<br/>context.closePath();<br/>context.restore();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(29, 13);<br/><br/>context.lineTo(29, 13);<br/>context.stroke();<br/><br/>context.lineTo(29, 12);<br/>context.stroke();<br/><br/>context.lineTo(30, 12);<br/>context.stroke();<br/><br/>context.lineTo(30, 12);<br/>context.stroke();<br/><br/>context.lineTo(30, 12);<br/>context.stroke();<br/><br/>context.lineTo(31, 11);<br/>context.stroke();<br/><br/>context.lineTo(32, 10);<br/>context.stroke();<br/><br/>context.lineTo(33, 9);<br/>context.stroke();<br/><br/>context.lineTo(33, 8);<br/>context.stroke();<br/><br/>context.lineTo(34, 7);<br/>context.stroke();<br/><br/>context.lineTo(34, 7);<br/>context.stroke();<br/><br/>context.lineTo(34, 7);<br/>context.stroke();<br/><br/>context.lineTo(34, 7);<br/>context.stroke();<br/><br/>context.lineTo(35, 7);<br/>context.stroke();<br/><br/>context.lineTo(35, 6);<br/>context.stroke();<br/><br/>context.lineTo(35, 6);<br/>context.stroke();<br/><br/>context.lineTo(35, 6);<br/>context.stroke();<br/><br/>context.lineTo(36, 6);<br/>context.stroke();<br/><br/>context.lineTo(36, 6);<br/>context.stroke();<br/><br/>context.lineTo(36, 5);<br/>context.stroke();<br/><br/>context.lineTo(36, 5);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(33, 19);<br/><br/>context.lineTo(33, 19);<br/>context.stroke();<br/><br/>context.lineTo(33, 19);<br/>context.stroke();<br/><br/>context.lineTo(34, 19);<br/>context.stroke();<br/><br/>context.lineTo(35, 18);<br/>context.stroke();<br/><br/>context.lineTo(36, 18);<br/>context.stroke();<br/><br/>context.lineTo(36, 18);<br/>context.stroke();<br/><br/>context.lineTo(37, 18);<br/>context.stroke();<br/><br/>context.lineTo(38, 17);<br/>context.stroke();<br/><br/>context.lineTo(38, 17);<br/>context.stroke();<br/><br/>context.lineTo(38, 17);<br/>context.stroke();<br/><br/>context.lineTo(39, 17);<br/>context.stroke();<br/><br/>context.lineTo(39, 17);<br/>context.stroke();<br/><br/>context.lineTo(40, 17);<br/>context.stroke();<br/><br/>context.lineTo(41, 17);<br/>context.stroke();<br/><br/>context.lineTo(42, 16);<br/>context.stroke();<br/><br/>context.lineTo(42, 16);<br/>context.stroke();<br/><br/>context.lineTo(42, 16);<br/>context.stroke();<br/><br/>context.lineTo(42, 16);<br/>context.stroke();<br/><br/>context.lineTo(43, 16);<br/>context.stroke();<br/><br/>context.lineTo(43, 16);<br/>context.stroke();<br/><br/>context.lineTo(43, 16);<br/>context.stroke();<br/><br/>context.lineTo(43, 16);<br/>context.stroke();<br/><br/>context.lineTo(43, 16);<br/>context.stroke();<br/><br/>context.lineTo(44, 16);<br/>context.stroke();<br/><br/>context.lineTo(44, 16);<br/>context.stroke();<br/><br/>context.lineTo(44, 16);<br/>context.stroke();<br/><br/>context.lineTo(44, 16);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(32, 28);<br/><br/>context.lineTo(32, 28);<br/>context.stroke();<br/><br/>context.lineTo(33, 28);<br/>context.stroke();<br/><br/>context.lineTo(34, 29);<br/>context.stroke();<br/><br/>context.lineTo(35, 29);<br/>context.stroke();<br/><br/>context.lineTo(35, 29);<br/>context.stroke();<br/><br/>context.lineTo(36, 29);<br/>context.stroke();<br/><br/>context.lineTo(36, 30);<br/>context.stroke();<br/><br/>context.lineTo(37, 30);<br/>context.stroke();<br/><br/>context.lineTo(37, 30);<br/>context.stroke();<br/><br/>context.lineTo(38, 30);<br/>context.stroke();<br/><br/>context.lineTo(39, 30);<br/>context.stroke();<br/><br/>context.lineTo(39, 30);<br/>context.stroke();<br/><br/>context.lineTo(40, 30);<br/>context.stroke();<br/><br/>context.lineTo(40, 31);<br/>context.stroke();<br/><br/>context.lineTo(40, 31);<br/>context.stroke();<br/><br/>context.lineTo(41, 31);<br/>context.stroke();<br/><br/>context.lineTo(41, 31);<br/>context.stroke();<br/><br/>context.lineTo(41, 32);<br/>context.stroke();<br/><br/>context.lineTo(41, 32);<br/>context.stroke();<br/><br/>context.lineTo(42, 32);<br/>context.stroke();<br/><br/>context.lineTo(42, 32);<br/>context.stroke();<br/><br/>context.lineTo(42, 32);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(27, 35);<br/><br/>context.lineTo(27, 35);<br/>context.stroke();<br/><br/>context.lineTo(27, 37);<br/>context.stroke();<br/><br/>context.lineTo(27, 37);<br/>context.stroke();<br/><br/>context.lineTo(27, 38);<br/>context.stroke();<br/><br/>context.lineTo(27, 39);<br/>context.stroke();<br/><br/>context.lineTo(27, 39);<br/>context.stroke();<br/><br/>context.lineTo(27, 40);<br/>context.stroke();<br/><br/>context.lineTo(27, 40);<br/>context.stroke();<br/><br/>context.lineTo(27, 40);<br/>context.stroke();<br/><br/>context.lineTo(27, 41);<br/>context.stroke();<br/><br/>context.lineTo(27, 41);<br/>context.stroke();<br/><br/>context.lineTo(27, 42);<br/>context.stroke();<br/><br/>context.lineTo(27, 43);<br/>context.stroke();<br/><br/>context.lineTo(27, 43);<br/>context.stroke();<br/><br/>context.lineTo(27, 44);<br/>context.stroke();<br/><br/>context.lineTo(27, 44);<br/>context.stroke();<br/><br/>context.lineTo(27, 44);<br/>context.stroke();<br/><br/>context.lineTo(27, 45);<br/>context.stroke();<br/><br/>context.lineTo(27, 45);<br/>context.stroke();<br/><br/>context.lineTo(27, 45);<br/>context.stroke();<br/><br/>context.lineTo(27, 45);<br/>context.stroke();<br/><br/>context.lineTo(27, 45);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(16, 34);<br/><br/>context.lineTo(16, 34);<br/>context.stroke();<br/><br/>context.lineTo(16, 35);<br/>context.stroke();<br/><br/>context.lineTo(15, 36);<br/>context.stroke();<br/><br/>context.lineTo(15, 36);<br/>context.stroke();<br/><br/>context.lineTo(15, 36);<br/>context.stroke();<br/><br/>context.lineTo(14, 37);<br/>context.stroke();<br/><br/>context.lineTo(14, 37);<br/>context.stroke();<br/><br/>context.lineTo(14, 37);<br/>context.stroke();<br/><br/>context.lineTo(14, 37);<br/>context.stroke();<br/><br/>context.lineTo(14, 37);<br/>context.stroke();<br/><br/>context.lineTo(13, 38);<br/>context.stroke();<br/><br/>context.lineTo(13, 38);<br/>context.stroke();<br/><br/>context.lineTo(12, 38);<br/>context.stroke();<br/><br/>context.lineTo(12, 39);<br/>context.stroke();<br/><br/>context.lineTo(11, 39);<br/>context.stroke();<br/><br/>context.lineTo(11, 39);<br/>context.stroke();<br/><br/>context.lineTo(11, 40);<br/>context.stroke();<br/><br/>context.lineTo(10, 40);<br/>context.stroke();<br/><br/>context.lineTo(10, 40);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.lineTo(9, 41);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(8, 27);<br/><br/>context.lineTo(8, 27);<br/>context.stroke();<br/><br/>context.lineTo(7, 27);<br/>context.stroke();<br/><br/>context.lineTo(7, 27);<br/>context.stroke();<br/><br/>context.lineTo(6, 27);<br/>context.stroke();<br/><br/>context.lineTo(6, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(5, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(4, 27);<br/>context.stroke();<br/><br/>context.lineTo(3, 27);<br/>context.stroke();<br/><br/>context.lineTo(3, 27);<br/>context.stroke();<br/><br/>context.lineTo(3, 27);<br/>context.stroke();<br/><br/>context.lineTo(3, 27);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(10, 17);<br/><br/>context.lineTo(10, 17);<br/>context.stroke();<br/><br/>context.lineTo(9, 16);<br/>context.stroke();<br/><br/>context.lineTo(9, 16);<br/>context.stroke();<br/><br/>context.lineTo(9, 15);<br/>context.stroke();<br/><br/>context.lineTo(8, 15);<br/>context.stroke();<br/><br/>context.lineTo(7, 14);<br/>context.stroke();<br/><br/>context.lineTo(7, 14);<br/>context.stroke();<br/><br/>context.lineTo(7, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 13);<br/>context.stroke();<br/><br/>context.lineTo(6, 12);<br/>context.stroke();<br/><br/>context.lineTo(5, 12);<br/>context.stroke();<br/><br/>context.lineTo(5, 12);<br/>context.stroke();<br/><br/>context.lineTo(5, 12);<br/>context.stroke();<br/><br/>context.lineTo(5, 12);<br/>context.stroke();<br/><br/>context.lineTo(5, 12);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(19, 13);<br/><br/>context.lineTo(19, 13);<br/>context.stroke();<br/><br/>context.lineTo(19, 13);<br/>context.stroke();<br/><br/>context.lineTo(19, 13);<br/>context.stroke();<br/><br/>context.lineTo(19, 12);<br/>context.stroke();<br/><br/>context.lineTo(18, 12);<br/>context.stroke();<br/><br/>context.lineTo(18, 11);<br/>context.stroke();<br/><br/>context.lineTo(18, 11);<br/>context.stroke();<br/><br/>context.lineTo(18, 11);<br/>context.stroke();<br/><br/>context.lineTo(18, 10);<br/>context.stroke();<br/><br/>context.lineTo(18, 9);<br/>context.stroke();<br/><br/>context.lineTo(17, 8);<br/>context.stroke();<br/><br/>context.lineTo(17, 8);<br/>context.stroke();<br/><br/>context.lineTo(17, 8);<br/>context.stroke();<br/><br/>context.lineTo(17, 7);<br/>context.stroke();<br/><br/>context.lineTo(17, 7);<br/>context.stroke();<br/><br/>context.lineTo(17, 7);<br/>context.stroke();<br/><br/>context.lineTo(17, 6);<br/>context.stroke();<br/><br/>context.lineTo(17, 6);<br/>context.stroke();<br/><br/>context.lineTo(16, 6);<br/>context.stroke();<br/><br/>context.lineTo(16, 6);<br/>context.stroke();<br/><br/>context.lineTo(16, 5);<br/>context.stroke();<br/><br/>context.lineTo(16, 5);<br/>context.stroke();<br/><br/>context.lineTo(16, 5);<br/>context.stroke();<br/>        &lt;/script&gt;<br/>&lt;/body&gt;<br/>&lt;/html&gt;<br/>