<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html ؛ charset = utf-8"/> <title> </title> <torm = "text"> } </style> <script type = "text/javaScript">/** draw points*/function makakedot (x ، y) {pointDiv = "<div style = 'height: 1px ؛ position: absolute ؛ lefter: إرجاع PointDiv ؛} /** ارسم خطًا مستقيمًا يعتمد على إحداثيات النقطتين. */ خط الوظيفة (x1 ، y1 ، x2 ، y2) {var slope ؛ // Slope var Direction ؛ // تنسيق الحركة var tx = x2 - x1 ؛ var ty = y2 - y1 ؛ if (tx == 0 && ty == 0) return ؛ var points = "" ؛ var axis ؛ // إحداثيات على المحور if (math.abs (tx)> = math.abs (ty)) {// نقل الاتجاه = tx> 0؟ 1: -1 ؛ tx = math.abs (tx) ؛ المنحدر = ty / tx ؛ المحور = x1 ؛ لـ (i = 0 ؛ i <tx ؛ i ++) {points += makakedot (axis ، y1 +i * slope) ؛ المحور += الاتجاه ؛ }} آخر {// نقل الاتجاه على اتجاه المحور y = ty> 0؟ 1: -1 ؛ ty = math.abs (ty) ؛ المنحدر = tx / ty ؛ المحور = y1 ؛ لـ (i = 0 ؛ i <ty ؛ i ++) {points += makedot (x1 +i * slope ، axis) ؛ المحور += الاتجاه ؛ }} var container = document.getElementById ("Container") ؛ حاوية. innerhtml += النقاط ؛ } var oldpoint = null ؛ // احصل على وظيفة موضع الفأر mouseposition (ev) {ev = ev || window.event ؛ if (ev.pagex || ev.pagey) {return {x: ev.pagex ، y: ev.pagey} ؛ } var doc = document.documentElement ، body = document.body ؛ var pagex = event.clientx + (doc && doc.scrollleft || body && body.scrollleft || 0) - (doc && doc.clientleft || body && body.clientleft || 0) ؛ var pagey = event.clienty + (doc && doc.scrolltop || body && body.scrolltop || 0) - (doc && doc.clienttop || body && body.clienttop || 0) ؛ إرجاع {x: pagex ، y: pagey} ؛} recordpoint (ev) {var point = mouseposition (ev) ؛ if (oldpoint! = null) {line (oldpoint.x ، oldpoint.y ، point.x ، point.y) ؛ } oldpoint = point ؛} </script> </head> <body> <div id = "container" onClick = "RecordPoint (event) ؛"> </viv> <script type = "text/javaScript"> // line (19،19،22،300) ؛ </script> </body> </html>