Рисование и js
Можно ли на js , dhtml написать программу, с помощью которой пользователь может нарисовать, например, прямую как в painte (т.е. щелкнув на одном месте и потянув мышь) или просто аналог рисования кисточкой в painte?
|
SVG, canvas, и прочее
ваш вопрос уже обсуждался на форуме неоднократно |
Только учти, что всё перечисленное выше не все браузеры поддерживают и далеко не всех версий, а точнее можно сказать только последние версии.
|
Цитата:
|
Он-лайн Paint
canvas paint:dance:
|
почему эта штука только в опере работает?
<script> window.onclick=clc; var old_n=0; var max_n=0; var new_n=0; var flag="none"; var st_x,st_y; function clc() { old_n=new_n; if(flag=="none" || flag=="unset") { var ev=window.event; st_x=ev.clientX; st_y=ev.clientY; flag="set"; window.onmousemove=line; } else if(flag=="set") { window.onmousemove=""; flag="unset"; } } function line() { var ev=window.event; new_n=old_n+Math.max(Math.abs(ev.clientX-st_x),Math.abs(ev.clientY-st_y)); if(max_n<new_n) { for(var i=max_n;i<new_n;i++) { var div=document.createElement("div"); div.style.background="black"; div.style.width=1; div.style.height=1; div.setAttribute("name","div"+i); document.body.appendChild(div); div.style.position="absolute"; } max_n=new_n; } for(var i=old_n;i<new_n;i++) { var div=document.all("div"+i); var x=st_x+(ev.clientX-st_x)*(i-old_n)/(new_n-old_n); var y=st_y+(ev.clientY-st_y)*(i-old_n)/(new_n-old_n); div.style.left=x; div.style.top=y; document.all("div"+i).style.display="inline"; } if(max_n>new_n) for(var i=new_n;i<max_n;i++) document.all("div"+i).style.display="none"; } </script> |
|
Часовой пояс GMT +3, время: 14:44. |