| 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257 | 1×
1×
1×
1×
81×
81×
1×
81×
80×
1×
78×
15×
63×
1×
73×
1×
73×
50×
50×
50×
50×
50×
50×
43×
43×
43×
43×
43×
43×
7×
1×
1×
1×
1×
1×
6×
1×
1×
1×
1×
1×
5×
2×
2×
2×
2×
3×
3×
3×
3×
3×
3×
50×
49×
23×
17×
1×
52×
52×
41×
52×
52×
52×
1×
2×
2×
1×
1×
1×
53×
53×
53×
53×
53×
53×
53×
52×
15×
15×
15×
13×
11×
11×
15×
1×
1×
1×
1×
37×
37×
4×
4×
4×
3×
3×
3×
4×
1×
1×
1×
1×
1×
4×
3×
3×
3×
4×
1×
1×
1×
1×
37×
35×
4×
31×
35×
2×
1×
1×
2×
37×
30×
30×
30×
37×
1×
1×
37×
1×
1×
37×
2×
2×
37×
1×
1×
1×
19×
16×
19×
19×
19×
2×
19×
1×
1×
3430×
1×
78×
78×
78×
1×
1×
| define(["require", "exports", "../index", "../utils/helper", "@syncfusion/ej2-base"], function (require, exports, index_1, helper_1, ej2_base_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Selection = (function () {
function Selection(maps) {
this.maps = maps;
this.addEventListener();
}
Selection.prototype.addEventListener = function () {
if (!this.maps.isDestroyed) {
this.maps.on(index_1.click, this.mouseClick, this);
}
};
Selection.prototype.removeEventListener = function () {
if (this.maps.isDestroyed) {
return;
}
this.maps.off(index_1.click, this.mouseClick);
};
Selection.prototype.mouseClick = function (targetElement) {
if (!ej2_base_1.isNullOrUndefined(targetElement['type']) && targetElement['type'].indexOf('touch') !== -1 &&
ej2_base_1.isNullOrUndefined(targetElement.id)) {
targetElement = targetElement['target'];
}
if (!ej2_base_1.isNullOrUndefined(targetElement.id) && (targetElement.id.indexOf('LayerIndex') > -1 ||
targetElement.id.indexOf('NavigationIndex') > -1)) {
var shapeData = void 0;
var data = void 0;
var shapeIndex = void 0;
var dataIndex = void 0;
var layerIndex = parseInt(targetElement.id.split('_LayerIndex_')[1].split('_')[0], 10);
if (targetElement.id.indexOf('shapeIndex') > -1) {
shapeIndex = parseInt(targetElement.id.split('_shapeIndex_')[1].split('_')[0], 10);
shapeData = !ej2_base_1.isNullOrUndefined(this.maps.layers[layerIndex].shapeData['features'])
&& this.maps.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
this.maps.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] :
!ej2_base_1.isNullOrUndefined(this.maps.layers[layerIndex].shapeData['geometries'])
&& this.maps.layers[layerIndex].shapeData['geometries']['length'] > shapeIndex ?
this.maps.layers[layerIndex].shapeData['geometries'][shapeIndex]['properties'] : null;
dataIndex = parseInt(targetElement.id.split('_dataIndex_')[1].split('_')[0], 10);
data = ej2_base_1.isNullOrUndefined(dataIndex) ? null : this.maps.layers[layerIndex].dataSource[dataIndex];
this.selectionsettings = this.maps.layers[layerIndex].selectionSettings;
this.selectionType = 'Shape';
}
else if (targetElement.id.indexOf('BubbleIndex') > -1) {
var bubbleIndex = parseInt(targetElement.id.split('_BubbleIndex_')[1].split('_')[0], 10);
dataIndex = parseInt(targetElement.id.split('_dataIndex_')[1].split('_')[0], 10);
data = this.maps.layers[layerIndex].bubbleSettings[bubbleIndex].dataSource[dataIndex];
this.selectionsettings = this.maps.layers[layerIndex].bubbleSettings[bubbleIndex].selectionSettings;
this.selectionType = 'Bubble';
}
else if (targetElement.id.indexOf('MarkerIndex') > -1) {
var markerIndex = parseInt(targetElement.id.split('_MarkerIndex_')[1].split('_')[0], 10);
dataIndex = parseInt(targetElement.id.split('_dataIndex_')[1].split('_')[0], 10);
data = this.maps.layers[layerIndex].markerSettings[markerIndex].dataSource[dataIndex];
this.selectionsettings = this.maps.layers[layerIndex].markerSettings[markerIndex].selectionSettings;
this.selectionType = 'Marker';
}
else if (targetElement.id.indexOf('_PolygonIndex_') > -1) {
dataIndex = parseInt(targetElement.id.split('_PolygonIndex_')[1].split('_')[0], 10);
data = this.maps.layers[layerIndex].polygonSettings.polygons[dataIndex].points;
this.selectionsettings = this.maps.layers[layerIndex].polygonSettings.selectionSettings;
this.selectionType = 'Polygon';
}
else Eif (targetElement.id.indexOf('NavigationIndex') > -1) {
var index = parseInt(targetElement.id.split('_NavigationIndex_')[1].split('_')[0], 10);
shapeData = null;
data = {
latitude: this.maps.layers[layerIndex].navigationLineSettings[index].latitude,
longitude: this.maps.layers[layerIndex].navigationLineSettings[index].longitude
};
this.selectionsettings = this.maps.layers[layerIndex].navigationLineSettings[index].selectionSettings;
this.selectionType = 'navigationline';
}
if (!ej2_base_1.isNullOrUndefined(this.selectionsettings) && this.selectionsettings.enable) {
this.selectElement(targetElement, layerIndex, data, shapeData);
}
}
else if ((this.maps.legendSettings.visible && !this.maps.legendSettings.toggleLegendSettings.enable && this.maps.legendModule) &&
!ej2_base_1.isNullOrUndefined(targetElement.id) && targetElement.id.indexOf('_Text') === -1 &&
(targetElement.id.indexOf(this.maps.element.id + '_Legend_Shape_Index') > -1 ||
targetElement.id.indexOf(this.maps.element.id + '_Legend_Index') !== -1)) {
this.maps.legendModule.legendHighLightAndSelection(targetElement, 'selection');
}
};
Selection.prototype.selectElement = function (targetElement, layerIndex, data, shapeData) {
this.maps.mapSelect = targetElement ? true : false;
if (this.maps.legendModule && this.maps.legendSettings.visible && targetElement.id.indexOf('_MarkerIndex_') === -1) {
this.maps.legendModule.shapeHighLightAndSelection(targetElement, data, this.selectionsettings, 'selection', layerIndex);
}
var shapeToggled = (targetElement.id.indexOf('shapeIndex') > -1 && this.maps.legendSettings.visible && this.maps.legendModule) ?
this.maps.legendModule.shapeToggled : true;
Eif (shapeToggled) {
this.selectMap(targetElement, shapeData, data);
}
};
Selection.prototype.addSelection = function (layerIndex, name, enable) {
var targetElement = helper_1.getTargetElement(layerIndex, name, enable, this.maps);
if (enable) {
this.selectMap(targetElement, null, null);
}
else {
helper_1.removeClass(targetElement);
}
};
Selection.prototype.selectMap = function (targetElement, shapeData, data) {
var _this = this;
var isLineStringShape = targetElement.parentElement.id.indexOf('LineString') > -1;
var border = {
color: isLineStringShape ? (this.selectionsettings.fill || this.selectionsettings.border.color) :
this.selectionsettings.border.color,
width: isLineStringShape ? (this.selectionsettings.border.width / this.maps.scale) :
(this.selectionsettings.border.width / (this.selectionType === 'Marker' ? 1 : this.maps.scale)),
opacity: this.selectionsettings.border.opacity
};
var eventArgs = {
opacity: this.selectionsettings.opacity,
fill: isLineStringShape ? 'transparent' : (this.selectionType !== 'navigationline' ? this.selectionsettings.fill : 'none'),
border: border,
name: index_1.itemSelection,
target: targetElement.id,
cancel: false,
shapeData: shapeData,
data: data,
maps: this.maps
};
this.maps.trigger('itemSelection', eventArgs, function (observedArgs) {
eventArgs.border.opacity = ej2_base_1.isNullOrUndefined(_this.selectionsettings.border.opacity) ?
_this.selectionsettings.opacity : _this.selectionsettings.border.opacity;
if (!eventArgs.cancel) {
if (targetElement.getAttribute('class') === _this.selectionType + 'selectionMapStyle'
|| targetElement.getAttribute('class') === 'LineselectionMapStyle') {
helper_1.removeClass(targetElement);
_this.removedSelectionList(targetElement);
for (var m = 0; m < _this.maps.shapeSelectionItem.length; m++) {
if (_this.maps.shapeSelectionItem[m] === eventArgs.shapeData) {
_this.maps.shapeSelectionItem.splice(m, 1);
break;
}
}
if (targetElement.id.indexOf('NavigationIndex') > -1) {
var index = parseInt(targetElement.id.split('_NavigationIndex_')[1].split('_')[0], 10);
var layerIndex = parseInt(targetElement.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);
targetElement.setAttribute('stroke-width', _this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());
targetElement.setAttribute('stroke', _this.maps.layers[layerIndex].navigationLineSettings[index].color);
}
}
else {
var layetElement = helper_1.getElementByID(_this.maps.element.id + '_Layer_Collections');
if (!_this.selectionsettings.enableMultiSelect &&
(layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle').length > 0 ||
layetElement.getElementsByClassName('LineselectionMapStyle').length > 0)) {
var eleCount = layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle').length;
var ele = void 0;
for (var k = 0; k < eleCount; k++) {
ele = layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle')[0];
helper_1.removeClass(ele);
_this.removedSelectionList(ele);
}
if (layetElement.getElementsByClassName('LineselectionMapStyle').length > 0) {
eleCount = layetElement.getElementsByClassName('LineselectionMapStyle').length;
for (var k = 0; k < eleCount; k++) {
ele = layetElement.getElementsByClassName('LineselectionMapStyle')[0];
helper_1.removeClass(ele);
_this.removedSelectionList(ele);
}
}
if (_this.selectionType === 'Shape') {
_this.maps.shapeSelectionItem = [];
var selectionLength = _this.maps.selectedElementId.length;
for (var i = 0; i < selectionLength; i++) {
ele = layetElement.getElementsByClassName(_this.selectionType + 'selectionMapStyle')[0];
helper_1.removeClass(ele);
var selectedElementIdIndex = _this.maps.selectedElementId.indexOf(ele.getAttribute('id'));
_this.maps.selectedElementId.splice(selectedElementIdIndex, 1);
}
}
if (ele.id.indexOf('NavigationIndex') > -1) {
var index = parseInt(targetElement.id.split('_NavigationIndex_')[1].split('_')[0], 10);
var layerIndex = parseInt(targetElement.parentElement.id.split('_LayerIndex_')[1].split('_')[0], 10);
ele.setAttribute('stroke-width', _this.maps.layers[layerIndex].navigationLineSettings[index].width.toString());
ele.setAttribute('stroke', _this.maps.layers[layerIndex].navigationLineSettings[index].color);
}
}
if (!isLineStringShape) {
if (!helper_1.getElement(_this.selectionType + 'selectionMap')) {
document.body.appendChild(helper_1.createStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs));
}
else {
helper_1.customizeStyle(_this.selectionType + 'selectionMap', _this.selectionType + 'selectionMapStyle', eventArgs);
}
targetElement.setAttribute('class', _this.selectionType + 'selectionMapStyle');
}
else {
if (!helper_1.getElement('LineselectionMap')) {
document.body.appendChild(helper_1.createStyle('LineselectionMap', 'LineselectionMapStyle', eventArgs));
}
else {
helper_1.customizeStyle('LineselectionMap', 'LineselectionMapStyle', eventArgs);
}
targetElement.setAttribute('class', 'LineselectionMapStyle');
}
if (targetElement.getAttribute('class') === 'ShapeselectionMapStyle') {
_this.maps.shapeSelectionClass = helper_1.getElement(_this.selectionType + 'selectionMap');
_this.maps.selectedElementId.push(targetElement.getAttribute('id'));
_this.maps.shapeSelectionItem.push(eventArgs.shapeData);
}
if (targetElement.getAttribute('class') === 'MarkerselectionMapStyle') {
_this.maps.markerSelectionClass = helper_1.getElement(_this.selectionType + 'selectionMap');
_this.maps.selectedMarkerElementId.push(targetElement.getAttribute('id'));
}
if (targetElement.getAttribute('class') === 'BubbleselectionMapStyle') {
_this.maps.bubbleSelectionClass = helper_1.getElement(_this.selectionType + 'selectionMap');
_this.maps.selectedBubbleElementId.push(targetElement.getAttribute('id'));
}
if (targetElement.getAttribute('class') === 'navigationlineselectionMapStyle') {
_this.maps.navigationSelectionClass = helper_1.getElement(_this.selectionType + 'selectionMap');
_this.maps.selectedNavigationElementId.push(targetElement.getAttribute('id'));
}
if (targetElement.getAttribute('class') === 'PolygonselectionMapStyle') {
_this.maps.polygonSelectionClass = helper_1.getElement(_this.selectionType + 'selectionMap');
_this.maps.selectedPolygonElementId.push(targetElement.getAttribute('id'));
}
}
}
});
};
Selection.prototype.removedSelectionList = function (targetElement) {
if (this.selectionType === 'Shape') {
this.maps.selectedElementId.splice(this.maps.selectedElementId.indexOf(targetElement.getAttribute('id')), 1);
}
Iif (this.selectionType === 'Bubble') {
this.maps.selectedBubbleElementId.splice(this.maps.selectedBubbleElementId.indexOf(targetElement.getAttribute('id')), 1);
}
Iif (this.selectionType === 'Marker') {
this.maps.selectedMarkerElementId.splice(this.maps.selectedMarkerElementId.indexOf(targetElement.getAttribute('id')), 1);
}
if (this.selectionType === 'navigationline') {
this.maps.selectedBubbleElementId.splice(this.maps.selectedBubbleElementId.indexOf(targetElement.getAttribute('id')), 1);
}
if (this.selectionType === 'Polygon') {
this.maps.selectedPolygonElementId.splice(this.maps.selectedPolygonElementId.indexOf(targetElement.getAttribute('id')), 1);
}
};
Selection.prototype.getModuleName = function () {
return 'Selection';
};
Selection.prototype.destroy = function () {
this.selectionsettings = null;
this.removeEventListener();
this.maps = null;
};
return Selection;
}());
exports.Selection = Selection;
});
|