仿51地图的测面积（前台部分）用JQuery + dwr + vml

function drawarea(){
 if(state=="area"){
  var mParamX = "";
  var mParamY = "";
  var mWorkArea=false;
  var mOldValue="";
  var mPoly=null;
  var mOldX=0;
  var mOldY=0;
  var xx,yy;
  var mParentDiv = $("<div></div>")
  mParentDiv.appendTo("#imgmap");
  $("#imgmap").bind("mousedown", function (){
   if(!mWorkArea){
    xx=event.x;
    yy=event.y;
    mParamX =  xx;
    mParamY =  yy;
    mPoly = $("<v:shape></v:shape>").attr({'path' : 'm0,0 l0,0',
                'filled' : 'true',
                'strokecolor' : 'red',
                'strokeweight': '2',
                'coordsize' : '100,100',
                'fillcolor' : 'yellow'})
            .css({'position':'absolute',
               'z-index':'1',
               'left' : xx,
               'top' : yy,
               'width' : '100',
               'height': '100',
               'filter': 'Alpha(Opacity=50)'});
    mPoly.appendTo(mParentDiv);
    mOldValue = (mPoly.attr("path")+"").replace("e","");
    mOldX=xx;
    mOldY=yy;
    mWorkArea=true;
   }else{
    mParamX = mParamX + "|" + event.x;
    mParamY = mParamY + "|" + event.y;
    if (mPoly!=null) mOldValue=(mPoly.attr("path")+"").replace(" e","");
   }
  });
  $("#imgmap").bind("mousemove", function(){
   var tempx=event.x;
   var tempy=event.y;
   if (mPoly!=null){
    mPoly.attr("path", mOldValue+","+(tempx-mOldX)+","+(tempy-mOldY));
    mPoly.attr("path", (mPoly.attr("path")+"").replace(",0,0,",",0,").replace(",0 e","e"));
   }
  });
  $("#imgmap").bind("dblclick", function(){
   var x = event.x;
   var y = event.y;
    loadDwr.getArea(mParamX, mParamY,{callback:function(data){
     $("²").appendTo(
      $("<div></div>").css({'top' : y,
              'left': x,
              'position': 'absolute',
              'border': '#adaeac 1px solid',
              'background-color': '#fbfbd9'})
           .html(data+" km")
           .appendTo(mParentDiv)
        );
    }});
    $("<img>").css({'top':y,
       'left':x-10,
       'cursor': 'pointer',
       'position': 'absolute'})
      .attr("src","./51/del.gif")
      .attr("title", "清除本次测距")
      .bind("click",function(){
       $(this).parent().remove();
      })
      .appendTo(mParentDiv);
    mPoly.attr("path", mOldValue+"x e");
    mWorkArea=false;
    mPoly=null;
    $("#imgmap").unbind("mousedown");
    $("#imgmap").unbind("mousemove");
    $("#imgmap").unbind("dblclick");
    resetimg();
    state = "";
  });
 }
}