colorform.js

采用arcims结合asp开发的一个webgis系统,针对地下水,实现了曲线时时绘制的功能.

	  	var theLayer = document.ColorBox;
		var mouseX = 0;
		var mouseY = 0;
		var hspc=0;
		var vspc=0;
		
		// setup test for Nav 4.0
		var isNav4 = false;
		var isNav5up = false;
		var isNav = false;
		var isIE = false;
		if (navigator.appName == "Netscape") {
			isNav =true;
			if (navigator.appVersion.search("5.0") == -1)
		   		isNav4 = true;
			else isNav5up = true;
		
			}
		else 
			isIE = true;
		
		
		function addValue(theColor,theValue) {
			//alert(theColor + "/" + theValue);
			if (isNav4) {
				var theForm = document.theButtons.document.forms[0];
			} else {
				var theForm = document.forms[0];
			}
			if ((isNaN(theForm.RedValue.value)) || (isNaN(theForm.GreenValue.value)) || (isNaN(theForm.BlueValue.value))) {
				alert("All color values must be numbers.");
			} else {
				var redValue = parseInt(theForm.RedValue.value);
				var greenValue = parseInt(theForm.GreenValue.value);
				var blueValue = parseInt(theForm.BlueValue.value);
				if (theColor==1) {
					redValue = redValue + theValue;
					if (redValue<0) redValue=0;
					if (redValue>255) redValue=255;
					theForm.RedValue.value = redValue;
				} else if (theColor==2) {
					greenValue = greenValue + theValue;
					if (greenValue<0) greenValue=0;
					if (greenValue>255) greenValue=255;
					theForm.GreenValue.value = greenValue;
				} else {
					blueValue = blueValue + theValue;
					if (blueValue<0) blueValue=0;
					if (blueValue>255) blueValue=255;
					theForm.BlueValue.value = blueValue;			
				}
				var redHex = getHexString(redValue);
				var greenHex = getHexString(greenValue);
				var blueHex = getHexString(blueValue);
				var hexString = "#" + redHex + greenHex + blueHex;
				setLayerBackgroundColor("ColorBox",hexString);
				moveLayer("RedLine",(redValue+hspc),26);
				moveLayer("GreenLine",(greenValue+hspc),51);
				moveLayer("BlueLine",(blueValue+hspc),76);
				//document.bgColor = hexString;
				//alert(hexString);
			}
		}
		function setOneColor(theColor,theValue) {
			//alert(theColor + "/" + theValue);
			if (isNav4) {
				var theForm = document.theButtons.document.forms[0];
				
			} else {
				//var theForm = document.all.theButtons.document.forms[0];
				var theForm = document.forms[0];
				
			}
			var redValue = parseInt(theForm.RedValue.value);
			var greenValue = parseInt(theForm.GreenValue.value);
			var blueValue = parseInt(theForm.BlueValue.value);
			var numValue = parseInt(theValue);
			if (numValue<0) numValue = 0;
			if (numValue>255) numValue = 255;
			if (theColor==1) {
				theForm.RedValue.value = numValue;
				redValue = numValue;
			} else if (theColor==2) {
				theForm.GreenValue.value = numValue;
				greenValue = numValue;
			} else {
				theForm.BlueValue.value = numValue;
				blueValue = numValue;			
			}
			var redHex = getHexString(redValue);
			var greenHex = getHexString(greenValue);
			var blueHex = getHexString(blueValue);
			var hexString = "#" + redHex + greenHex + blueHex;
			setLayerBackgroundColor("ColorBox",hexString);
			moveLayer("RedLine",(redValue+hspc),26);
			moveLayer("GreenLine",(greenValue+hspc),51);
			moveLayer("BlueLine",(blueValue+hspc),76);
			//document.bgColor = hexString;
			//alert(hexString);
		}
		function updateValues() {
			if (isNav) {
				var theForm = document.theButtons.document.forms[0];
			} else {
				var theForm = document.forms[0];
			}
			if ((isNaN(theForm.RedValue.value)) || (isNaN(theForm.GreenValue.value)) || (isNaN(theForm.BlueValue.value))) {
				alert("All color values must be numbers.");
			} else {
				var redValue = parseInt(theForm.RedValue.value);
				var greenValue = parseInt(theForm.GreenValue.value);
				var blueValue = parseInt(theForm.BlueValue.value);
				if (redValue<0) redValue=0;
				if (redValue>255) redValue=255;
				theForm.RedValue.value=redValue;
				if (greenValue<0) greenValue=0;
				if (greenValue>255) greenValue=255;
				theForm.GreenValue.value=greenValue;
				if (blueValue<0) blueValue=0;
				if (blueValue>255) blueValue=255;
				theForm.BlueValue.value=blueValue;
				var redHex = getHexString(redValue);
				var greenHex = getHexString(greenValue);
				var blueHex = getHexString(blueValue);
				var hexString = "#" + redHex + greenHex + blueHex;
				setLayerBackgroundColor("ColorBox",hexString);
				moveLayer("RedLine",(redValue+hspc),26);
				moveLayer("GreenLine",(greenValue+hspc),51);
				moveLayer("BlueLine",(blueValue+hspc),76);
				//document.bgColor = hexString;
			}
		
		}
		function getHexString(theValue) {
			var hexString = "00";
			if (theValue>0) {
				var the16s = 0;
				if (theValue>16) the16s = parseInt(theValue/16);
				var by16 = the16s * 16;
				var theOnes = theValue - by16;
				var string16 = new String(the16s);
				if (the16s>9) string16 = hexAF(the16s);
				var stringOne = new String(theOnes);
				if (theOnes>9) stringOne = hexAF(theOnes);
				hexString = string16 + stringOne;
			}
			return hexString;
		}
		function hexAF(theNum) {
			var theHex = "A";
			if (theNum==11) theHex="B";
			else if (theNum==12) theHex="C";
			else if (theNum==13) theHex="D";
			else if (theNum==14) theHex="E";
			else if (theNum==15) theHex="F";
			return theHex;
		}
		function getImageXY(e) {
			if (isNav) {
				mouseX=e.pageX;
				mouseY=e.pageY;
			} else {
				mouseX=event.clientX + document.body.scrollLeft;
				mouseY=event.clientY + document.body.scrollTop;
			}
			// subtract offsets from page left and top
			mouseX = mouseX-hspc;
			mouseY = mouseY-vspc;
			if (mouseX<0) mouseX = 0;
			if (mouseX>255) mouseX=255;
		
		}	
		
 		function doIt(i) {
			//alert(mouseX + " - "  + i);
			setOneColor(i,mouseX);
		}
		
		// Create a DHTML layer
		function createLayer(name, left, top, width, height, visible, content) {
			  var layer;
			  if (isNav4) {
			    document.writeln('<layer name="' + name + '" left=' + left + ' top=' + top + ' width=' + width + ' height=' + height +  ' visibility=' + (visible ? '"show"' : '"hide"') +  '>');
			    document.writeln(content);
			    document.writeln('</layer>');
			    //layer = getLayer(name);
			   // layer.width = width;
			   // layer.height = height;
			  //}
			  } else {
			 // if (isNav) {
			    document.writeln('<div id="' + name + '" style="position:absolute; overflow:none; left:' + left + 'px; top:' + top + 'px; width:' + width + 'px; height:' + height + 'px;' + ' visibility:' + (visible ? 'visible;' : 'hidden;') +  '">');
			    document.writeln(content);
			    document.writeln('</div>');
			  }
			  //clipLayer(name, 0, 0, width, height);
		}
		
		// get the layer object called "name"
		function getLayer(name) {
			  if (isNav4)
			    return(document.layers[name]);
			  else if (isIE) {
			    layer = eval('document.all.' + name + '.style');
			    return(layer);
			  } else if (isNav) {
			  	// layer = eval('document.' + name + '.css.style');
				var theElements = document.getElementsByTagName("DIV");
				var theObj;
				var j = -1;
				for (i=0;i<theElements.length;i++) {
					if (theElements[i].id==name) theObj = theElements[i].style;
				}
				return theObj
			  }
			  else
			    return(null);
		}
		
		// move layer to x,y
		function moveLayer(name, x, y) {		
		  	var layer = getLayer(name);		
		  	if (isNav4)
		    	layer.moveTo(x, y);
		  	//if (document.all) {
			 else {
		    	layer.left = x;
		   		 layer.top  = y;
		  	}
		}
		
		function setLayerBackgroundColor(name, color) {		
		  	var layer = getLayer(name);		
		 	 if (isNav4)
		    	layer.bgColor = color;
		  	else
		    	layer.backgroundColor = color;
		}