openlayer(二)util


//名字空间
OpenLayers.Util = {};
//根据ID获取DOMElement,当参数是多个ID时,返回的是一个DOMElement数组
OpenLayers.Util.getElement = function() {
var elements = [];
for (var i=0, len=arguments.length; i<len; i++) {
var element = arguments[i];
if (typeof element == 'string') {
element = document.getElementById(element);
}
if (arguments.length == 1) {
return element;
}
elements.push(element);
}
return elements;
};
//判断一下$符号有没有被别的库使用,如果没使用,那就把它指向getElement函数。这样使用的时候更方便一些。
if(typeof window.$ === "undefined") {
window.$ = OpenLayers.Util.getElement;
}
//extend在java中是继承的意思,这里执行一个源到目标的一个属性浅拷贝
OpenLayers.Util.extend = function(destination, source) {
destination = destination || {};
if(source) {
for(var property in source) {
var value = source[property];
if(value !== undefined) {
destination[property] = value;
}
}
//这里用来修正IE和Firefox的一个bug
var sourceIsEvt = typeof window.Event == "function"
&& source instanceof window.Event;
if(!sourceIsEvt
&& source.hasOwnProperty && source.hasOwnProperty('toString')) {
destination.toString = source.toString;
}
}
return destination;
};
//删除数组中的某一项
OpenLayers.Util.removeItem = function(array, item) {
for(var i = array.length - 1; i >= 0; i--) {
if(array[i] == item) {
array.splice(i,1);
//注意下面的注释,意思是如果使用break,那么只删掉最后一个item。如果去掉break,则意思是删掉所有的item。
//break;more than once??
}
}
return array;
};
//清空数组
OpenLayers.Util.clearArray = function(array) {
//Console是在控制台打印输出log,这里的控制台是指火狐的Firebug
OpenLayers.Console.warn(
//il8n是国际化支持,第一个参数是模板名字,后面是token的替换值
OpenLayers.i18n(
"methodDeprecated", {'newMethod': 'array = []'}
)
);
array.length = 0;
};
//这个是获取obj在array中的索引值,没有的话就返回-1
OpenLayers.Util.indexOf = function(array, obj) {
for(var i=0, len=array.length; i<len; i++) {
if (array[i] == obj) {
return i;
}
}
return -1;
};
//这里是修改一个DOMElement元素的属性值,element是DOMElement的引用,id是DOMElement的id,px是Pixel值,sz是Size值,position、border、overflow、opacity都是css得对应属性,分别是位置,边框,溢出,不透明度
OpenLayers.Util.modifyDOMElement = function(element, id, px, sz, position,
border, overflow, opacity) {
if (id) {
element.id = id;
}
if (px) {
element.style.left = px.x + "px";
element.style.top = px.y + "px";
}
if (sz) {
element.style.width = sz.w + "px";
element.style.height = sz.h + "px";
}
if (position) {
element.style.position = position;
}
if (border) {
element.style.border = border;
}
if (overflow) {
element.style.overflow = overflow;
}
if (parseFloat(opacity) >= 0.0 && parseFloat(opacity) < 1.0) {
element.style.filter = 'alpha(opacity=' + (opacity * 100) + ')';
element.style.opacity = opacity;
} else if (parseFloat(opacity) == 1.0) {
element.style.filter = '';
element.style.opacity = '';
}
};
//创建一个有指定属性的Div
OpenLayers.Util.createDiv = function(id, px, sz, imgURL, position,
border, overflow, opacity) {
//创建一个Div元素
var dom = document.createElement('div');
//如果有背景图片,则设置背景
if (imgURL) {
dom.style.backgroundImage = 'url(' + imgURL + ')';
}
//没有id的话,生成一个id,前缀是OpenLayersDiv
if (!id) {
id = OpenLayers.Util.createUniqueID("OpenLayersDiv");
}
//没有position的话,默认是绝对定位
if (!position) {
position = "absolute";
}
//设置其他参数
OpenLayers.Util.modifyDOMElement(dom, id, px, sz, position,
border, overflow, opacity);
//生成完毕,返回div
return dom;
};
//创建一个image,和创建div一样。
OpenLayers.Util.createImage = function(id, px, sz, imgURL, position, border,
opacity, delayDisplay) {
var image = document.createElement("img");
//set generic properties
if (!id) {
id = OpenLayers.Util.createUniqueID("OpenLayersDiv");
}
if (!position) {
position = "relative";
}
OpenLayers.Util.modifyDOMElement(image, id, px, sz, position,
border, null, opacity);
if(delayDisplay) {
image.style.display = "none";
//这是Openlayers的Event类封装了event对象,这个是给image注册onload事件,当发生这个时间时调用Openlayers.Util.onImageLoad函数
OpenLayers.Event.observe(image, "load",
OpenLayers.Function.bind(OpenLayers.Util.onImageLoad, image));
//这个同上,当加载图像失败时,它就用一个粉红色的背景图来替代
OpenLayers.Event.observe(image, "error",
OpenLayers.Function.bind(OpenLayers.Util.onImageLoadError, image));

}

//set special properties
image.style.alt = id;
//下面这个属性我还真不知道,baidu了一下发现时各IE6的过时属性,用来显示image tools工具条的。
image.galleryImg = "no";
if (imgURL) {
image.src = imgURL;
}

return image;
};
//设置元素的透明度
OpenLayers.Util.setOpacity = function(element, opacity) {
OpenLayers.Util.modifyDOMElement(element, null, null, null,
null, null, null, opacity);
};
//image加载时会调用这个函数
OpenLayers.Util.onImageLoad = function() {
if (!this.viewRequestID ||
(this.map && this.viewRequestID == this.map.viewRequestID)) {
this.style.backgroundColor ="transparent";
this.style.display = "";
}
};
//image加载出错时,显示的图像颜色,这个pink是粉红色,血难看!
OpenLayers.Util.onImageLoadErrorColor = "pink";
//image的加载次数
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 0;
//image加载失败时调用这个函数
OpenLayers.Util.onImageLoadError = function() {
this._attempts = (this._attempts) ? (this._attempts + 1) : 1;
if (this._attempts <= OpenLayers.IMAGE_RELOAD_ATTEMPTS) {
var urls = this.urls;
if (urls && urls instanceof Array && urls.length > 1){
var src = this.src.toString();
var current_url, k;
for (k = 0; current_url = urls[k]; k++){
if(src.indexOf(current_url) != -1){
break;
}
}
var guess = Math.floor(urls.length * Math.random());
var new_url = urls[guess];
k = 0;
while(new_url == current_url && k++ < 4){
guess = Math.floor(urls.length * Math.random());
new_url = urls[guess];
}
this.src = src.replace(current_url, new_url);
} else {
this.src = this.src;
}
} else {
this.style.backgroundColor = OpenLayers.Util.onImageLoadErrorColor;
}
this.style.display = "";
};

出处:http://blog.csdn.net/baozhifei/archive/2009/08/13/4444777.aspx
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值