K_ReverterMap2.0说明－基于google api

• K_ReverterMap2.0（是K_Reverter在Google Maps API2.0）
• K_ReverterMap2.0升级说明(向Google Maps API升级)
• K_ReverterMap说明
• Google Maps API 第2版文档
• 抽空写了一个点移动的类K_PointMover

K_ReverterMap2.0说明

• 公用函数和方法
  • K_Function(一些公用函数的集合，都是静态函数)
• 自定义地图类型MapTypes
  • K_51ditu_MAP(调用www.51ditu.com的地图API实现的地图类型)
• 自定义标记Overlays
  • K_IconOverlay(在地图上显示一个小图标的标注类型)
  • K_ImageOverlay(地图上显示一张地图图片的标注类型)
  • K_HtmlMarker(用来在地图上显示带文字的标记)
• 自定义控件Controls
  • K_CrossControl(显示地图中心十字的控件)
  • K_HtmlControl(在地图上显示HTML内容的控件)
• 其它相关类
  • K_PointMover(让点沿轨迹移动的类)
  • K_XmlLoader(快捷的载入Xml文件或访问WebService的类)
  • K_JsLoader(远程加载并运行一个JS文件)
  • K_UserPosition(根据IP显示用户所在地理位置的类)
  • K_MSOPEncryptPointSrv(使用MOSP的EncryptPoint服务进行灵图数据加密的对象)
  • K_MSOPGeoCodeSrv(使用MOSP的GeoCodeSrv服务载入灵图的地理编码信息对象)

本文来源于Step1，由K_Reverter撰写并随时修改，有任何问题请到评论区留言

自定义公用函数

K_Function(一些公用函数的集合)

我在这次升级的时候特意将所有公用函数函数组合到这个类的静态方法里面，使代码结构更加清晰，由于K_Function的方法都是静态方法，因此不需要构造而直接通过KFunction.functionName()形式调用即可

K_Function包含以下公用函数,都是静态函数

以下是该类的定义源码：

	function K_Function(){}
	//读取网址后缀的函数
	K_Function.GetQueryString=function(key)
	{
		var returnValue =""; 
		var sURL = window.document.URL;
		if (sURL.indexOf("?") > 0)
		{
			var arrayParams = sURL.split("?");
			var arrayURLParams = arrayParams[1].split("&");
			for (var i = 0; i < arrayURLParams.length; i++)
			{
				var sParam =  arrayURLParams[i].split("=");
				if ((sParam[0] ==key) && (sParam[1] != ""))
					returnValue=sParam[1];
			}
		}
		return returnValue;
	}
	K_Function.GetCallBack=function(obj,func)
	{
		return function(){return func.apply(obj,arguments)};
	}
	K_Function.InheritClass=function(a,b)
	{
		var c=function(){};
		c.prototype=b.prototype;
		a.prototype=new c();
	};
	//Cookie操作函数
	K_Function.GetCookieVal=function(offset)
	{
		var endstr = document.cookie.indexOf (";", offset);
		if (endstr == -1)
			endstr = document.cookie.length;
		return unescape(document.cookie.substring(offset, endstr));
	}
	K_Function.SetCookie=function(name, value)
	{
		var expdate = new Date();
		var argv = K_Function.SetCookie.arguments;
		var argc = K_Function.SetCookie.arguments.length;
		var expires = (argc > 2) ? argv[2] : null;
		var path = (argc > 3) ? argv[3] : null;
		var domain = (argc > 4) ? argv[4] : null;
		var secure = (argc > 5) ? argv[5] : false;
		if(expires!=null) expdate.setTime(expdate.getTime() + ( expires * 1000 ));
		document.cookie = name + "=" + escape (value) +((expires == null) ? "" : ("; expires="+ expdate.toGMTString()))+((path == null) ? "" : ("; path=" + path)) +((domain == null) ? "" : ("; domain=" + domain))+((secure == true) ? "; secure" : "");
	}
	K_Function.DelCookie=function(name)
	{
		var exp = new Date();
		exp.setTime(exp.getTime() - 1);
		var cval =K_GetCookie(name);
		document.cookie = name + "=" + cval + "; expires="+ exp.toGMTString();
	}
	K_Function.GetCookie=function(name)
	{
		var arg = name + "=";
		var alen = arg.length;
		var clen = document.cookie.length;
		var i = 0;
		while (i < clen)
		{
			var j = i + alen;
			if (document.cookie.substring(i, j) == arg)
				return K_Function.GetCookieVal(j);
			i = document.cookie.indexOf(" ", i) + 1;
			if (i == 0) break;
		}
		return null;
	}

自定义地图类型MapTypes

K_51ditu_MAP(调用灵图的地图API实现的地图类型)

K_51ditu_MAP采用Google新接口的模式实现，能够和Google比较完美的结合，这次升级的时候没有采用MOSP的模式，因为那个模式比较慢.

注意:根据Google文档的说明，向地图上添加类型最好在地图已经使用setCenter设置了地图的位置之后再运行，否则可能出错，而且假如你要使用GMapTypeControl控件显示地图类型列表，一定要在使用前添加K_51ditu_MAP，否则不会显示在列表之中。

以下是一个使用范例：

	map.addMapType(K_51ditu_MAP);
	map.setMapType(K_51ditu_MAP);

自定义标记 Overlays

K_ImageOverlay(用来在地图上显示一张图片的控件)

K_ImageOverlay是一个自定义的Overlay,用法和Google Map中自定义的GMarker和GPolyline差不多，都是通过GMap2的addOverlay(overlay)添加到地图之中，通过removeOverlay(overlay)从地图中移除。

千万注意:考虑到系统性能的问题，一张图片在地图缩放级别变化时可能被显示的很大，这样可能影响性能

当显示的问题解决，最大的问题就在于怎样才能知道一张图片显示所需要的GLatLngBounds和rotation的值呢？这个问题比较复杂，我尝试写了一个WebService能够还算有点精确的处理这个问题，如果WebService客户端在地图上取三个特征点，将三个特征点在图片上的坐标和经纬度坐标发送到WebService,就能从返回结果中获得该GBounds和rotation的值，WebService的地址在http://www.step1.cn/map/addOverlay.asmx，更具体的内容我会在以后专文讨论。

K_ImageOverlay的构造函数有4个参数，分别为

使用这样几个参数是有原因的，因为在Google Earth的KML文件之中，添加一个图片在Google Earth主要就是这几个参数，因此，使用此控件来显示从KML文件中读取出来的GroundOverlay,直接将参数传递即可，不需要任何形式的转化。

K_ImageOverlay主要方法有

以下是该类的定义源码：

//地图上显示一张地图图片的标注类型
	function K_ImageOverlay(imageUrl,bounds,rotation,opacity)
	{
		this.imageUrl=imageUrl;
		this.bounds=bounds;
		this.rotation=-rotation;
		this.opacity=opacity||0.45;
	}
	K_ImageOverlay.prototype = new GOverlay();
	K_ImageOverlay.prototype.initialize=function(a)
	{
		this.map=a;
		if(this.rotation>5 || this.rotation<-5)
		{
			this.drawElement=document.createElement("v:Image");
			this.drawElement.style.rotation=this.rotation;
		}
		else
			this.drawElement=document.createElement("img");
		this.drawElement.title=this.imageUrl;
		this.drawElement.style.position="absolute";
		this.drawElement.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+(this.opacity*100)+");";
		this.drawElement.src=this.imageUrl;
		if(document.all==1)
		{
			this.drawElement.unselectable="on";
			this.drawElement.onselectstart=function(){return false};
			this.drawElement.galleryImg="no"
		}
		else
		{
			this.drawElement.style.MozUserSelect="none"
		}
		this.drawElement.style.border="0";
		this.drawElement.style.padding="0";
		this.drawElement.style.margin="0";
		this.drawElement.oncontextmenu=function(){return false};
		a.getPane(G_MAP_MARKER_PANE).appendChild(this.drawElement);
	};
	K_ImageOverlay.prototype.redraw=function(a)
	{
		if(!a)return;
		var min=this.map.fromLatLngToDivPixel(this.bounds.getSouthWest());
		var max=this.map.fromLatLngToDivPixel(this.bounds.getNorthEast());
		this.drawElement.style.left=(min.x)+"px";
		this.drawElement.style.top=(max.y)+"px";
		this.drawElement.style.width=(max.x-min.x)+"px";
		this.drawElement.style.height=(min.y-max.y)+"px";
	};
	K_ImageOverlay.prototype.setOpacity=function(opacity)
	{
		this.opacity=opacity||0.45;
		this.drawElement.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+(this.opacity*100)+");";
	}
	K_ImageOverlay.prototype.copy=function()
	{
		return new K_ImageOverlay(this.imageUrl,this.bounds,this.rotation,this.opacity)
	};
	K_ImageOverlay.prototype.remove=function()
	{
		this.drawElement.parentNode.removeChild(this.drawElement);
	}

以下是一个使用范例：

	var bounds=new GLatLngBounds(new GLatLng(18.0400740574296,108.548384827952),new GLatLng(20.3537745028853,111.729042228649));
	imageOverlay=new K_ImageOverlay("http://www.gogocn.com/admin/map/map_hainan.jpg",bounds,0,0.5);
	map.addOverlay(imageOverlay);

K_IconOverlay(在地图上显示一个小图标的对象)

K_IconOverlay是一个自定义的Overlay,用法和Google Map中自定义的GMarker和GPolyline差不多，都是通过GMap2的addOverlay(control)添加到地图之中，通过removeOverlay(control)从地图中移除。

K_IconOverlay用来向地图上添加一个图标，同样是向地图上添加一个图片，该图标和K_ImageOverlay不同在于，K_ImageOverlay主要是用来添加地图图片，而这个主要是添加一个图标，功能开发的侧重点不同。

K_IconOverlay功能非常强大，除了可以指定大小之外，甚至还可以从一张大图片上截取一小块图片作为图标，这个功能开发不仅仅是为了显得Cool，因为在Google Earth的KML文件之中，很多图标就是这样存放的，支持这个功能就等于可以在Google Map之中查看KML地标文件中的标记，而且是能将Google Earth的集成图标显示出来，想必是比较实用的

K_IconOverlay的构造函数有4个参数，分别为

K_IconOverlay完全参照于GMarker，该Overlay提供的方法和使用方式完全可以参照GMarker.

如果要给此K_IconOverlay添加infowindow的显示，也可以完全参照GMarker的用法，具体可以查看范例(8.markerinfowindow.html)

以下是该类的定义源码：

//在地图上显示一个小图标的标注类型
	function K_IconOverlay(imageUrl,point,scale,bounds,color)
	{
		this.imageUrl=imageUrl;
		this.point=point;
		this.scale=scale?scale:1;
		this.bounds=bounds;
		this.color=color;
		this.icon=new Object();
		this.icon.iconSize=new GSize(this.scale*32,this.scale*32);
	}
	K_IconOverlay.prototype = new GOverlay();
	K_IconOverlay.prototype.initialize=function(a)
	{
		this.map=a;
		this.div=document.createElement("img");
		a.getPane(G_MAP_MARKER_PANE).appendChild(this.div);
		GEvent.bindDom(this.div,"load",this,this.setClip);
		this.div.style.display="none";
		this.div.src=this.imageUrl;
		this.div.style.position="absolute";
		if(document.all)
		{
			this.div.unselectable="on";
			this.div.onselectstart=function(){return false};
			this.div.galleryImg="no";
			this.div.style.filter="progid:DXImageTransform.Microsoft.Chroma(color='#"+this.color+"')";
		}
		else
		{
			this.div.style.MozUserSelect="none";
		}
		this.div.style.border="0";
		this.div.style.padding="0";
		this.div.style.margin="0";
		color=(this.color)?this.color:"FFFFFF";
		this.div.style.cursor=document.all?"hand":"pointer";
		this.div.oncontextmenu=function(){return false};
		GEvent.bindDom(this.div,"mousedown",this,this.onMouseDown);
	};
	K_IconOverlay.prototype.setClip=function()
	{
		this.div.style.display='';
		this.currentSize=new GSize(this.div.offsetWidth,this.div.offsetHeight);
		if(this.bounds)
		{
			this.div.style.clip="rect("+((this.currentSize.height-this.bounds.maxY)*this.scale)+"px "+(this.bounds.maxX*this.scale)+"px "+((this.currentSize.height-this.bounds.minY)*this.scale)+"px "+(this.bounds.minX*this.scale)+"px)";
			this.icon.iconSize=new GSize(this.scale*(this.bounds.maxX-this.bounds.minX),this.scale*(this.bounds.maxY-this.bounds.minY));
		}
		else
			this.icon.iconSize=new GSize(this.scale*this.currentSize.width,this.scale*this.currentSize.height);
		this.div.width=(this.currentSize.width*this.scale);
		this.div.height=(this.currentSize.height*this.scale);
		this.div.style.display='';
		this.redraw(true);
	}
	K_IconOverlay.prototype.remove=function()
	{
		this.div.parentNode.removeChild(this.div);
	};
	K_IconOverlay.prototype.setPoint=function(point)
	{
		this.point=point;
		this.redraw(true);
	};
	K_IconOverlay.prototype.getIcon=function()
	{
		return this.icon;
	};
	K_IconOverlay.prototype.copy=function()
	{
		return new K_IconOverlay(this.imageUrl,this.point,this.scale,this.bounds,this.color);
	};
	K_IconOverlay.prototype.redraw=function(a)
	{
		if(!a)return;
		if(!this.currentSize)return;
		var c=this.map.fromLatLngToDivPixel(this.point);
		if(this.bounds)
		{
			this.div.style.left=(c.x-(this.bounds.maxX+this.bounds.minX)/2*this.scale)+"px";
			this.div.style.top=(c.y-(this.currentSize.height*2-this.bounds.maxY-this.bounds.minY)/2*this.scale)+"px";
		}
		else
		{
			this.div.style.left=(c.x-this.currentSize.width*this.scale/2)+"px";
			this.div.style.top=(c.y-this.currentSize.height*this.scale/2)+"px";
		}
	};
	K_IconOverlay.prototype.onMouseDown=function(a)
	{
		if(document.all)
		{
			window.event.cancelBubble=true;
			window.event.returnValue=false
		}
		else
		{
			a.cancelBubble=true;
			a.preventDefault();
			a.stopPropagation()
		}
		GEvent.trigger(this,"click",this);
	};
	K_IconOverlay.prototype.openInfoWindowHtml=function(html)
	{
		this.map.openInfoWindowHtml(this.point,html);
	}

以下是一个使用范例：

	var point=new GLatLng(29.94176113301537,112.6857368551186);
	iconOverlay=new K_IconOverlay("/Map/Icons/palette-2.png",point,1,new GBounds(160,192,192,224));
	map.addOverlay(iconOverlay);

K_HtmlMarker(用来在地图上显示带文字的标记)

K_HtmlMarker是一个自定义的Overlay,用法和Google Map中自定义的GMarker和GPolyline差不多，都是通过GMap2的addOverlay(control)添加到地图之中，通过removeOverlay(control)从地图中移除。

这次更新对K_HtmlMarker进行了大幅调整，以前K_HtmlMarker是一个独立的Overlay,而现在,K_HtmlMarker的主要功能是在原有的Marker旁边添加文字而成为一个新的Marker,我觉得这样组织比较灵活，本来我更希望能做一个类似于GIcon的对象，可是后来发现GIcon和Gmarker从代码上来讲密不可分，所以我只好采用了这个方案。

该控件名称为K_HtmlMarker来自于它的上一个版本的设计构思，实际上不推荐在名称之中使用HTML语法，当然，简单的比如字体颜色是没有问题的

K_HtmlMarker的构造函数有3个参数，分别为

K_HtmlMarker虽然本身包含一个Overlay,可是使用方法和一个单一的Overlay没有什么不同，该Overlay提供的方法和使用方式完全可以参照GMarker.

如果要给此K_HtmlMarker添加infowindow的显示，也可以完全参照GMarker的用法，具体可以查看范例(8.markerinfowindow.html)

以下是该类的定义源码：

//自定义的HTML marker标注类型，以指定点显示HTML内容
	function K_HtmlMarker(icon,point,html)
	{
		this.icon=icon;
		this.point=point;
		this.html=html;
	}
	K_HtmlMarker.prototype = new GOverlay();
	K_HtmlMarker.prototype.initialize=function(a)
	{
		this.map=a;
		a.addOverlay(this.icon);
		this.icon.setPoint(this.point);
		this.icon.initialize(a);
		GEvent.bindDom(this.icon,"mousedown",this,this.onMouseDown);
		this.div=document.createElement("span");
		this.div.align="left";
		this.div.style.position="absolute";
		this.div.style.cursor="default";
		this.div.style.width="200px";
		this.div.innerHTML=this.html;
		a.getPane(G_MAP_MARKER_PANE).appendChild(this.div);
		GEvent.bind(this.icon,"click",this,this.onMouseDown);
	};
	K_HtmlMarker.prototype.remove=function(){this.icon.remove();if(this.div&&this.div.parentNode){this.div.parentNode.removeChild(this.div)}};
	K_HtmlMarker.prototype.copy=function()
	{
		return new K_HtmlMarker(this.icon.copy(),this.point,this.html)
	};
	K_HtmlMarker.prototype.redraw=function(a)
	{
		this.icon.redraw(a);
		if(!a)return;
		var c=this.map.fromLatLngToDivPixel(this.point);
		iconSize=this.icon.getIcon().iconSize?this.icon.getIcon().iconSize:new GSize(32,32);
		this.div.style.left=(c.x+iconSize.width/2)+"px";
		this.div.style.top=(c.y-this.div.offsetHeight/2)+"px";
	};
	K_HtmlMarker.prototype.onMouseDown=function(a)
	{
		if(document.all)
		{
			window.event.cancelBubble=true;
			window.event.returnValue=false
		}
		else
		{
			a.cancelBubble=true;
			a.preventDefault();
			a.stopPropagation()
		}
		GEvent.trigger(this,"click",this);
	};
	K_HtmlMarker.prototype.openInfoWindowHtml=function(html)
	{
		this.map.openInfoWindowHtml(this.point,html);
	}

以下是一个使用范例：

	var point=new GLatLng(29.94176113301537,112.6857368551186);
	htmlOverlay=new K_HtmlMarker(new GMarker(point),point,"My Hometown");
	map.addOverlay(htmlOverlay);

自定义控件Controls

K_CrossControl(显示地图中心十字的控件)

K_CrossControl是一个自定义的Control,用法和Google Map中自定义的控件差不多，都是通过GMap2的addControl(control) 添加到地图之中，通过removeControl(control) 从地图中移除。

K_CrossControl会在地图上显示一个十字准星，当需要用户在地图上选择一个点的时候非常有用，

K_CrossControl这次更新有所改动，现在在地图大小可能变化的时候也能运行正常了

K_CrossControl更新到2.0之后取消了VML的显示模式，同意都采用图片的形式显示

K_CrossControl的构造函数有2个参数，都是可选参数，分别为

image	中心十字图片的路径，默认为[http://www.step1.cn/map/cross.gif]
size	中心十字图片的大小，默认为20*20

以下是该类的定义源码：

//显示地图中心十字的控件
	function K_CrossControl(image,size)
	{
		this.size=size?size:new GSize(20,20);
		this.image=image?image:"http://www.step1.cn/map/cross.gif";
		this.div=document.createElement("div");
		this.img=document.createElement("img");
		this.div.appendChild(this.img);
		this.div.style.position="absolute";
		this.img.style.position="absolute";
	}
	K_CrossControl.prototype=new GControl(true,false);
	K_CrossControl.prototype.initialize=function(map)
	{
		if(this.img.src!=this.image)
		{
			this.img.src=this.image;
		}
		this.img.width=this.size.width;
		this.img.height=this.size.height;
		this.resetSize();
		map.getContainer().appendChild(this.div);
		GEvent.bind(map,"resize",this,this.resetSize());
		return this.div;
	}
	K_CrossControl.prototype.resetSize=function()
	{
		this.img.style.left=(map.getSize().width/2-this.size.width/2)+"px";
		this.img.style.top=(map.getSize().height/2-this.size.height/2)+"px";
	}
	K_CrossControl.prototype.getDefaultPosition=function()
	{
		return new GControlPosition(G_ANCHOR_TOP_LEFT,new GSize(0,0));
	}

以下是一个使用范例：

	map.addControl(new K_CrossControl());

K_HtmlControl(在地图上显示HTML内容的对象)

K_HtmlControl是一个自定义的Control,用法和Google Map中自定义的控件差不多，都是通过GMap2的addControl(control) 添加到地图之中，通过removeControl(control) 从地图中移除。

K_HtmlControl用来在地图上指定位置显示一个自定义的HTML内容。

K_HtmlControl的构造函数有1个参数

以下是该类的定义源码：

	function K_HtmlControl(html)
	{
		this.html=html;
	}
	K_HtmlControl.prototype=new GControl(true,false);
	K_HtmlControl.prototype.initialize=function(a)
	{
		this.Map=a;
		this.div=document.createElement("div");
		this.div.style.cursor="default";
		this.div.style.position="absolute";
		this.div.unselectable="on";
		this.div.onselectstart=function(){return false};
		this.div.style.fontSize="11px";
		this.div.style.fontFamily="Arial, sans serif";
		this.div.style.MozUserSelect="none"
		this.div.innerHTML=this.html;
		a.getContainer().appendChild(this.div);
		GEvent.bindDom(this.div,"click",this,this.onClick);
		return this.div;
	};
	K_HtmlControl.prototype.getDefaultPosition=function()
	{
		return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT,new GSize(10,10))
	};
	K_HtmlControl.prototype.onClick=function()
	{
		GEvent.trigger(this,"click");
	}

以下是一个使用范例：

	htmlControl=new K_HtmlControl("<div style='padding:3;background-color:white;border:solid 1 black;cursor:hand;'>www.step1.cn</div>");
	map.addControl(htmlControl);
	GEvent.addListener(htmlControl,"click",function(){self.location="http://www.step1.cn";});

其它相关类

K_PointMover(让点沿轨迹移动的类)

K_PointMover用来让一个地理点按照指定的速度沿着指定的轨迹移动，有了这个类，我们就可以非常容易的实现让一个地图上的Overlay在地图上移动(类似有的网站查询行车路线后的车跑动的示例)，或者是让地图自身自动的移动位置

K_PointMover的构造函数有4个参数

K_PointMover有2个方法

以下是该类的定义源码：

	function K_PointMover(points,time,rate,handle)
	{
		this.points=points;
		this.time=time?time:100;
		this.rate=rate?rate:1;
		this.handle=handle;
		this.pointsIndex=0;
		this.numberIndex=0;
	}
	K_PointMover.prototype.Move=function()
	{
		if(!this.timer)
		{
			this.timer=setInterval(K_Function.GetCallBack(this,this.Move),this.time);
			this.point=this.points[this.pointsIndex];
			if(this.handle)
			{
				this.handle.call(null,this);
			}
			return;
		}
		else
		{
			if(!this.offset)
			{
				offsetX=this.points[this.pointsIndex+1].lng()-this.points[this.pointsIndex].lng();
				a=Math.log((1+Math.sin(this.points[this.pointsIndex].lat()*Math.PI/180))/(1-Math.sin(this.points[this.pointsIndex].lat()*Math.PI/180)))*180/Math.PI/2;
				a1=Math.log((1+Math.sin(this.points[this.pointsIndex+1].lat()*Math.PI/180))/(1-Math.sin(this.points[this.pointsIndex+1].lat()*Math.PI/180)))*180/Math.PI/2;
				offsetY=a1-a;//this.points[this.pointsIndex+1].lat()-this.points[this.pointsIndex].lat();
				offset=Math.sqrt(Math.pow(offsetX,2)+Math.pow(offsetY,2));
				if(offset==0)
					this.offset=new GSize(0,0);
				else
					this.offset=new GSize(offsetX/offset,offsetY/offset);
			}
			var lng=this.points[this.pointsIndex].lng()+this.rate*this.offset.width*(this.numberIndex+1);
			var lat=Math.log((1+Math.sin(this.points[this.pointsIndex].lat()*Math.PI/180))/(1-Math.sin(this.points[this.pointsIndex].lat()*Math.PI/180)))*180/Math.PI/2+this.rate*this.offset.height*(this.numberIndex+1);
			lat=(Math.asin((Math.pow(Math.E,lat*Math.PI/180*2)-1)/(Math.pow(Math.E,lat*Math.PI/180*2)+1))*180/Math.PI);
			if((lng-this.points[this.pointsIndex].lng())*(lng-this.points[this.pointsIndex+1].lng())<0 || (lat-this.points[this.pointsIndex].lat())*(lat-this.points[this.pointsIndex+1].lat())<0)
			{
				this.point=new GLatLng(lat,lng);
				if(this.handle)
					this.handle.call(null,this);
				this.numberIndex++;
			}
			else
			{
				this.pointsIndex++;
				this.numberIndex=0;
				this.offset=null;
				this.point=this.points[this.pointsIndex];
				if(this.handle)
					this.handle.call(null,this);
				if(this.pointsIndex>=this.points.length-1)
				{
					clearInterval(this.timer);
					this.pointsIndex=0;
					this.numberIndex=0;
				}
			}
		}
	}
	K_PointMover.prototype.Pause=function()
	{
		if(this.timer)
		{
			clearInterval(this.timer);
			this.timer=null;
		}
	}

以下是一个使用范例：

var map;
var moveMarker,pointMover;
function onLoad()
{
	map = new GMap2(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.addControl(new K_CrossControl());
	map.setCenter(new GLatLng(36.94,106.08),4);
	var points=[new GLatLng(53.561,123.261),new GLatLng(18.161,109.572),new GLatLng(39.465,73.657),new GLatLng(48.277,134.708),new GLatLng(53.561,123.261)];
	var polyline=new GPolyline(points);
	map.addOverlay(polyline);
	moveMarker=new GMarker(points[0]);
	map.addOverlay(moveMarker);
	pointMover=new K_PointMover(points,100,0.1,MapMove);
}
function MapMove(pointMover)
{
	if(document.getElementById("MarkerMove").checked)
		moveMarker.setPoint(pointMover.point);
	if(document.getElementById("MapMove").checked)
		map.panTo(pointMover.point);
}

K_XmlLoader(快捷的载入Xml文件或访问WebService的类)

K_XmlLoader 由于可能用到的KML文件和WebService比较多，因此我使用这个类来统一访问代码,该类完成从访问到返回结果的XML解析部分，如果该结果不能被解析为XML，则弹出包含该结果的警告而停止运行，因此在调用parseHandle参数中的句柄的时候表明该XML文档正常

K_XmlLoaderK_XmlLoader使用到了一个简单的函数K_Function.K_GetCallBack，因此，使用时必须包含该函数才能运行

K_XmlLoader的构造函数有1个参数

K_XmlLoader只有一个Load方法

以下是该类的定义源码：

	function K_XmlLoader(parseHandle)
	{
		this.parseHandle=parseHandle;
		this.xmlhttp =null;
	}
	K_XmlLoader.prototype.Load=function(url,postData)
	{
		this.url=url;
		this.xmlhttp =GXmlHttp.create();
		var method="GET";
		if(postData && postData.length>0)
			method="POST";
		this.xmlhttp.open(method,this.url,true);
		this.xmlhttp.onreadystatechange=K_Function.GetCallBack(this,this.ParseXmlFile);
		if(postData && postData.length>0)
		{
			this.xmlhttp.setRequestHeader ("Content-Type","text/xml; charset=utf-8"); 
			this.xmlhttp.setRequestHeader ("SOAPAction","\"\""); 
		}
		this.xmlhttp.send(postData);
	}
	K_XmlLoader.prototype.ParseXmlFile=function()
	{
		if(this.xmlhttp==null || this.xmlhttp.readyState!=4)
			return;
		this.xmlDoc = this.xmlhttp.responseXML;
		if(this.xmlDoc.documentElement==null && this.xmlhttp.responseText &&　this.xmlhttp.responseText!="")
		{
			try{this.xmlDoc=GXml.parse(this.xmlhttp.responseText);}
			catch(ce){}
		}
		if(this.xmlDoc.documentElement==null)
			this.responseText=this.xmlhttp.responseText;
		this.xmlhttp=null;
		if(this.parseHandle)
			this.parseHandle.call(null,this);
		GEvent.trigger(this,"loaded",this);
	}

以下是一个使用范例：

	var url=window.prompt('Xml File Path:','12.data.xml');
	var xmlLoader=new K_XmlLoader(ReadXml);
	xmlLoader.Load(url,data);
	function ReadXml(xl)
	{
		alert(xl.xmlDoc.xml);
          var markers = xl.xmlDoc.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var point = new GPoint(parseFloat(markers[i].getAttribute("lng")),
                                   parseFloat(markers[i].getAttribute("lat")));
	    var marker =new GMarker(point);
            map.addOverlay(marker);
          }
	}

K_JsLoader(远程加载并运行一个JS文件)

K_JsLoader 远程加载并运行一个JS文件，当完成后，调用传入的句柄,如果要返回值，请在该JS文件之中给变量window._OLR赋值，该值就将会被作为参数传递给处理函数

K_JsLoaderK_LoadJS使用到了一个简单的函数K_Function.K_GetCallBack，因此，使用时必须包含该函数才能运行

K_JsLoader的构造函数有1个参数

K_XmlLoader只有一个load方法

以下是该类的定义源码：

	function K_JsLoader(parseHandle)
	{
		this.parseHandle=parseHandle;
	}
	K_JsLoader.prototype.load=function(src)
	{
		if(!this.jsFile)
		{
			this.jsFile=document.createElement("script");
			this.jsFile.type="text/javascript";
			this.jsFile.defer=true;
			document.body.insertBefore(this.jsFile,document.body.firstChild);
			GEvent.bindDom(this.jsFile,"readystatechange",this,this.onReadyStateChange);
			GEvent.bindDom(this.jsFile,"load",this,this.onLoad);
		}
		this.jsFile.src=src;
		this.running=true;
	}
	K_JsLoader.prototype.onLoad=function(e)
	{
		if(window._OLR)
		{
			GEvent.trigger(this,"loaded",K_JsLoader.parseObject(window._OLR));
			if(this.parseHandle)
				this.parseHandle.call(null,window._OLR);
		}
		else
		{
			GEvent.trigger(this,"error");
		}
		window._OLR=null;
		if(!document.all && this.jsFile && this.jsFile.parentNode==document.body)
		{
			this.jsFile.removeAttribute("src");
			document.body.removeChild(this.jsFile);
			delete this.jsFile;
		}
		this.running=false;
	}
	K_JsLoader.parseObject=function(obj)
	{
		return obj;
	}
	K_JsLoader.prototype.onReadyStateChange=function(e)
	{
		if(!this.jsFile || this.jsFile.readyState!="loaded")
		{
			return;
		}
		this.onLoad();
	}
	K_JsLoader.getChild=function(arr,name)
	{
		for(var i=0;i< arr.childNodes.length;i++)
		{
			if(arr.childNodes[i].name==name)
			{
				return arr.childNodes[i];
			}
		}
	}

以下是一个使用范例：

	var url=window.prompt('Xml File Path:','12.data.xml');
	var xmlLoader=new K_XmlLoader(ReadXml);
	xmlLoader.Load(url,data);
	function ReadXml(xl)
	{
		alert(xl.xmlDoc.xml);
          var markers = xl.xmlDoc.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var point = new GPoint(parseFloat(markers[i].getAttribute("lng")),
                                   parseFloat(markers[i].getAttribute("lat")));
	    var marker =new GMarker(point);
            map.addOverlay(marker);
          }
	}

K_UserPosition(根据IP显示用户所在地理位置的类)

K_UserPosition是一个使用Microsoft VE控件获取用户所在位置的类，如果用户已经安装VE控件，则返回VE控件记录的地理位置(由用户自己选择位置)，否则则直接使用IP,并通过Microsoft的JS文件实现IP到地理经纬度的转换。

K_UserPosition的构造函数没有参数，并且只有一个Load方法

该控件使了一个函数K_LoadJS来载入JS文件，因此，必须包含本函数，该类才能正常使用

以下是该类的定义源码：

//这是调用用户所在地点的对象
	function K_UserPosition()
	{
		this.loaded=false;
	}
	K_UserPosition.prototype.Load=function(handle)
	{
		this.handle=handle;
		this.LoadByWiFi();
	}
	K_UserPosition.prototype.LoadByWiFi=function()
	{
		var wifi=this.GetWiFiControl();
		if(wifi)
		{
			try
			{
				var results = wifi.GetLocation();
				if(results&&results.length>0)
					{eval(results);return;}
			}
			catch(ex){}
		}
		window.SetAutoLocateViewport=K_Function.GetCallBack(this,this.SetAutoLocateViewport);
		window.ShowMessage=K_Function.GetCallBack(this,this.ShowMessage);
		new K_JsLoader().load("http://virtualearth.msn.com/WiFiIPService/locate.ashx?pos=");
	}
	K_UserPosition.prototype.GetWiFiControl=function()
	{
		var wifi=null;
		try
		{
			wifi=new ActiveXObject("WiFiScanner");
		}
		catch(e)
		{
			try
			{
				wifi=new ActiveXObject("Microsoft.MapPoint.WiFiScanner.1");
			}
			catch(e)
			{
				try
				{
					wifi=new WiFiScanner("Microsoft.MapPoint.WiFiScanner.1");
				}
				catch(e)
				{}
			}
		}
		return wifi;
	}
	K_UserPosition.prototype.ShowMessage=function(message)
	{
	}
	K_UserPosition.prototype.SetAutoLocateViewport=function(lat,lon,zoom,pin,message)
	{
		if(this.loaded)
			return;
		this.point=new GLatLng(lat,lon);
		this.zoom=17-zoom;
		this.pin=pin;
		this.message=message;
		this.loaded=true;
		if(this.handle)
		{
			this.handle.apply(this);
			this.handle=null;
		}
	}

以下是一个使用范例：

	var userPosition=new K_UserPosition();
	userPosition.Load(function(){
		map.setCenter(this.point,this.zoom);
		var marker=new GMarker(this.point);
		map.addOverlay(marker);
		GEvent.addListener(marker,"click",function(){marker.openInfoWindowHtml('You Position');});
	});

K_MSOPEncryptPointSrv(使用MOSP的EncryptPoint服务进行灵图数据加密的对象)

K_MSOPEncryptPointSrv灵图的使用的经纬度坐标大约是经纬度坐标乘以100000的坐标，可是毕竟只是大约，所以需要进行精确的转换，就要使用本对象

K_MSOPEncryptPointSrv定义之中使用到了K_JsLoader，因此，使用时必须包含这些内容才能运行

K_MSOPEncryptPointSrv的构造函数有1个参数

K_MSOPEncryptPointSrv提供一个方法

以下是该类的定义源码：

	function K_MSOPEncryptPointSrv(handle)
	{
		this.handle=handle;
		this.loader=new K_JsLoader();
		GEvent.bind(this.loader,"loaded",this,this.onLoad);
	}
	K_MSOPEncryptPointSrv.prototype.EncryptPoint=function(points,handle)
	{
		if(handle){this.handle=handle;}
		var str="http://www.step1.cn/51Ditu/Services/JsEP.aspx?";
		for(var i=0;i< points.length;i++)
		{
			str+=parseInt(points[i].lng()*100000)+","+parseInt(points[i].lat()*100000)+";";
		}
		str=str.substring(0,str.length-1);
		this.loader.load(str);
	}
	K_MSOPEncryptPointSrv.prototype.onLoad=function(resultObj)
	{
		GEvent.trigger(this,"end",resultObj);
		if(this.handle){this.handle.apply(this,[resultObj]);}
	}

以下是一个使用范例：

var map,eps,point;
function onLoad()
{
	map = new GMap2(document.getElementById("map"));
	map.setCenter(new GLatLng(36.94989178681327,106.083984375),6);
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());

	eps=new K_MSOPEncryptPointSrv(SetInfo);
	ChangeInfo();
	GEvent.addListener(map,"moveend",ChangeInfo);
}
function ChangeInfo()
{
	point=map.getCenter();
	eps.EncryptPoint([point]);
}
function SetInfo(points)
{
	html='The Latlng of Center:('+point.lng()+','+point.lat()+')
';
	html=html+'The MOSP coordinate of Center:('+points[0][0]+','+points[0][1]+')';
	document.getElementById("Info").innerHTML=html;
}

K_MSOPGeoCodeSrv(使用MOSP的GeoCodeSrv服务载入灵图的地理编码信息对象)

K_MSOPGeoCodeSrv根据灵图的服务，进行从经纬度到地理信息的查询，例如，根据经纬度(114.11465,22.56203)得到的查询结果是："广东省深圳市罗湖区洪湖西路和洪湖东路交叉口东北321米处,湖景花园西北97米处"。

K_MSOPGeoCodeSrv定义之中使用到了K_JsLoader

K_MSOPGeoCodeSrv的构造函数有1个参数

K_MSOPGeoCodeSrv提供一个方法

以下是该类的定义源码：

	function K_MSOPGeoCodeSrv(handle)
	{
		this.handle=handle;
		this.status=0;
		this.loader=new K_JsLoader();
		GEvent.bind(this.loader,"loaded",this,this.onLoad);
	}
	K_MSOPGeoCodeSrv.prototype.GetGeoCode=function(point)
	{
		if(73.12667>point.lng() || point.lng()>135.21180 || 18.12810>point.lat() || point.lat()>55.15600)
		{
			this.status=-1;
			this.handle.apply(this);
			return;
		}
		this.status=1;
		this.point=point;
		var str="http://www.step1.cn/51Ditu/Services/GeoCodeSrv.aspx?lng="+point.lng()+"&lat="+point.lat();
		this.loader.load(str);
	}
	K_MSOPGeoCodeSrv.prototype.onLoad=function(resultObj)
	{
		this.result=decodeURI(resultObj.result).replace(/%2c/gim," ");
		this.status=2;
		GEvent.trigger(this,"end",this);
		if(this.handle){this.handle.call(null,this);}
	}

以下是一个使用范例：

	autoGeoCode=new K_MSOPGeoCodeSrv(SetGeoCodeInfo);
	GEvent.addListener(map,"moveend",function(){autoGeoCode.GetGeoCode(map.getCenter());});
	autoGeoCode.GetGeoCode(map.getCenter());
	function SetGeoCodeInfo(geoCode)
	{
		if(geoCode.status==2)
			document.getElementById("Info").innerHTML=geoCode.result;
	}