&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.beginPath();<br/>context.moveTo(224, 215);<br/><br/>context.lineTo(225, 213);<br/>context.stroke();<br/><br/>context.lineTo(225, 211);<br/>context.stroke();<br/><br/>context.lineTo(226, 207);<br/>context.stroke();<br/><br/>context.lineTo(227, 202);<br/>context.stroke();<br/><br/>context.lineTo(227, 198);<br/>context.stroke();<br/><br/>context.lineTo(227, 188);<br/>context.stroke();<br/><br/>context.lineTo(227, 176);<br/>context.stroke();<br/><br/>context.lineTo(226, 171);<br/>context.stroke();<br/><br/>context.lineTo(223, 163);<br/>context.stroke();<br/><br/>context.lineTo(219, 159);<br/>context.stroke();<br/><br/>context.lineTo(218, 158);<br/>context.stroke();<br/><br/>context.lineTo(216, 155);<br/>context.stroke();<br/><br/>context.lineTo(213, 154);<br/>context.stroke();<br/><br/>context.lineTo(211, 153);<br/>context.stroke();<br/><br/>context.lineTo(208, 152);<br/>context.stroke();<br/><br/>context.lineTo(197, 152);<br/>context.stroke();<br/><br/>context.lineTo(186, 152);<br/>context.stroke();<br/><br/>context.lineTo(172, 152);<br/>context.stroke();<br/><br/>context.lineTo(164, 152);<br/>context.stroke();<br/><br/>context.lineTo(160, 152);<br/>context.stroke();<br/><br/>context.lineTo(158, 152);<br/>context.stroke();<br/><br/>context.lineTo(155, 154);<br/>context.stroke();<br/><br/>context.lineTo(151, 157);<br/>context.stroke();<br/><br/>context.lineTo(146, 162);<br/>context.stroke();<br/><br/>context.lineTo(141, 167);<br/>context.stroke();<br/><br/>context.lineTo(137, 171);<br/>context.stroke();<br/><br/>context.lineTo(130, 188);<br/>context.stroke();<br/><br/>context.lineTo(127, 195);<br/>context.stroke();<br/><br/>context.lineTo(127, 201);<br/>context.stroke();<br/><br/>context.lineTo(127, 207);<br/>context.stroke();<br/><br/>context.lineTo(127, 212);<br/>context.stroke();<br/><br/>context.lineTo(127, 218);<br/>context.stroke();<br/><br/>context.lineTo(129, 223);<br/>context.stroke();<br/><br/>context.lineTo(132, 227);<br/>context.stroke();<br/><br/>context.lineTo(134, 231);<br/>context.stroke();<br/><br/>context.lineTo(137, 235);<br/>context.stroke();<br/><br/>context.lineTo(139, 238);<br/>context.stroke();<br/><br/>context.lineTo(142, 242);<br/>context.stroke();<br/><br/>context.lineTo(146, 247);<br/>context.stroke();<br/><br/>context.lineTo(150, 251);<br/>context.stroke();<br/><br/>context.lineTo(154, 255);<br/>context.stroke();<br/><br/>context.lineTo(158, 259);<br/>context.stroke();<br/><br/>context.lineTo(162, 262);<br/>context.stroke();<br/><br/>context.lineTo(166, 265);<br/>context.stroke();<br/><br/>context.lineTo(171, 268);<br/>context.stroke();<br/><br/>context.lineTo(174, 271);<br/>context.stroke();<br/><br/>context.lineTo(179, 273);<br/>context.stroke();<br/><br/>context.lineTo(192, 275);<br/>context.stroke();<br/><br/>context.lineTo(203, 277);<br/>context.stroke();<br/><br/>context.lineTo(212, 280);<br/>context.stroke();<br/><br/>context.lineTo(221, 281);<br/>context.stroke();<br/><br/>context.lineTo(226, 282);<br/>context.stroke();<br/><br/>context.lineTo(230, 282);<br/>context.stroke();<br/><br/>context.lineTo(234, 282);<br/>context.stroke();<br/><br/>context.lineTo(237, 282);<br/>context.stroke();<br/><br/>context.lineTo(241, 282);<br/>context.stroke();<br/><br/>context.lineTo(246, 282);<br/>context.stroke();<br/><br/>context.lineTo(250, 281);<br/>context.stroke();<br/><br/>context.lineTo(254, 279);<br/>context.stroke();<br/><br/>context.lineTo(258, 278);<br/>context.stroke();<br/><br/>context.lineTo(263, 276);<br/>context.stroke();<br/><br/>context.lineTo(266, 275);<br/>context.stroke();<br/><br/>context.lineTo(269, 273);<br/>context.stroke();<br/><br/>context.lineTo(273, 271);<br/>context.stroke();<br/><br/>context.lineTo(280, 265);<br/>context.stroke();<br/><br/>context.lineTo(283, 256);<br/>context.stroke();<br/><br/>context.lineTo(286, 252);<br/>context.stroke();<br/><br/>context.lineTo(288, 248);<br/>context.stroke();<br/><br/>context.lineTo(290, 245);<br/>context.stroke();<br/><br/>context.lineTo(293, 239);<br/>context.stroke();<br/><br/>context.lineTo(295, 234);<br/>context.stroke();<br/><br/>context.lineTo(297, 226);<br/>context.stroke();<br/><br/>context.lineTo(300, 215);<br/>context.stroke();<br/><br/>context.lineTo(301, 208);<br/>context.stroke();<br/><br/>context.lineTo(302, 202);<br/>context.stroke();<br/><br/>context.lineTo(302, 197);<br/>context.stroke();<br/><br/>context.lineTo(302, 193);<br/>context.stroke();<br/><br/>context.lineTo(302, 189);<br/>context.stroke();<br/><br/>context.lineTo(301, 186);<br/>context.stroke();<br/><br/>context.lineTo(300, 183);<br/>context.stroke();<br/><br/>context.lineTo(299, 180);<br/>context.stroke();<br/><br/>context.lineTo(299, 176);<br/>context.stroke();<br/><br/>context.lineTo(297, 164);<br/>context.stroke();<br/><br/>context.lineTo(296, 155);<br/>context.stroke();<br/><br/>context.lineTo(293, 150);<br/>context.stroke();<br/><br/>context.lineTo(292, 148);<br/>context.stroke();<br/><br/>context.lineTo(291, 145);<br/>context.stroke();<br/><br/>context.lineTo(289, 141);<br/>context.stroke();<br/><br/>context.lineTo(287, 138);<br/>context.stroke();<br/><br/>context.lineTo(284, 135);<br/>context.stroke();<br/><br/>context.lineTo(282, 133);<br/>context.stroke();<br/><br/>context.lineTo(280, 131);<br/>context.stroke();<br/><br/>context.lineTo(278, 128);<br/>context.stroke();<br/><br/>context.lineTo(276, 126);<br/>context.stroke();<br/><br/>context.lineTo(274, 125);<br/>context.stroke();<br/><br/>context.lineTo(272, 123);<br/>context.stroke();<br/><br/>context.lineTo(269, 122);<br/>context.stroke();<br/><br/>context.lineTo(267, 120);<br/>context.stroke();<br/><br/>context.lineTo(265, 118);<br/>context.stroke();<br/><br/>context.lineTo(262, 117);<br/>context.stroke();<br/><br/>context.lineTo(259, 115);<br/>context.stroke();<br/><br/>context.lineTo(254, 112);<br/>context.stroke();<br/><br/>context.lineTo(245, 111);<br/>context.stroke();<br/><br/>context.lineTo(235, 107);<br/>context.stroke();<br/><br/>context.lineTo(228, 104);<br/>context.stroke();<br/><br/>context.lineTo(219, 101);<br/>context.stroke();<br/><br/>context.lineTo(206, 97);<br/>context.stroke();<br/><br/>context.lineTo(198, 96);<br/>context.stroke();<br/><br/>context.lineTo(191, 95);<br/>context.stroke();<br/><br/>context.lineTo(184, 95);<br/>context.stroke();<br/><br/>context.lineTo(175, 94);<br/>context.stroke();<br/><br/>context.lineTo(166, 94);<br/>context.stroke();<br/><br/>context.lineTo(155, 94);<br/>context.stroke();<br/><br/>context.lineTo(144, 94);<br/>context.stroke();<br/><br/>context.lineTo(134, 94);<br/>context.stroke();<br/><br/>context.lineTo(125, 95);<br/>context.stroke();<br/><br/>context.lineTo(116, 98);<br/>context.stroke();<br/><br/>context.lineTo(111, 101);<br/>context.stroke();<br/><br/>context.lineTo(107, 104);<br/>context.stroke();<br/><br/>context.lineTo(100, 109);<br/>context.stroke();<br/><br/>context.lineTo(94, 116);<br/>context.stroke();<br/><br/>context.lineTo(90, 120);<br/>context.stroke();<br/><br/>context.lineTo(87, 124);<br/>context.stroke();<br/><br/>context.lineTo(84, 128);<br/>context.stroke();<br/><br/>context.lineTo(80, 132);<br/>context.stroke();<br/><br/>context.lineTo(78, 140);<br/>context.stroke();<br/><br/>context.lineTo(77, 148);<br/>context.stroke();<br/><br/>context.lineTo(77, 155);<br/>context.stroke();<br/><br/>context.lineTo(77, 164);<br/>context.stroke();<br/><br/>context.lineTo(77, 174);<br/>context.stroke();<br/><br/>context.lineTo(77, 183);<br/>context.stroke();<br/><br/>context.lineTo(77, 192);<br/>context.stroke();<br/><br/>context.lineTo(77, 201);<br/>context.stroke();<br/><br/>context.lineTo(77, 209);<br/>context.stroke();<br/><br/>context.lineTo(77, 216);<br/>context.stroke();<br/><br/>context.lineTo(78, 227);<br/>context.stroke();<br/><br/>context.lineTo(80, 235);<br/>context.stroke();<br/><br/>context.lineTo(83, 240);<br/>context.stroke();<br/><br/>context.lineTo(85, 247);<br/>context.stroke();<br/><br/>context.lineTo(87, 253);<br/>context.stroke();<br/><br/>context.lineTo(91, 259);<br/>context.stroke();<br/><br/>context.lineTo(94, 264);<br/>context.stroke();<br/><br/>context.lineTo(98, 269);<br/>context.stroke();<br/><br/>context.lineTo(100, 273);<br/>context.stroke();<br/><br/>context.lineTo(104, 281);<br/>context.stroke();<br/><br/>context.lineTo(108, 287);<br/>context.stroke();<br/><br/>context.lineTo(116, 295);<br/>context.stroke();<br/><br/>context.lineTo(122, 300);<br/>context.stroke();<br/><br/>context.lineTo(140, 311);<br/>context.stroke();<br/><br/>context.lineTo(151, 316);<br/>context.stroke();<br/><br/>context.lineTo(160, 322);<br/>context.stroke();<br/><br/>context.lineTo(168, 325);<br/>context.stroke();<br/><br/>context.lineTo(174, 329);<br/>context.stroke();<br/><br/>context.lineTo(178, 331);<br/>context.stroke();<br/><br/>context.lineTo(181, 332);<br/>context.stroke();<br/><br/>context.lineTo(183, 333);<br/>context.stroke();<br/><br/>context.lineTo(187, 334);<br/>context.stroke();<br/><br/>context.lineTo(191, 335);<br/>context.stroke();<br/><br/>context.lineTo(196, 336);<br/>context.stroke();<br/><br/>context.lineTo(205, 337);<br/>context.stroke();<br/><br/>context.lineTo(215, 339);<br/>context.stroke();<br/><br/>context.lineTo(225, 339);<br/>context.stroke();<br/><br/>context.lineTo(231, 340);<br/>context.stroke();<br/><br/>context.lineTo(235, 340);<br/>context.stroke();<br/><br/>context.lineTo(240, 340);<br/>context.stroke();<br/><br/>context.lineTo(245, 340);<br/>context.stroke();<br/><br/>context.lineTo(246, 340);<br/>context.stroke();<br/><br/>context.lineTo(252, 337);<br/>context.stroke();<br/><br/>context.lineTo(261, 334);<br/>context.stroke();<br/><br/>context.lineTo(276, 329);<br/>context.stroke();<br/><br/>context.lineTo(283, 327);<br/>context.stroke();<br/><br/>context.lineTo(288, 325);<br/>context.stroke();<br/><br/>context.lineTo(291, 323);<br/>context.stroke();<br/><br/>context.lineTo(295, 319);<br/>context.stroke();<br/><br/>context.lineTo(299, 315);<br/>context.stroke();<br/><br/>context.lineTo(302, 310);<br/>context.stroke();<br/><br/>context.lineTo(309, 300);<br/>context.stroke();<br/><br/>context.lineTo(315, 290);<br/>context.stroke();<br/><br/>context.lineTo(318, 284);<br/>context.stroke();<br/><br/>context.lineTo(320, 279);<br/>context.stroke();<br/><br/>context.lineTo(322, 275);<br/>context.stroke();<br/><br/>context.lineTo(324, 271);<br/>context.stroke();<br/><br/>context.lineTo(325, 266);<br/>context.stroke();<br/><br/>context.lineTo(326, 262);<br/>context.stroke();<br/><br/>context.lineTo(328, 257);<br/>context.stroke();<br/><br/>context.lineTo(330, 252);<br/>context.stroke();<br/><br/>context.lineTo(331, 247);<br/>context.stroke();<br/><br/>context.lineTo(332, 243);<br/>context.stroke();<br/><br/>context.lineTo(333, 239);<br/>context.stroke();<br/><br/>context.lineTo(334, 234);<br/>context.stroke();<br/><br/>context.lineTo(334, 229);<br/>context.stroke();<br/><br/>context.lineTo(334, 224);<br/>context.stroke();<br/><br/>context.lineTo(334, 222);<br/>context.stroke();<br/><br/>context.lineTo(334, 220);<br/>context.stroke();<br/><br/>context.lineTo(335, 218);<br/>context.stroke();<br/><br/>context.lineTo(335, 217);<br/>context.stroke();<br/><br/>context.lineTo(335, 217);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(182, 201);<br/><br/>context.lineTo(181, 201);<br/>context.stroke();<br/><br/>context.lineTo(181, 200);<br/>context.stroke();<br/><br/>context.lineTo(180, 199);<br/>context.stroke();<br/><br/>context.lineTo(180, 198);<br/>context.stroke();<br/><br/>context.lineTo(179, 197);<br/>context.stroke();<br/><br/>context.lineTo(178, 196);<br/>context.stroke();<br/><br/>context.lineTo(177, 195);<br/>context.stroke();<br/><br/>context.lineTo(176, 195);<br/>context.stroke();<br/><br/>context.lineTo(175, 195);<br/>context.stroke();<br/><br/>context.lineTo(174, 195);<br/>context.stroke();<br/><br/>context.lineTo(172, 194);<br/>context.stroke();<br/><br/>context.lineTo(171, 194);<br/>context.stroke();<br/><br/>context.lineTo(170, 194);<br/>context.stroke();<br/><br/>context.lineTo(169, 194);<br/>context.stroke();<br/><br/>context.lineTo(168, 194);<br/>context.stroke();<br/><br/>context.lineTo(167, 194);<br/>context.stroke();<br/><br/>context.lineTo(166, 194);<br/>context.stroke();<br/><br/>context.lineTo(165, 194);<br/>context.stroke();<br/><br/>context.lineTo(164, 194);<br/>context.stroke();<br/><br/>context.lineTo(163, 195);<br/>context.stroke();<br/><br/>context.lineTo(162, 195);<br/>context.stroke();<br/><br/>context.lineTo(162, 196);<br/>context.stroke();<br/><br/>context.lineTo(161, 196);<br/>context.stroke();<br/><br/>context.lineTo(161, 197);<br/>context.stroke();<br/><br/>context.lineTo(160, 198);<br/>context.stroke();<br/><br/>context.lineTo(160, 199);<br/>context.stroke();<br/><br/>context.lineTo(160, 200);<br/>context.stroke();<br/><br/>context.lineTo(160, 201);<br/>context.stroke();<br/><br/>context.lineTo(160, 202);<br/>context.stroke();<br/><br/>context.lineTo(160, 204);<br/>context.stroke();<br/><br/>context.lineTo(160, 205);<br/>context.stroke();<br/><br/>context.lineTo(160, 206);<br/>context.stroke();<br/><br/>context.lineTo(160, 207);<br/>context.stroke();<br/><br/>context.lineTo(160, 209);<br/>context.stroke();<br/><br/>context.lineTo(161, 210);<br/>context.stroke();<br/><br/>context.lineTo(161, 211);<br/>context.stroke();<br/><br/>context.lineTo(162, 212);<br/>context.stroke();<br/><br/>context.lineTo(163, 213);<br/>context.stroke();<br/><br/>context.lineTo(164, 214);<br/>context.stroke();<br/><br/>context.lineTo(165, 215);<br/>context.stroke();<br/><br/>context.lineTo(167, 216);<br/>context.stroke();<br/><br/>context.lineTo(168, 217);<br/>context.stroke();<br/><br/>context.lineTo(169, 218);<br/>context.stroke();<br/><br/>context.lineTo(170, 220);<br/>context.stroke();<br/><br/>context.lineTo(171, 221);<br/>context.stroke();<br/><br/>context.lineTo(172, 221);<br/>context.stroke();<br/><br/>context.lineTo(173, 222);<br/>context.stroke();<br/><br/>context.lineTo(174, 222);<br/>context.stroke();<br/><br/>context.lineTo(174, 223);<br/>context.stroke();<br/><br/>context.lineTo(175, 223);<br/>context.stroke();<br/><br/>context.lineTo(176, 223);<br/>context.stroke();<br/><br/>context.lineTo(177, 224);<br/>context.stroke();<br/><br/>context.lineTo(178, 224);<br/>context.stroke();<br/><br/>context.lineTo(179, 225);<br/>context.stroke();<br/><br/>context.lineTo(180, 225);<br/>context.stroke();<br/><br/>context.lineTo(181, 226);<br/>context.stroke();<br/><br/>context.lineTo(181, 226);<br/>context.stroke();<br/><br/>context.strokeStyle = '#000000';<br/>context.beginPath();<br/>context.moveTo(180, 198);<br/><br/>context.lineTo(179, 198);<br/>context.stroke();<br/><br/>context.lineTo(179, 197);<br/>context.stroke();<br/><br/>context.lineTo(179, 196);<br/>context.stroke();<br/><br/>context.lineTo(179, 195);<br/>context.stroke();<br/><br/>context.lineTo(179, 193);<br/>context.stroke();<br/><br/>context.lineTo(179, 192);<br/>context.stroke();<br/><br/>context.lineTo(179, 191);<br/>context.stroke();<br/><br/>context.lineTo(179, 190);<br/>context.stroke();<br/><br/>context.lineTo(179, 189);<br/>context.stroke();<br/><br/>context.lineTo(179, 188);<br/>context.stroke();<br/><br/>context.lineTo(179, 187);<br/>context.stroke();<br/><br/>context.lineTo(181, 187);<br/>context.stroke();<br/><br/>context.lineTo(181, 186);<br/>context.stroke();<br/><br/>context.lineTo(183, 185);<br/>context.stroke();<br/><br/>context.lineTo(184, 185);<br/>context.stroke();<br/><br/>context.lineTo(187, 184);<br/>context.stroke();<br/><br/>context.lineTo(190, 184);<br/>context.stroke();<br/><br/>context.lineTo(191, 184);<br/>context.stroke();<br/><br/>context.lineTo(192, 184);<br/>context.stroke();<br/><br/>context.lineTo(193, 184);<br/>context.stroke();<br/><br/>context.lineTo(194, 184);<br/>context.stroke();<br/><br/>context.lineTo(194, 185);<br/>context.stroke();<br/><br/>context.lineTo(195, 185);<br/>context.stroke();<br/><br/>context.lineTo(196, 186);<br/>context.stroke();<br/><br/>context.lineTo(197, 186);<br/>context.stroke();<br/><br/>context.lineTo(198, 187);<br/>context.stroke();<br/><br/>context.lineTo(199, 187);<br/>context.stroke();<br/><br/>context.lineTo(199, 188);<br/>context.stroke();<br/><br/>context.lineTo(200, 188);<br/>context.stroke();<br/><br/>context.lineTo(201, 189);<br/>context.stroke();<br/><br/>context.lineTo(201, 190);<br/>context.stroke();<br/><br/>context.lineTo(202, 191);<br/>context.stroke();<br/><br/>context.lineTo(203, 192);<br/>context.stroke();<br/><br/>context.lineTo(203, 193);<br/>context.stroke();<br/><br/>context.lineTo(204, 194);<br/>context.stroke();<br/><br/>context.lineTo(204, 195);<br/>context.stroke();<br/><br/>context.lineTo(204, 196);<br/>context.stroke();<br/><br/>context.lineTo(204, 197);<br/>context.stroke();<br/><br/>context.lineTo(204, 198);<br/>context.stroke();<br/><br/>context.lineTo(204, 199);<br/>context.stroke();<br/><br/>context.lineTo(204, 200);<br/>context.stroke();<br/><br/>context.lineTo(204, 201);<br/>context.stroke();<br/><br/>context.lineTo(204, 202);<br/>context.stroke();<br/><br/>context.lineTo(204, 203);<br/>context.stroke();<br/><br/>context.lineTo(204, 204);<br/>context.stroke();<br/><br/>context.lineTo(204, 205);<br/>context.stroke();<br/><br/>context.lineTo(204, 206);<br/>context.stroke();<br/><br/>context.lineTo(204, 207);<br/>context.stroke();<br/><br/>context.lineTo(203, 208);<br/>context.stroke();<br/><br/>context.lineTo(203, 209);<br/>context.stroke();<br/><br/>context.lineTo(202, 209);<br/>context.stroke();<br/><br/>context.lineTo(202, 210);<br/>context.stroke();<br/><br/>context.lineTo(201, 210);<br/>context.stroke();<br/><br/>context.lineTo(199, 212);<br/>context.stroke();<br/><br/>context.lineTo(198, 212);<br/>context.stroke();<br/><br/>context.lineTo(197, 213);<br/>context.stroke();<br/><br/>context.lineTo(196, 213);<br/>context.stroke();<br/><br/>context.lineTo(195, 213);<br/>context.stroke();<br/><br/>context.lineTo(194, 214);<br/>context.stroke();<br/><br/>context.lineTo(193, 214);<br/>context.stroke();<br/><br/>context.lineTo(192, 214);<br/>context.stroke();<br/><br/>context.lineTo(192, 215);<br/>context.stroke();<br/><br/>context.lineTo(191, 215);<br/>context.stroke();<br/><br/>context.lineTo(190, 215);<br/>context.stroke();<br/><br/>context.lineTo(189, 216);<br/>context.stroke();<br/><br/>context.lineTo(188, 216);<br/>context.stroke();<br/><br/>context.lineTo(188, 217);<br/>context.stroke();<br/><br/>context.lineTo(187, 217);<br/>context.stroke();<br/><br/>context.lineTo(186, 217);<br/>context.stroke();<br/><br/>context.lineTo(186, 218);<br/>context.stroke();<br/><br/>context.lineTo(185, 219);<br/>context.stroke();<br/><br/>context.lineTo(184, 219);<br/>context.stroke();<br/><br/>context.lineTo(183, 220);<br/>context.stroke();<br/><br/>context.lineTo(182, 221);<br/>context.stroke();<br/><br/>context.lineTo(182, 222);<br/>context.stroke();<br/><br/>context.lineTo(182, 223);<br/>context.stroke();<br/><br/>context.lineTo(182, 224);<br/>context.stroke();<br/><br/>context.lineTo(182, 224);<br/>context.stroke();<br/>        &lt;/script&gt;<br/>&lt;/body&gt;<br/>&lt;/html&gt;<br/>