// 创建弹窗对象的方法
|
var Popup = function(info){
|
this.constructor(info);
|
}
|
Popup.prototype.id=0;
|
Popup.prototype.dom=[];
|
Popup.prototype.constructor = function(info){
|
var _this = this;
|
_this.viewer = info.viewer;//弹窗创建的viewer
|
_this.geometry = info.geometry;//弹窗挂载的位置
|
_this.id = info.id;
|
_this.entity=info.entity;
|
_this.type=info.type;
|
_this.content=info.content;
|
_this.ctn = $("<div class='bx-popup-ctn' id = '"+_this.id+"'>");
|
|
var entity={"id":_this.id,"dom":_this.ctn};
|
Popup.prototype.dom.push(entity);
|
|
$(_this.viewer.container).append( _this.ctn);
|
//弹窗内容
|
var testConfig;
|
if(_this.type=="image"){
|
testConfig= {
|
header:_this.entity.title,
|
//header:"",
|
content:'<img class="image" style="width:100%;height:100%;max-width:200px;max-height:150px" src=""></img>'
|
}
|
}
|
else if(_this.type=="label"){
|
testConfig= {
|
header:_this.entity.title,
|
//header:"",
|
content:'<textarea class="textarea" style="color:white;width:100%;height:150px;max-width:200px;max-height:150px;background:transparent;"></textarea>'
|
}
|
}
|
_this.ctn.append(_this.createHtml(testConfig.header,testConfig.content,_this.id));
|
|
_this.render(_this.geometry);
|
_this.eventListener = _this.viewer.clock.onTick.addEventListener(function(clock) {
|
_this.render(_this.geometry);
|
})
|
}
|
// 实时刷新
|
Popup.prototype.render = function(geometry){
|
var _this = this;
|
var position = Cesium.SceneTransforms.wgs84ToWindowCoordinates(_this.viewer.scene,geometry)
|
if(position!=null){
|
let w=window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
|
let h=window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
let x=position.x- _this.ctn.get(0).offsetWidth/2
|
let y=position.y- _this.ctn.get(0).offsetHeight - 10;
|
if(x<0){
|
x=330;
|
}else if(x>w){
|
x=w;
|
}
|
if(y<0){
|
y=0
|
}
|
else if(y>h){
|
y=h;
|
}
|
_this.ctn.css("left",x);
|
_this.ctn.css("top",y);
|
}
|
}
|
// 动态生成内容
|
Popup.prototype.createHtml = function(header,content,id){
|
var html = '<div class="bx-popup-header-ctn">'+
|
header+
|
'</div>'+
|
'<div class="bx-popup-content-ctn" >'+
|
'<div class="bx-popup-content">'+
|
content+
|
'</div>'+
|
'</div>'+
|
'<div class="bx-popup-tip-container" >'+
|
// '<div class="bx-popup-tip" >'+
|
// '</div>'+
|
'</div>'+
|
'<a class="leaflet-popup-close-button" onClick="Popup.prototype.close(\''+id+'\')">X</a>';
|
return html;
|
}
|
// 关闭弹窗按钮
|
Popup.prototype.close=function(id){
|
var _this = this;
|
for(let i=0;i<_this.dom.length;i++){
|
if(_this.dom[i].id==id){
|
_this.dom[i].dom.hide();
|
// _this.dom.splice(i,1)
|
}
|
}
|
}
|
