Posted on 2006-04-05 15:59
Kevin Meng 阅读(574)
评论(0) 编辑 收藏
(1)相应鼠标的onMouseDown,onMouseMove,onMouseUp三个事件,分别对应handleMouseDown,handleMouseMove,handleMouseUp三个函数。
(2)在onMouseDown中设置状态值,保存开始点坐标:
function handleMouseDown() {
switch(m_tool) {
case "zoomin": // zoom in mode
startX=window.event.clientX;
startY=window.event.clientY;
zooming=true;
break;
}
//记得一定要返回事件的状态
window.event.returnValue=false
}
(3)在onMouseMove中划框
function handleMouseMove(){
switch(m_tool) {
case "zoomin": // zoom in mode
if(zooming==true&&(Math.abs(event.clientX-startX)>drawStockWidth&&Math.abs(event.clientY-startY)>drawStockWidth)){
ZoomBox()
}
break;
case "zoomout": // zoom out mode
parent.postFrame.requestMapForm.action="requestMap.do?tool=zoomout";
parent.postFrame.requestMapForm.submit();
break;
}
window.event.returnValue=false
}
(4)在onMouseUp中取消画框状态
function handleMouseUp(){
switch(m_tool) {
case "zoomin": // zoom in mode
setDownLoadState("");
parent.postFrame.requestMapForm.action="requestMap.do?tool=zoomin";
parent.postFrame.requestMapForm.submit();
stopZoomBox();
break;
case "zoomout": // zoom out mode
setDownLoadState("");
parent.postFrame.requestMapForm.action="requestMap.do?tool=zoomout";
parent.postFrame.requestMapForm.submit();
break;
}
window.event.returnValue=false
}
画框函数
//draw the zoom box
function ZoomBox() {
var newx;
var newy;
if(startX<window.event.clientX&&startY<window.event.clientY){
moveLayer("alphaLayer",startX,startY);
}else if(startX<window.event.clientX&&startY>window.event.clientY){
moveLayer("alphaLayer",startX,window.event.clientY);
}else if(startX>window.event.clientX&&startY<window.event.clientY){
moveLayer("alphaLayer",window.event.clientX,startY);
}else if(startX>window.event.clientX&&startY>window.event.clientY){
moveLayer("alphaLayer",window.event.clientX,window.event.clientY);
}
setLayerExtent("alphaLayer",Math.abs(window.event.clientX-startX),Math.abs(window.event.clientY-startY))
showLayer("alphaLayer");
}
function stopZoomBox(){
hideLayer("alphaLayer");
zooming=false;
}