Mercurial > lada > lada-client

comparison app/view/panel/Map.js @ 1021:1df6b6210b42 stammdatengrids

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
WIP First Version of a New Window/Panel combination to edit Ortszuordnungen and Orte
author Dustin Demuth <dustin@intevation.de>
date Thu, 04 Feb 2016 16:31:46 +0100
parents 2b7bcb778f0a
children 1bd4c0709bd6
comparison
equal deleted inserted replaced
1014:e9e974d31924 1021:1df6b6210b42
12 * It uses OpenLayers to display the map 12 * It uses OpenLayers to display the map
13 */ 13 */
14 Ext.define('Lada.view.panel.Map', { 14 Ext.define('Lada.view.panel.Map', {
15 extend: 'Ext.panel.Panel', 15 extend: 'Ext.panel.Panel',
16 alias: 'widget.map', 16 alias: 'widget.map',
17 name: 'map',
17 18
18 record: null, 19 record: null,
19 locationRecord: null, 20 locationRecord: null,
21 externalOrteStore: false,
22 /*
23 * if externalOrteStore is true, the mappanel will not load the orte
24 * store on it's own; it expects an already loaded store instead
25 */
20 26
21 /** 27 /**
22 * @cfg 28 * @cfg
23 * OpenLayers map options. 29 * OpenLayers map options.
24 */ 30 */
60 var keyControl = new OpenLayers.Control.KeyboardDefaults(); 66 var keyControl = new OpenLayers.Control.KeyboardDefaults();
61 this.map.addControl(keyControl); 67 this.map.addControl(keyControl);
62 keyControl.activate(); 68 keyControl.activate();
63 this.bodyStyle = {background: '#fff'}; 69 this.bodyStyle = {background: '#fff'};
64 this.initData(); 70 this.initData();
65 this.tbar = Ext.create('Lada.view.widget.MapToolbar');
66 this.addEvents('featureselected'); 71 this.addEvents('featureselected');
67 this.callParent(arguments); 72 this.callParent(arguments);
68 }, 73 },
69 74
70 /** 75 /**
71 * Initialise the Data and Create an 76 * Initialise the Data and Create an
72 * Array of OpenLayers.Layer objects. 77 * Array of OpenLayers.Layer objects.
73 */ 78 */
74 initData: function() { 79 initData: function() {
75 var me = this; 80 var me = this;
76 this.locationFeatures = []; 81
77 this.locationStore = Ext.data.StoreManager.get('locations'); 82 if (!this.externalOrteStore) {
78 for (var i = 0; i < this.locationStore.count(); i++) { 83 this.locationStore = Ext.data.StoreManager.get('orte');
79 this.locationFeatures.push(new OpenLayers.Feature.Vector( 84 this.addLocations(locationStore);
85 }
86 },
87
88 selectFeature: function(id) {
89 var feature = this.featureLayer.getFeaturesByAttribute('id', id);
90 this.map.setCenter(
91 new OpenLayers.LonLat(feature[0].geometry.x, feature[0].geometry.y));
92 this.map.zoomToScale(this.mapOptions.scales[5]);
93 this.selectControl.unselectAll();
94 this.selectControl.select(feature[0]);
95 },
96
97 activateDraw: function(record) {
98 this.locationRecord = record;
99 if (!this.drawPoint) {
100 this.drawPoint = new OpenLayers.Control.DrawFeature(this.featureLayer,
101 OpenLayers.Handler.Point);
102 this.map.addControl(this.drawPoint);
103 }
104 this.drawPoint.activate();
105 this.drawPoint.events.register('featureadded', this, this.featureAdded);
106 },
107
108 featureAdded: function(features) {
109 this.locationRecord.set('latitude', features.feature.geometry.y);
110 this.locationRecord.set('longitude', features.feature.geometry.x);
111 this.drawPoint.deactivate();
112 this.selectControl.unselectAll();
113 this.selectControl.select(features.feature);
114 },
115
116 addLocations: function(locationStore) {
117 locationFeatures = [];
118
119 // Iterate the Store and create features from it
120 for (var i = 0; i < locationStore.count(); i++) {
121 locationFeatures.push(new OpenLayers.Feature.Vector(
80 new OpenLayers.Geometry.Point( 122 new OpenLayers.Geometry.Point(
81 this.locationStore.getAt(i).get('longitude'), 123 locationStore.getAt(i).get('longitude'),
82 this.locationStore.getAt(i).get('latitude') 124 locationStore.getAt(i).get('latitude')
83 ), 125 ),
84 { 126 {
85 id: this.locationStore.getAt(i).get('id'), 127 id: locationStore.getAt(i).get('id'),
86 bez: this.locationStore.getAt(i).get('bezeichnung') 128 bez:locationStore.getAt(i).get('kurztext')
87 } 129 }
88 )); 130 ));
89 } 131 }
132
133 // Create a new Feature Layer and add it to the map
90 this.featureLayer = new OpenLayers.Layer.Vector('vector_' + this.map.name, { 134 this.featureLayer = new OpenLayers.Layer.Vector('vector_' + this.map.name, {
91 styleMap: new OpenLayers.StyleMap({ 135 styleMap: new OpenLayers.StyleMap({
92 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({ 136 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({
93 externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png', 137 externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png',
94 graphicOpacity: 1, 138 graphicOpacity: 1,
106 fontColor: 'blue', 150 fontColor: 'blue',
107 fontWeight: 'bold' 151 fontWeight: 'bold'
108 }) 152 })
109 }) 153 })
110 }); 154 });
111 this.featureLayer.addFeatures(this.locationFeatures); 155 this.featureLayer.addFeatures(locationFeatures);
112 this.map.addLayer(this.featureLayer); 156 this.map.addLayer(this.featureLayer);
113 157
114 this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, { 158 this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, {
115 clickout: false, 159 clickout: false,
116 toggle: false, 160 toggle: false,
121 }); 165 });
122 this.map.addControl(this.selectControl); 166 this.map.addControl(this.selectControl);
123 this.selectControl.activate(); 167 this.selectControl.activate();
124 }, 168 },
125 169
126 selectFeature: function(id) {
127 var feature = this.featureLayer.getFeaturesByAttribute('id', id);
128 this.map.setCenter(
129 new OpenLayers.LonLat(feature[0].geometry.x, feature[0].geometry.y));
130 this.map.zoomToScale(this.mapOptions.scales[5]);
131 this.selectControl.unselectAll();
132 this.selectControl.select(feature[0]);
133 },
134
135 activateDraw: function(record) {
136 this.locationRecord = record;
137 if (!this.drawPoint) {
138 this.drawPoint = new OpenLayers.Control.DrawFeature(this.featureLayer,
139 OpenLayers.Handler.Point);
140 this.map.addControl(this.drawPoint);
141 }
142 this.drawPoint.activate();
143 this.drawPoint.events.register('featureadded', this, this.featureAdded);
144 },
145
146 featureAdded: function(features) {
147 this.locationRecord.set('latitude', features.feature.geometry.y);
148 this.locationRecord.set('longitude', features.feature.geometry.x);
149 this.drawPoint.deactivate();
150 this.selectControl.unselectAll();
151 this.selectControl.select(features.feature);
152 },
153 170
154 /** 171 /**
155 * @private 172 * @private
156 * Override to display and update the map view in the panel. 173 * Override to display and update the map view in the panel.
157 */ 174 */
http://lada.wald.intevation.org