&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.strokeRect(146, 173, 288, 163);<br/><br/>context.strokeStyle = '#000000';<br/>context.strokeRect(228, 15, 174, 156);<br/><br/>context.strokeStyle = '#FFFFFF';<br/>context.beginPath();<br/>context.moveTo(236, 172);<br/><br/>context.lineTo(237, 172);<br/>context.stroke();<br/><br/>context.lineTo(239, 172);<br/>context.stroke();<br/><br/>context.lineTo(244, 172);<br/>context.stroke();<br/><br/>context.lineTo(247, 172);<br/>context.stroke();<br/><br/>context.lineTo(251, 171);<br/>context.stroke();<br/><br/>context.lineTo(253, 171);<br/>context.stroke();<br/><br/>context.lineTo(258, 171);<br/>context.stroke();<br/><br/>context.lineTo(260, 171);<br/>context.stroke();<br/><br/>context.lineTo(261, 171);<br/>context.stroke();<br/><br/>context.lineTo(264, 171);<br/>context.stroke();<br/><br/>context.lineTo(265, 171);<br/>context.stroke();<br/><br/>context.lineTo(266, 171);<br/>context.stroke();<br/><br/>context.lineTo(268, 171);<br/>context.stroke();<br/><br/>context.lineTo(269, 171);<br/>context.stroke();<br/><br/>context.lineTo(270, 171);<br/>context.stroke();<br/><br/>context.lineTo(272, 172);<br/>context.stroke();<br/><br/>context.lineTo(273, 172);<br/>context.stroke();<br/><br/>context.lineTo(275, 172);<br/>context.stroke();<br/><br/>context.lineTo(276, 172);<br/>context.stroke();<br/><br/>context.lineTo(277, 172);<br/>context.stroke();<br/><br/>context.lineTo(279, 172);<br/>context.stroke();<br/><br/>context.lineTo(280, 172);<br/>context.stroke();<br/><br/>context.lineTo(281, 172);<br/>context.stroke();<br/><br/>context.lineTo(282, 172);<br/>context.stroke();<br/><br/>context.lineTo(284, 172);<br/>context.stroke();<br/><br/>context.lineTo(286, 173);<br/>context.stroke();<br/><br/>context.lineTo(291, 173);<br/>context.stroke();<br/><br/>context.lineTo(293, 173);<br/>context.stroke();<br/><br/>context.lineTo(294, 173);<br/>context.stroke();<br/><br/>context.lineTo(296, 173);<br/>context.stroke();<br/><br/>context.lineTo(297, 173);<br/>context.stroke();<br/><br/>context.lineTo(298, 173);<br/>context.stroke();<br/><br/>context.lineTo(300, 173);<br/>context.stroke();<br/><br/>context.lineTo(300, 174);<br/>context.stroke();<br/><br/>context.lineTo(299, 174);<br/>context.stroke();<br/><br/>context.lineTo(297, 174);<br/>context.stroke();<br/><br/>context.lineTo(294, 174);<br/>context.stroke();<br/><br/>context.lineTo(289, 174);<br/>context.stroke();<br/><br/>context.lineTo(285, 174);<br/>context.stroke();<br/><br/>context.lineTo(282, 174);<br/>context.stroke();<br/><br/>context.lineTo(278, 174);<br/>context.stroke();<br/><br/>context.lineTo(277, 174);<br/>context.stroke();<br/><br/>context.lineTo(274, 174);<br/>context.stroke();<br/><br/>context.lineTo(273, 174);<br/>context.stroke();<br/><br/>context.lineTo(271, 174);<br/>context.stroke();<br/><br/>context.lineTo(270, 175);<br/>context.stroke();<br/><br/>context.lineTo(269, 176);<br/>context.stroke();<br/><br/>context.lineTo(269, 176);<br/>context.stroke();<br/><br/>context.lineTo(268, 176);<br/>context.stroke();<br/><br/>context.lineTo(266, 177);<br/>context.stroke();<br/><br/>context.lineTo(265, 177);<br/>context.stroke();<br/><br/>context.lineTo(261, 178);<br/>context.stroke();<br/><br/>context.lineTo(258, 179);<br/>context.stroke();<br/><br/>context.lineTo(257, 179);<br/>context.stroke();<br/><br/>context.lineTo(256, 179);<br/>context.stroke();<br/><br/>context.lineTo(254, 179);<br/>context.stroke();<br/><br/>context.lineTo(253, 179);<br/>context.stroke();<br/><br/>context.lineTo(253, 179);<br/>context.stroke();<br/><br/>context.lineTo(252, 179);<br/>context.stroke();<br/><br/>context.lineTo(251, 179);<br/>context.stroke();<br/><br/>context.lineTo(250, 179);<br/>context.stroke();<br/><br/>context.lineTo(249, 179);<br/>context.stroke();<br/><br/>context.lineTo(249, 179);<br/>context.stroke();<br/><br/>context.lineTo(248, 179);<br/>context.stroke();<br/><br/>context.lineTo(247, 179);<br/>context.stroke();<br/><br/>context.lineTo(245, 178);<br/>context.stroke();<br/><br/>context.lineTo(243, 177);<br/>context.stroke();<br/><br/>context.lineTo(242, 176);<br/>context.stroke();<br/><br/>context.lineTo(241, 175);<br/>context.stroke();<br/><br/>context.lineTo(241, 173);<br/>context.stroke();<br/><br/>context.lineTo(240, 173);<br/>context.stroke();<br/><br/>context.lineTo(240, 171);<br/>context.stroke();<br/><br/>context.lineTo(240, 169);<br/>context.stroke();<br/><br/>context.lineTo(240, 167);<br/>context.stroke();<br/><br/>context.lineTo(240, 166);<br/>context.stroke();<br/><br/>context.lineTo(240, 164);<br/>context.stroke();<br/><br/>context.lineTo(240, 163);<br/>context.stroke();<br/><br/>context.lineTo(240, 162);<br/>context.stroke();<br/><br/>context.lineTo(240, 161);<br/>context.stroke();<br/><br/>context.lineTo(240, 161);<br/>context.stroke();<br/><br/>context.lineTo(241, 160);<br/>context.stroke();<br/><br/>context.lineTo(241, 159);<br/>context.stroke();<br/><br/>context.lineTo(241, 159);<br/>context.stroke();<br/><br/>context.lineTo(241, 158);<br/>context.stroke();<br/><br/>context.lineTo(241, 159);<br/>context.stroke();<br/><br/>context.lineTo(240, 163);<br/>context.stroke();<br/><br/>context.lineTo(237, 173);<br/>context.stroke();<br/><br/>context.lineTo(237, 178);<br/>context.stroke();<br/><br/>context.lineTo(236, 182);<br/>context.stroke();<br/><br/>context.lineTo(236, 186);<br/>context.stroke();<br/><br/>context.lineTo(235, 188);<br/>context.stroke();<br/><br/>context.lineTo(235, 189);<br/>context.stroke();<br/><br/>context.lineTo(235, 190);<br/>context.stroke();<br/><br/>context.lineTo(235, 191);<br/>context.stroke();<br/><br/>context.lineTo(235, 193);<br/>context.stroke();<br/><br/>context.lineTo(235, 194);<br/>context.stroke();<br/><br/>context.lineTo(235, 195);<br/>context.stroke();<br/><br/>context.lineTo(235, 196);<br/>context.stroke();<br/><br/>context.lineTo(236, 196);<br/>context.stroke();<br/><br/>context.lineTo(237, 196);<br/>context.stroke();<br/><br/>context.lineTo(237, 195);<br/>context.stroke();<br/><br/>context.lineTo(237, 195);<br/>context.stroke();<br/><br/>context.lineTo(239, 193);<br/>context.stroke();<br/><br/>context.lineTo(241, 190);<br/>context.stroke();<br/><br/>context.lineTo(242, 186);<br/>context.stroke();<br/><br/>context.lineTo(245, 182);<br/>context.stroke();<br/><br/>context.lineTo(247, 177);<br/>context.stroke();<br/><br/>context.lineTo(249, 176);<br/>context.stroke();<br/><br/>context.lineTo(249, 174);<br/>context.stroke();<br/><br/>context.lineTo(249, 173);<br/>context.stroke();<br/><br/>context.lineTo(250, 171);<br/>context.stroke();<br/><br/>context.lineTo(250, 170);<br/>context.stroke();<br/><br/>context.lineTo(250, 169);<br/>context.stroke();<br/><br/>context.lineTo(249, 169);<br/>context.stroke();<br/><br/>context.lineTo(249, 169);<br/>context.stroke();<br/><br/>context.lineTo(248, 169);<br/>context.stroke();<br/><br/>context.lineTo(247, 169);<br/>context.stroke();<br/><br/>context.lineTo(246, 168);<br/>context.stroke();<br/><br/>context.lineTo(245, 167);<br/>context.stroke();<br/><br/>context.lineTo(243, 166);<br/>context.stroke();<br/><br/>context.lineTo(241, 166);<br/>context.stroke();<br/><br/>context.lineTo(241, 165);<br/>context.stroke();<br/><br/>context.lineTo(240, 165);<br/>context.stroke();<br/><br/>context.lineTo(239, 165);<br/>context.stroke();<br/><br/>context.lineTo(238, 165);<br/>context.stroke();<br/><br/>context.lineTo(237, 165);<br/>context.stroke();<br/><br/>context.lineTo(238, 165);<br/>context.stroke();<br/><br/>context.lineTo(242, 165);<br/>context.stroke();<br/><br/>context.lineTo(253, 165);<br/>context.stroke();<br/><br/>context.lineTo(258, 165);<br/>context.stroke();<br/><br/>context.lineTo(264, 165);<br/>context.stroke();<br/><br/>context.lineTo(268, 165);<br/>context.stroke();<br/><br/>context.lineTo(271, 165);<br/>context.stroke();<br/><br/>context.lineTo(275, 165);<br/>context.stroke();<br/><br/>context.lineTo(277, 165);<br/>context.stroke();<br/><br/>context.lineTo(279, 165);<br/>context.stroke();<br/><br/>context.lineTo(281, 165);<br/>context.stroke();<br/><br/>context.lineTo(281, 165);<br/>context.stroke();<br/><br/>context.lineTo(274, 168);<br/>context.stroke();<br/><br/>context.lineTo(252, 179);<br/>context.stroke();<br/><br/>context.lineTo(244, 182);<br/>context.stroke();<br/><br/>context.lineTo(241, 184);<br/>context.stroke();<br/><br/>context.lineTo(241, 184);<br/>context.stroke();<br/><br/>context.lineTo(240, 185);<br/>context.stroke();<br/><br/>context.lineTo(241, 185);<br/>context.stroke();<br/><br/>context.lineTo(254, 180);<br/>context.stroke();<br/><br/>context.lineTo(265, 173);<br/>context.stroke();<br/><br/>context.lineTo(273, 169);<br/>context.stroke();<br/><br/>context.lineTo(281, 165);<br/>context.stroke();<br/><br/>context.lineTo(283, 164);<br/>context.stroke();<br/><br/>context.lineTo(284, 164);<br/>context.stroke();<br/><br/>context.lineTo(285, 164);<br/>context.stroke();<br/><br/>context.lineTo(283, 164);<br/>context.stroke();<br/><br/>context.lineTo(280, 168);<br/>context.stroke();<br/><br/>context.lineTo(277, 173);<br/>context.stroke();<br/><br/>context.lineTo(275, 176);<br/>context.stroke();<br/><br/>context.lineTo(273, 181);<br/>context.stroke();<br/><br/>context.lineTo(273, 183);<br/>context.stroke();<br/><br/>context.lineTo(272, 185);<br/>context.stroke();<br/><br/>context.lineTo(271, 186);<br/>context.stroke();<br/><br/>context.lineTo(271, 187);<br/>context.stroke();<br/><br/>context.lineTo(271, 189);<br/>context.stroke();<br/><br/>context.lineTo(271, 186);<br/>context.stroke();<br/><br/>context.lineTo(276, 169);<br/>context.stroke();<br/><br/>context.lineTo(277, 165);<br/>context.stroke();<br/><br/>context.lineTo(277, 164);<br/>context.stroke();<br/><br/>context.lineTo(277, 162);<br/>context.stroke();<br/><br/>context.lineTo(277, 163);<br/>context.stroke();<br/><br/>context.lineTo(275, 181);<br/>context.stroke();<br/><br/>context.lineTo(272, 197);<br/>context.stroke();<br/><br/>context.lineTo(270, 203);<br/>context.stroke();<br/><br/>context.lineTo(269, 208);<br/>context.stroke();<br/><br/>context.lineTo(269, 209);<br/>context.stroke();<br/><br/>context.lineTo(269, 211);<br/>context.stroke();<br/><br/>context.lineTo(269, 212);<br/>context.stroke();<br/><br/>context.lineTo(269, 211);<br/>context.stroke();<br/><br/>context.lineTo(271, 206);<br/>context.stroke();<br/><br/>context.lineTo(274, 196);<br/>context.stroke();<br/><br/>context.lineTo(287, 172);<br/>context.stroke();<br/><br/>context.lineTo(290, 167);<br/>context.stroke();<br/><br/>context.lineTo(290, 166);<br/>context.stroke();<br/><br/>context.lineTo(291, 165);<br/>context.stroke();<br/><br/>context.lineTo(289, 168);<br/>context.stroke();<br/><br/>context.lineTo(273, 193);<br/>context.stroke();<br/><br/>context.lineTo(266, 202);<br/>context.stroke();<br/><br/>context.lineTo(265, 205);<br/>context.stroke();<br/><br/>context.lineTo(264, 206);<br/>context.stroke();<br/><br/>context.lineTo(263, 206);<br/>context.stroke();<br/><br/>context.lineTo(264, 205);<br/>context.stroke();<br/><br/>context.lineTo(271, 193);<br/>context.stroke();<br/><br/>context.lineTo(281, 175);<br/>context.stroke();<br/><br/>context.lineTo(287, 167);<br/>context.stroke();<br/><br/>context.lineTo(289, 165);<br/>context.stroke();<br/><br/>context.lineTo(289, 164);<br/>context.stroke();<br/><br/>context.lineTo(290, 164);<br/>context.stroke();<br/><br/>context.lineTo(290, 165);<br/>context.stroke();<br/><br/>context.lineTo(282, 179);<br/>context.stroke();<br/><br/>context.lineTo(281, 181);<br/>context.stroke();<br/><br/>context.lineTo(279, 183);<br/>context.stroke();<br/><br/>context.lineTo(279, 185);<br/>context.stroke();<br/><br/>context.lineTo(279, 184);<br/>context.stroke();<br/><br/>context.lineTo(282, 177);<br/>context.stroke();<br/><br/>context.lineTo(285, 174);<br/>context.stroke();<br/><br/>context.lineTo(285, 174);<br/>context.stroke();<br/><br/>context.lineTo(286, 173);<br/>context.stroke();<br/><br/>context.lineTo(287, 172);<br/>context.stroke();<br/><br/>context.lineTo(288, 172);<br/>context.stroke();<br/><br/>context.lineTo(289, 173);<br/>context.stroke();<br/><br/>context.lineTo(289, 177);<br/>context.stroke();<br/><br/>context.lineTo(289, 181);<br/>context.stroke();<br/><br/>context.lineTo(289, 183);<br/>context.stroke();<br/><br/>context.lineTo(289, 185);<br/>context.stroke();<br/><br/>context.lineTo(289, 185);<br/>context.stroke();<br/><br/>context.lineTo(289, 186);<br/>context.stroke();<br/><br/>context.lineTo(289, 186);<br/>context.stroke();<br/><br/>context.lineTo(290, 186);<br/>context.stroke();<br/><br/>context.lineTo(292, 183);<br/>context.stroke();<br/><br/>context.lineTo(293, 181);<br/>context.stroke();<br/><br/>context.lineTo(294, 178);<br/>context.stroke();<br/><br/>context.lineTo(295, 177);<br/>context.stroke();<br/><br/>context.lineTo(296, 176);<br/>context.stroke();<br/><br/>context.lineTo(297, 175);<br/>context.stroke();<br/><br/>context.lineTo(299, 172);<br/>context.stroke();<br/><br/>context.lineTo(300, 169);<br/>context.stroke();<br/><br/>context.lineTo(301, 168);<br/>context.stroke();<br/><br/>context.lineTo(301, 167);<br/>context.stroke();<br/><br/>context.lineTo(301, 166);<br/>context.stroke();<br/><br/>context.lineTo(301, 165);<br/>context.stroke();<br/><br/>context.lineTo(301, 165);<br/>context.stroke();<br/><br/>context.lineTo(301, 164);<br/>context.stroke();<br/><br/>context.lineTo(300, 164);<br/>context.stroke();<br/><br/>context.lineTo(299, 163);<br/>context.stroke();<br/><br/>context.lineTo(298, 163);<br/>context.stroke();<br/><br/>context.lineTo(297, 163);<br/>context.stroke();<br/><br/>context.lineTo(297, 163);<br/>context.stroke();<br/><br/>context.lineTo(296, 163);<br/>context.stroke();<br/><br/>context.lineTo(296, 164);<br/>context.stroke();<br/><br/>context.lineTo(295, 165);<br/>context.stroke();<br/><br/>context.lineTo(295, 165);<br/>context.stroke();<br/><br/>context.lineTo(295, 166);<br/>context.stroke();<br/><br/>context.lineTo(295, 167);<br/>context.stroke();<br/><br/>context.lineTo(295, 170);<br/>context.stroke();<br/><br/>context.lineTo(295, 173);<br/>context.stroke();<br/><br/>context.lineTo(295, 173);<br/>context.stroke();<br/><br/>context.lineTo(295, 174);<br/>context.stroke();<br/><br/>context.lineTo(295, 175);<br/>context.stroke();<br/><br/>context.lineTo(295, 176);<br/>context.stroke();<br/><br/>context.lineTo(295, 175);<br/>context.stroke();<br/><br/>context.lineTo(295, 169);<br/>context.stroke();<br/><br/>context.lineTo(294, 165);<br/>context.stroke();<br/><br/>context.lineTo(294, 163);<br/>context.stroke();<br/><br/>context.lineTo(294, 161);<br/>context.stroke();<br/><br/>context.lineTo(293, 161);<br/>context.stroke();<br/><br/>context.lineTo(293, 161);<br/>context.stroke();<br/><br/>context.lineTo(291, 162);<br/>context.stroke();<br/><br/>context.lineTo(290, 164);<br/>context.stroke();<br/><br/>context.lineTo(288, 165);<br/>context.stroke();<br/><br/>context.lineTo(285, 166);<br/>context.stroke();<br/><br/>context.lineTo(282, 169);<br/>context.stroke();<br/><br/>context.lineTo(280, 170);<br/>context.stroke();<br/><br/>context.lineTo(278, 172);<br/>context.stroke();<br/><br/>context.lineTo(276, 173);<br/>context.stroke();<br/><br/>context.lineTo(273, 173);<br/>context.stroke();<br/><br/>context.lineTo(271, 174);<br/>context.stroke();<br/><br/>context.lineTo(269, 174);<br/>context.stroke();<br/><br/>context.lineTo(266, 175);<br/>context.stroke();<br/><br/>context.lineTo(263, 176);<br/>context.stroke();<br/><br/>context.lineTo(260, 176);<br/>context.stroke();<br/><br/>context.lineTo(257, 176);<br/>context.stroke();<br/><br/>context.lineTo(256, 176);<br/>context.stroke();<br/><br/>context.lineTo(254, 176);<br/>context.stroke();<br/><br/>context.lineTo(252, 176);<br/>context.stroke();<br/><br/>context.lineTo(251, 176);<br/>context.stroke();<br/><br/>context.lineTo(250, 176);<br/>context.stroke();<br/><br/>context.lineTo(249, 176);<br/>context.stroke();<br/><br/>context.lineTo(249, 176);<br/>context.stroke();<br/><br/>context.lineTo(248, 176);<br/>context.stroke();<br/><br/>context.lineTo(248, 175);<br/>context.stroke();<br/><br/>context.lineTo(247, 174);<br/>context.stroke();<br/><br/>context.lineTo(246, 173);<br/>context.stroke();<br/><br/>context.lineTo(245, 173);<br/>context.stroke();<br/><br/>context.lineTo(243, 170);<br/>context.stroke();<br/><br/>context.lineTo(242, 169);<br/>context.stroke();<br/><br/>context.lineTo(241, 167);<br/>context.stroke();<br/><br/>context.lineTo(241, 166);<br/>context.stroke();<br/><br/>context.lineTo(241, 165);<br/>context.stroke();<br/><br/>context.lineTo(241, 165);<br/>context.stroke();<br/><br/>context.lineTo(240, 164);<br/>context.stroke();<br/><br/>context.lineTo(239, 164);<br/>context.stroke();<br/><br/>context.lineTo(238, 165);<br/>context.stroke();<br/><br/>context.lineTo(237, 166);<br/>context.stroke();<br/><br/>context.lineTo(237, 166);<br/>context.stroke();<br/><br/>context.lineTo(237, 168);<br/>context.stroke();<br/><br/>context.lineTo(237, 169);<br/>context.stroke();<br/><br/>context.lineTo(237, 170);<br/>context.stroke();<br/><br/>context.lineTo(236, 170);<br/>context.stroke();<br/><br/>context.lineTo(236, 171);<br/>context.stroke();<br/><br/>context.lineTo(235, 172);<br/>context.stroke();<br/><br/>context.lineTo(235, 173);<br/>context.stroke();<br/><br/>context.lineTo(234, 173);<br/>context.stroke();<br/><br/>context.lineTo(234, 173);<br/>context.stroke();<br/><br/>context.lineTo(234, 173);<br/>context.stroke();<br/><br/>context.lineTo(234, 171);<br/>context.stroke();<br/><br/>context.lineTo(234, 169);<br/>context.stroke();<br/><br/>context.lineTo(234, 169);<br/>context.stroke();<br/><br/>context.lineTo(234, 167);<br/>context.stroke();<br/><br/>context.lineTo(234, 166);<br/>context.stroke();<br/><br/>context.lineTo(234, 165);<br/>context.stroke();<br/><br/>context.lineTo(234, 165);<br/>context.stroke();<br/><br/>context.lineTo(233, 164);<br/>context.stroke();<br/><br/>context.lineTo(232, 164);<br/>context.stroke();<br/><br/>context.lineTo(231, 164);<br/>context.stroke();<br/><br/>context.lineTo(231, 165);<br/>context.stroke();<br/><br/>context.lineTo(232, 166);<br/>context.stroke();<br/><br/>context.lineTo(233, 168);<br/>context.stroke();<br/><br/>context.lineTo(233, 170);<br/>context.stroke();<br/><br/>context.lineTo(234, 173);<br/>context.stroke();<br/><br/>context.lineTo(235, 173);<br/>context.stroke();<br/><br/>context.lineTo(235, 175);<br/>context.stroke();<br/><br/>context.lineTo(235, 177);<br/>context.stroke();<br/><br/>context.lineTo(235, 178);<br/>context.stroke();<br/><br/>context.lineTo(235, 179);<br/>context.stroke();<br/><br/>context.lineTo(237, 180);<br/>context.stroke();<br/><br/>context.lineTo(237, 180);<br/>context.stroke();<br/><br/>context.lineTo(237, 180);<br/>context.stroke();<br/>        &lt;/script&gt;<br/>&lt;/body&gt;<br/>&lt;/html&gt;<br/>