效果
数据结构
getQyHtXqTj: {
"msg": "操作成功",
"flag": true,
"rows": [{
"num": 133,
"my": 0,
"rmb": 0,
"name": "名称",
"code": 2,
"x": 8.092329,
"y": 10.137400
}, {
"num": 64,
"my": 0,
"rmb": 0,
"name": "名称",
"code": 3,
"x": 24.778300,
"y": -20.000000
}],
"status": "C00000"
},
1.请求数据
// 请求列表数据接口查询
getDate: function() {
var options = new Object();
options.url = "/manage-api/IndexTjfx1Controller/getQyHtXqTj";
options.type = "GET";
options.data = ak_qysybtj.temp;
options.errorback = akglobe_config.errBack;
options.callback = function(data) {
ak_qysybtj.callBackGET(data);
}
// 如果是测试环境 使用假数据
if(parent.typep002==2){
ak_qysybtj.callBackGET(ak_ztqg.getQyHtXqTj);
}else{
akglobe_config.ajaxQuery(options);
}
},
callBackGET:function(data){
if(!data) return;
ak_qysybtj.initList(data); // 初始化 html 内容
parent.ak_gjtj.area_qysyb2_callback(data); // 区域事业部的图层
},
因点击事件后需要先初始化右侧页面,在初始化标注,所以这里不是直接调用的方法,而是父级的方法
parent.ak_gjtj.area_qysyb2_callback(data); // 区域事业部的图层
2.渲染数据
top2ClickCallBack: function(data, type) {
console.log(data);
console.log(type);
// ak_right_sybList.init(data);// 初始化区域 事业部右侧列表
var arrColor = ["rgb(15,176,255)", "rgb(18,76,154)", "#40C4E4", "#42B2BE", "rgb(51,176,204)", "#8CB7E5",
"rgb(0,244,188)", "#139FF0"
];
var DEFAULT_STYLE22 = {
position: "absolute",
top: "0",
left: "0",
width: "120px",
height: "120px"
};
var result = data.rows; // config.demodata_Department;
var cities = [];
for (var i = 0; i < result.length; i++) {
var db = result[i];
var name = db.name + "_" + db.num + "个"; // 显示文字
var obj = new Object();
obj.name = db.name;
obj.code = db.code; // 区域事业部的编码
// obj.address=db.address;
obj.lat = db.x;
obj.lng = db.y;
obj.addtypemarker = config.addtypemarker.ceccDz;
var position = new Cesium.Cartesian3.fromDegrees(obj.lat, obj.lng, 60)
var options = new Object();
options.style = DEFAULT_STYLE22;
// var divicon = new DivIcon(viewer, position,obj.name)
var json = JSON.stringify(db);
if (i === 0) { // 红色标注 第一名
// flag=ak_flagLabel.addLableDanger(obj.lat,obj.lng,name);
var option = new Object();
option.officetY = flagTop;
option.css = "FlagLabelContent_c1";
option.attr = json;
option.callback = ak_left_click3.flagclick;
flag = new FlagLabel2(viewer, [obj.lat, obj.lng], name, "danger", option);
} else { // 蓝色标注
// flag=ak_flagLabel.addLable(obj.lat,obj.lng,name);
var option = new Object();
option.officetY = flagTop;
option.css = "FlagLabelContent_c2";
option.attr = json;
option.callback = ak_left_click3.flagclick;
flag = new FlagLabel2(viewer, [obj.lat, obj.lng], name, "danger", option);
}
ak_left_click3.flags.push(flag);
}
},
flagclick: function(attr) {
console.log('点击')
// alert(attr);
// 此处的传参 和 表格的传参不一样 需要转换成json
var json = JSON.parse(attr);
var sgzt_type2 = localStorage.getItem('sgzt_type2');
if(sgzt_type2 == 1){
// var projectStatus = akglobe_config.underConstruction;
// if(projectStatus){
// projectStatus = projectStatus.join("','");
// projectStatus = "'" + projectStatus + "'";
// }
json.projectstatus = akglobe_config.underConstruction;
}else if(sgzt_type2 == 2){
var year = (new Date).getFullYear();
json.startTime = ak_right.changeDateFormat2(new Date(year, 0, 1).getTime()).trim();
json.endTime = ak_right.changeDateFormat2(new Date(year, 11, 31).getTime()).trim();
}
// alert(json);
ak_right_sybgj.init(json, false);
ak_right_sybgj.getXmData(json);
},
以下代码是根据数据内容来显示不同颜色的标签
样式是 option.css = "FlagLabelContent_c1";可改变FlagLabelContent_c1的内容来改变样式
var json = JSON.stringify(db);
if (i === 0) { // 红色标注 第一名
// flag=ak_flagLabel.addLableDanger(obj.lat,obj.lng,name);
var option = new Object();
option.officetY = flagTop;
option.css = "FlagLabelContent_c1";
option.attr = json;
option.callback = ak_left_click3.flagclick;
flag = new FlagLabel2(viewer, [obj.lat, obj.lng], name, "danger", option);
} else { // 蓝色标注
// flag=ak_flagLabel.addLable(obj.lat,obj.lng,name);
var option = new Object();
option.officetY = flagTop;
option.css = "FlagLabelContent_c2";
option.attr = json;
option.callback = ak_left_click3.flagclick;
flag = new FlagLabel2(viewer, [obj.lat, obj.lng], name, "danger", option);
}
flagLable的点击事件,点击后所触发的方法
option.callback = ak_left_click3.flagclick; //ak_left_click3.flagclick;在这里可是方法而不是变量
3.清除
clearTop2: function() {
for (var i = 0; i < this.arrCharts1.length; i++) {
var obj = this.arrCharts1[i];
obj.destroy();
}
this.arrCharts1 = [];
for (var i = 0; i < ak_left_click3.flags.length; i++) {
var obj = ak_left_click3.flags[i];
obj.destroy();
}
},