"use script"; //开发环境建议开启严格模式
|
(function (window, mars3d) {
|
//创建widget类，需要继承BaseWidget
|
class MyWidget extends mars3d.widget.BaseWidget {
|
//弹窗配置
|
get view() {
|
return {
|
type: "window",
|
url: "view.html",
|
windowOptions: {
|
width: 470,
|
height: 460,
|
},
|
};
|
}
|
|
//初始化[仅执行1次]
|
create() {
|
//用于显示查询结果（geojson）的图层
|
this.geoJsonLayer = new mars3d.layer.GeoJsonLayer({
|
name: this.config.name,
|
pid: 99, //图层管理 中使用，父节点id
|
popup: "all",
|
});
|
this.geoJsonLayer.on(mars3d.EventType.load, this.geoJsonLayer_onLoadHandler, this);
|
this.geoJsonLayer.on(mars3d.EventType.click, this.geoJsonLayer_onClickHandler, this);
|
}
|
//每个窗口创建完成后调用
|
winCreateOK(opt, result) {
|
this.viewWindow = result;
|
}
|
//激活插件
|
activate() {
|
this.map.addLayer(this.geoJsonLayer);
|
}
|
//释放插件
|
disable() {
|
this.map.removeLayer(this.geoJsonLayer);
|
|
this.clearDraw();
|
this.clearShowFeature();
|
}
|
clearDraw() {
|
this.map.graphicLayer.clear();
|
this.drawGraphic = null;
|
}
|
drawPolygon() {
|
this.clearDraw();
|
this.map.graphicLayer.startDraw({
|
type: "polygon",
|
style: {
|
color: "#00FF00",
|
opacity: 0.3,
|
outline: true,
|
outlineColor: "#ffffff",
|
clampToGround: true,
|
},
|
success: (graphic) => {
|
this.drawGraphic = graphic;
|
},
|
});
|
}
|
drawRectangle() {
|
this.clearDraw();
|
this.map.graphicLayer.startDraw({
|
type: "rectangle",
|
style: {
|
color: "#00FF00",
|
opacity: 0.3,
|
outline: true,
|
outlineColor: "#ffffff",
|
clampToGround: true,
|
},
|
success: (graphic) => {
|
this.drawGraphic = graphic;
|
},
|
});
|
}
|
drawCircle() {
|
this.clearDraw();
|
this.map.graphicLayer.startDraw({
|
type: "circle",
|
style: {
|
color: "#00FF00",
|
opacity: 0.3,
|
outline: true,
|
outlineColor: "#ffffff",
|
clampToGround: true,
|
},
|
success: (graphic) => {
|
this.drawGraphic = graphic;
|
},
|
});
|
}
|
hasDraw() {
|
return this.drawGraphic;
|
}
|
//查询后全部显示处理
|
clearShowFeature() {
|
this.geoJsonLayer.clear();
|
if (this.viewWindow) {
|
this.viewWindow.clearResult();
|
}
|
}
|
changeSelectedLayer(selectedLayer) {
|
this.clearShowFeature();
|
|
this.geoJsonLayer.setOptions({
|
symbol: selectedLayer.symbol,
|
buildings: selectedLayer.buildings,
|
popup: selectedLayer.columns,
|
});
|
}
|
getExtentByType(extenttype) {
|
if (extenttype == "1") {
|
//当前视域内
|
return this.map.getExtent();
|
} else if (extenttype == "2") {
|
return this.drawGraphic;
|
}
|
return null;
|
}
|
query(param) {
|
this.clearShowFeature();
|
|
if (this.queryMapserver) {
|
this.queryMapserver.url = param.url;
|
} else {
|
this.queryMapserver = new mars3d.query.QueryArcServer({
|
url: param.url,
|
popup: "all",
|
});
|
}
|
|
var graphic = this.getExtentByType(param.extenttype);
|
|
haoutil.loading.show(); //loading
|
|
this.queryMapserver.query({
|
where: param.where,
|
graphic: graphic,
|
page: false, //不分页
|
success: (result) => {
|
haoutil.loading.hide();
|
|
if (result.count == 0) {
|
haoutil.msg("未查询到相关记录！");
|
return;
|
}
|
|
for (var i = 0; i < result.geojson.features.length; i++) {
|
const feature = result.geojson.features[i];
|
|
if (feature.geometry.type == "LineString") {
|
feature.properties["长度"] = mars3d.Util.formatNum(turf.length(feature) * 1000, 2);
|
} else if (feature.geometry.type == "Polygon") {
|
feature.properties["面积"] = mars3d.Util.formatNum(turf.area(feature), 2);
|
feature.properties["长度"] = mars3d.Util.formatNum(turf.length(feature) * 1000, 2);
|
}
|
feature.properties["rowIndex"] = i + 1;
|
}
|
|
this.geoJsonLayer.load({ data: result.geojson });
|
},
|
error: (error, msg) => {
|
haoutil.loading.hide();
|
|
console.log("服务访问错误", error);
|
haoutil.alert(msg, "服务访问错误");
|
},
|
});
|
}
|
geoJsonLayer_onLoadHandler(event) {
|
this.viewWindow.showResult(event.list);
|
}
|
flyTo(item) {
|
var graphic = item.graphic;
|
if (graphic) {
|
graphic.flyTo({ radius: 1000 });
|
}
|
}
|
geoJsonLayer_onClickHandler(event) {
|
var graphic = event.graphic;
|
// this.highlight(graphic);
|
}
|
}
|
|
//注册到widget管理器中。
|
mars3d.widget.bindClass(MyWidget);
|
|
window.showQueryArcServerInfo = function (attr) {
|
console.log("单击了详情按钮", attr);
|
haoutil.alert(JSON.stringify(attr));
|
};
|
//每个widet之间都是直接引入到index.html中，会存在彼此命名冲突，所以闭包处理下。
|
})(window, mars3d);
|
