用javascript 反馈服务器svg图片两点坐标?

用javascript 反馈服务器svg图片两点坐标?

xml 代码
  1.   
  2. <svg>    
  3. <script type="text/javascript">  
  4.  
  5.  
  6. function changeText(evt)  
  7. {  
  8.    var XPos = evt.getClientX();  
  9.    var YPos = evt.getClientY();  
  10.  
  11.    targetXtext=svgDocument.getElementById("XPos");  
  12.    targetYtext=svgDocument.getElementById("YPos");  
  13.  
  14.    var newXPosText = svgDocument.createTextNode("X... Position : " + XPos);  
  15.    var newYPosText = svgDocument.createTextNode("Y... Position : " + YPos);  
  16.  
  17.    targetXtext.replaceChild(newXPosText,targetXtext.getFirstChild());  
  18.    targetYtext.replaceChild(newYPosText,targetYtext.getFirstChild());  
  19. }  
  20.  
  21. function changeTextNotOver(evt)  
  22. {  
  23.    targetXtext=svgDocument.getElementById("XPos");  
  24.    targetYtext=svgDocument.getElementById("YPos");  
  25.  
  26.    var newXPosText = svgDocument.createTextNode("X.. Position : Not over Rectangle");  
  27.    var newYPosText = svgDocument.createTextNode("Y.. Position : Not over Rectangle");  
  28.  
  29.    targetXtext.replaceChild(newXPosText,targetXtext.getFirstChild());  
  30.    targetYtext.replaceChild(newYPosText,targetYtext.getFirstChild());  
  31.  
  32. }  
  33.  
  34. function recordClick(evt)  
  35. {  
  36.    targetClickText=svgDocument.getElementById("ClickPosd");  
  37.  
  38.    var XPosd = evt.getClientX();  
  39.    var YPosd = evt.getClientY();  
  40.  
  41.    var newClickText = svgDocument.createTextNode("Last Click made at X=" + XPosd + " Y=" + YPosd);  
  42.  
  43.    targetClickText.replaceChild(newClickText, targetClickText.getFirstChild());  
  44.  
  45. }  
  46.  
  47. function recordClickup(evt)  
  48. {  
  49.    targetClickText=svgDocument.getElementById("ClickPosu");  
  50.  
  51.    var XPosu = evt.getClientX();  
  52.    var YPosu = evt.getClientY();  
  53.  
  54.    var newClickText = svgDocument.createTextNode("Last Click made at: /n X=" + XPosu + " Y=" + YPosu);  
  55.  
  56.    targetClickText.replaceChild(newClickText, targetClickText.getFirstChild());  
  57.  
  58. }  
  59.  
  60.  
  61.  
  62. // ]]>  
  63. script>  
  64. <text id="XPos" x="50" y="30">X. Position :text>  
  65. <text id="YPos" x="50" y="50">Y. Position :text>  
  66. <text id="ClickPosu" x="50" y="70">Last Click made at : text>  
  67. <text id="ClickPosd" x="50" y="90">Last Click made at : text>  
  68. <rect x="50" y="100" width="200" height="200" style="fill:blue" onmousemove="changeText(evt)" onmouseout="changeTextNotOver(evt)" onmousedown="recordClick(evt)" onmouseup="recordClickup(evt)"/>     
  69.   
  70. >  
  71.   
  72.   


以下是svg原码
aa.svg
我想比较鼠标按下和抬起坐标的差,判断鼠标是否移动了。然后把两个坐标值发送给服务器,?

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值