From d74b495736f0c04522ec54274b70fed0ded2878d Mon Sep 17 00:00:00 2001
From: zhongrj <646384940@qq.com>
Date: Tue, 27 Jun 2023 11:30:06 +0800
Subject: [PATCH] 任务新增导出
---
public/map/controls/overview/OverviewControl.js | 357 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 357 insertions(+), 0 deletions(-)
diff --git a/public/map/controls/overview/OverviewControl.js b/public/map/controls/overview/OverviewControl.js
new file mode 100644
index 0000000..1801d00
--- /dev/null
+++ b/public/map/controls/overview/OverviewControl.js
@@ -0,0 +1,357 @@
+/**
+ * 鹰眼视图widget
+ * @author Liuyl
+ * @date 2015/10/9
+ */
+define([
+ "dojo/_base/declare",
+ "base/BaseControl",
+ "dojo/_base/array",
+ "dojo/_base/lang",
+ "dojo/dom",
+ "dojo/dom-class",
+ "dojo/dom-style",
+ "dojo/topic",
+ "dojo/aspect",
+ "dojo/on",
+ "dojo/text!controls/overview/OverviewControl.html",
+ "esri/map",
+ "esri/graphic",
+ "esri/Color",
+ "esri/geometry/Polygon",
+ "esri/symbols/SimpleFillSymbol",
+ "esri/symbols/SimpleLineSymbol",
+ "esri/layers/GraphicsLayer",
+ "esri/toolbars/edit",
+ "esri/graphicsUtils",
+ "utils/LayerUtil",
+ "controls/overview/config",
+ "base/AppEvent"
+], function(
+ declare,
+ BaseControl,
+ arrayUtil,
+ lang,
+ dom,
+ domClass,
+ domStyle,
+ topic,
+ aspect,
+ on,
+ template,
+ Map,
+ Graphic,
+ Color,
+ Polygon,
+ SimpleFillSymbol,
+ SimpleLineSymbol,
+ GraphicsLayer,
+ Edit,
+ graphicsUtils,
+ LayerUtil,
+ config,
+ AppEvent) {
+ var Widget = declare([BaseControl], {
+
+ templateString: template,
+ defaultOptions: {
+ rate: 2.5,
+ base_class: "overview-default-base-class",
+ fill_color: [135, 206, 250, 0.3],
+ border_color: [135, 206, 250, 1]
+ },
+ /**
+ * GroupLayers的配置
+ */
+ grouplayersConfig: null,
+ /**
+ * 当前显示的GroupLayer的Id
+ */
+ visibleGroupLayerId: "",
+
+ /**
+ * 根据图层配置信息转换成实例化后的图层结果对象
+ */
+ _parseResult: null,
+
+ /**
+ * options
+ */
+ constructor: function(options) {
+ /**
+ * 确保实例化时传入图层组配置参数和该鹰眼初始显示的图层组Id
+ */
+ if (!options || !options.grouplayersConfig || !options.visibleGroupLayerId) {
+ throw {
+ message: "初始化参数不完整，应指定grouplayersConfig和visibleGroupLayerId参数"
+ };
+ }
+ declare.safeMixin(this, options);
+ //$.extend(true, config, this.defaultOptions, options);
+ //this.map = config.basemap;
+ // dojo.create("link", {
+ // href: require.toUrl("widgets/overview/") + 'OverviewWidget.css',
+ // type: 'text/css',
+ // rel: 'stylesheet'
+ // },
+ // document.getElementsByTagName('head')[0]);
+ //this.MAP_DOM_ID = srcRefNode + this.MAP_DOM_ID;
+ this.base_class = "overview-default-base-class";
+ //this.map = config.basemap;
+ this._myMap = null;
+ this._layer1 = null;
+ this._layer2 = null;
+ this._graphic1 = null;
+ this._graphic2 = null;
+ },
+ startup: function() {
+ this.inherited(arguments);
+ this._init();
+ AppEvent.addAppEventListener(AppEvent.SWITCH_BASEMAP, lang.hitch(this, this.onSwitchBaseMap));
+ },
+ postCreate: function() {
+ this.inherited(arguments);
+ },
+ _init: function() {
+ if (this.myMapNode.id == "") {
+ this.myMapNode.id = uuid();
+ }
+
+ //初始化自己的地图
+ this._myMap = new Map(this.myMapNode.id, {
+ logo: false,
+ slider: false
+ });
+ //this._myMap = map;
+ //禁用鹰眼地图的所有用户导航方式
+ this._myMap.on("load", lang.hitch(this, function(map) {
+ this._myMap.disableMapNavigation();
+ this._myMap.hideZoomSlider();
+ }));
+
+ //var _cs = domStyle.getComputedStyle(this.mapNode);
+ //根据配置添加图层
+ this._addLayer();
+ this._initGraphic();
+ var resizeTimer;
+ clearTimeout(resizeTimer);
+ resizeTimer = setTimeout(lang.hitch(this, function() {
+ this._myMap.resize();
+ this._myMap.reposition();
+
+ }), 500);
+ },
+ _addLayer: function() {
+ //仅显示baselayer即可，去掉baselayer的displaylevel限制，让其在所有显示级别都可以显示
+ this._parseResult = LayerUtil.parseGroups(this.grouplayersConfig);
+ var groups = this._parseResult.groups;
+ for (var key in groups) {
+ var layer;
+ var visible = (key == this.visibleGroupLayerId);
+ if(visible == false){
+ continue;
+ }
+ if(groups[key].baselayers==null){
+ groups[key].baselayers=LayerUtil.parseLayers(groups[key].baselayersConfig);
+ }
+ for (var i = 0; i < groups[key].baselayers.length; i++) {
+ layer = groups[key].baselayers[i];
+ layer.visible = visible;
+ if (layer.setDisplayLevels) {
+ layer.setDisplayLevels(null);
+ }
+ this._myMap.addLayer(layer);
+ }
+ }
+ },
+ onSwitchBaseMap: function(evt) {
+ if (evt.hockId != this.hockId || !evt.grouplayer)
+ return;
+ if (this.visibleGroupLayerId == evt.grouplayer) {
+ return;
+ } else {
+ //先隐藏原来的图层
+ var grouplayer = this._parseResult.groups[this.visibleGroupLayerId];
+ for (var key in grouplayer.baselayers) {
+ var layer = grouplayer.baselayers[key];
+ //layer.setVisibility(false);
+ this._myMap.removeLayer(layer);
+ }
+
+ //再显示需要展示的图层
+ var grouplayer = null;
+ for (var key in this._parseResult.groups) {
+ if (key == evt.grouplayer) {
+ var grouplayer = this._parseResult.groups[key];
+ if(grouplayer.baselayers == null){
+ grouplayer.baselayers=LayerUtil.parseLayers(grouplayer.baselayersConfig);
+ }
+ for (var index in grouplayer.baselayers) {
+ var layer = grouplayer.baselayers[index];
+ //layer.setVisibility(true);
+ this._myMap.addLayer(layer);
+ }
+ }
+ }
+ this.visibleGroupLayerId = evt.grouplayer;
+ }
+ },
+ _initGraphic: function() {
+ var _symbol = new SimpleFillSymbol()
+ .setStyle(SimpleFillSymbol.STYLE_SOLID)
+ .setColor(new Color(config.fill_color))
+ .setOutline(new SimpleLineSymbol().setColor(new Color(config.border_color)).setWidth(0.5));
+ this._layer1 = new GraphicsLayer({
+ id: "rect1"
+ });
+ this._layer2 = new GraphicsLayer({
+ id: "rect2"
+ });
+ this._myMap.addLayer(this._layer1);
+ this._myMap.addLayer(this._layer2);
+ this._graphic1 = new Graphic(Polygon.fromExtent(this.map.extent), _symbol);
+ this._graphic2 = new Graphic(Polygon.fromExtent(this.map.extent), _symbol);
+ this._layer1.add(this._graphic1);
+ this._layer2.add(this._graphic2);
+ var _startMapPoint = null;
+ var _basemapExtent = null;
+
+
+ this.map.on("mouse-drag-start", lang.hitch(this, function(evt) {
+ _startMapPoint = evt.mapPoint;
+ _basemapExtent = this.map.extent;
+ }));
+ this.map.on("mouse-drag", lang.hitch(this, function(evt) {
+ var _curMapPoint = evt.mapPoint;
+
+ var _deltaX = _curMapPoint.x - _startMapPoint.x;
+ var _deltaY = _curMapPoint.y - _startMapPoint.y;
+ var _basemapCenter = _basemapExtent.getCenter();
+ _basemapCenter.x -= _deltaX;
+ _basemapCenter.y -= _deltaY;
+ _newExtent = _basemapExtent.centerAt(_basemapCenter);
+ var _newPolygon = Polygon.fromExtent(_newExtent);
+ this._graphic2.setGeometry(_newPolygon);
+ this._layer2.redraw();
+ }));
+
+ this.map.on("extent-change", lang.hitch(this, function(evt) {
+ var _newPolygon = Polygon.fromExtent(evt.extent);
+ var _extent = new esri.geometry.Extent(evt.extent);
+ var _deltaX = (_extent.xmax - _extent.xmin) / 2.0 * (config.rate - 1);
+ var _deltaY = (_extent.ymax - _extent.ymin) / 2.0 * (config.rate - 1);
+ _extent.xmin -= _deltaX;
+ _extent.xmax += _deltaX;
+ _extent.ymin -= _deltaY;
+ _extent.ymax += _deltaY;
+ this._myMap.setExtent(_extent).then(lang.hitch(this, function() {
+ this._redrawRect(_newPolygon);
+ }));
+ //主地图缩放时让矩形框具有动态效果
+ this.map.on("zoom", lang.hitch(this, function(evt) {
+ try {
+ var _curZoomLevel = evt.level;
+ var _newPolygon = Polygon.fromExtent(evt.extent);
+ this._redrawRect(_newPolygon);
+ } catch (err) {
+ console.log(err);
+ }
+
+ }));
+ }));
+ this._initEditing();
+
+ },
+ _redrawRect: function(polygon) {
+ this._graphic2.setGeometry(polygon);
+ this._layer2.redraw();
+ this._graphic1.setGeometry(polygon);
+ this._layer1.redraw();
+ },
+ _initEditing: function() {
+ var editToolBar = new Edit(this._myMap);
+ editToolBar.activate(Edit.MOVE, this._graphic2);
+ editToolBar.on("graphic-move-stop", lang.hitch(this, function(g, t) {
+ var _newCenter = graphicsUtils.graphicsExtent([g.graphic]).getCenter();
+ this.map.centerAt(_newCenter);
+ }));
+ },
+ _toggle: function() {
+ require(["dojo/_base/fx", "dojo/dom", "dojo/domReady!"], lang.hitch(this, function(baseFx, dom) {
+ var _prop = null;
+ // var _cs = domStyle.getComputedStyle(this.mapNode);
+ // var _width = -parseInt(_cs.width.substr(0, _cs.width.length - 2));
+ // var _height = -parseInt(_cs.height.substr(0, _cs.height.length - 2));
+ if (domClass.contains(this.toggleNode, "overview-toggle-show")) {
+ //由于控件初始化后无法设置成正确的显示范围
+ //故在显示鹰眼前手动触发一次basemap的extent-change事件以重新设置鹰眼地图的显示范围
+ domStyle.set(this._myMap.container, "height", domStyle.get(this.mapNode, "height") + "px");
+ this._myMap.resize();
+ this.map.centerAt(this.map.extent.getCenter());
+ domStyle.set(this.mapNode, "display", "block");
+ _prop = {
+ // right: {
+ // start: _width,
+ // end: '0',
+ // units: 'px'
+ // },
+ // bottom: {
+ // start: _height,
+ // end: '0',
+ // units: 'px'
+ // },
+ opacity: {
+ start: 0,
+ end: 1
+ }
+ }
+ baseFx.animateProperty({
+ node: this.mapNode,
+ properties: _prop,
+ duration: 1000
+ }).play();
+ domClass.remove(this.toggleNode, "overview-toggle-show");
+ domClass.add(this.toggleNode, "overview-toggle-hide");
+ } else {
+
+ _prop = {
+ // right: {
+ // end: _width,
+ // units: 'px'
+ // },
+ // bottom: {
+ // end: _height,
+ // units: 'px'
+ // },
+ opacity: {
+ start: 1,
+ end: 0
+ }
+ }
+
+ var anim = baseFx.animateProperty({
+ node: this.mapNode,
+ properties: _prop,
+ duration: 1000
+ });
+ aspect.after(anim, "onEnd", lang.hitch(this, function() {
+ domStyle.set(this.mapNode, "display", "none");
+ }, true));
+ anim.play();
+ domClass.remove(this.toggleNode, "overview-toggle-hide");
+ domClass.add(this.toggleNode, "overview-toggle-show");
+ }
+
+ }));
+ },
+ destroy: function() {
+ this.inherited(arguments);
+ var layerIds = this._myMap.layerIds;
+ for (var index in layerIds) {
+ this._myMap.removeLayer(this._myMap.getLayer(layerIds[index]));
+ }
+ }
+
+ });
+ return Widget;
+});
\ No newline at end of file
--
Gitblit v1.9.3