Showing
2 changed files
with
60 additions
and
73 deletions
... | ... | @@ -4,19 +4,23 @@ import { deepClone } from '@core/utils'; |
4 | 4 | import { openstreetMapSettingsSchema, googleMapSettingsSchema, imageMapSettingsSchema, tencentMapSettingsSchema, hereMapSettingsSchema, commonMapSettingsSchema, routeMapSettingsSchema, markerClusteringSettingsSchema, markerClusteringSettingsSchemaGoogle, markerClusteringSettingsSchemaLeaflet } from './schemes'; |
5 | 5 | import { MapWidgetStaticInterface, MapWidgetInterface } from './map-widget.interface'; |
6 | 6 | import { OpenStreetMap, TencentMap, ImageMap, GoogleMap } from './providers'; |
7 | +import { string } from 'prop-types'; | |
7 | 8 | |
8 | 9 | const providerSets = { |
9 | 10 | 'openstreet-map': { |
10 | 11 | MapClass: OpenStreetMap, |
11 | - schema: openstreetMapSettingsSchema | |
12 | + schema: openstreetMapSettingsSchema, | |
13 | + name: "Openstreet" | |
12 | 14 | }, |
13 | 15 | 'tencent-map': { |
14 | 16 | MapClass: TencentMap, |
15 | - schema: tencentMapSettingsSchema | |
17 | + schema: tencentMapSettingsSchema, | |
18 | + name: "Tencent" | |
16 | 19 | }, |
17 | 20 | 'google-map': { |
18 | 21 | MapClass: GoogleMap, |
19 | - schema: googleMapSettingsSchema | |
22 | + schema: googleMapSettingsSchema, | |
23 | + name: "Openstreet" | |
20 | 24 | }, |
21 | 25 | 'image-map': { |
22 | 26 | MapClass: ImageMap, |
... | ... | @@ -32,13 +36,12 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface { |
32 | 36 | |
33 | 37 | constructor(mapProvider: MapProviders, drawRoutes, ctx, useDynamicLocations, $element, isEdit) { |
34 | 38 | console.log(ctx.settings); |
35 | - | |
36 | - // if(!$element) return | |
39 | + | |
37 | 40 | if (!$element) { |
38 | 41 | $element = ctx.$container[0]; |
39 | 42 | } |
40 | 43 | this.provider = mapProvider; |
41 | - const options: MapOptions = { | |
44 | + const baseOptions: MapOptions = { | |
42 | 45 | initCallback: () => { }, |
43 | 46 | defaultZoomLevel: 8, |
44 | 47 | dontFitMapBounds: false, |
... | ... | @@ -51,11 +54,10 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface { |
51 | 54 | markerClusteringSetting: null |
52 | 55 | } |
53 | 56 | let MapClass = providerSets[mapProvider]?.MapClass; |
54 | - if(!MapClass){ | |
55 | - //delete this; | |
57 | + if (!MapClass) { | |
56 | 58 | return; |
57 | 59 | } |
58 | - this.map = new MapClass($element, options) | |
60 | + this.map = new MapClass($element, { ...baseOptions, ...ctx.settings }) | |
59 | 61 | |
60 | 62 | this.schema = providerSets[mapProvider]?.schema; |
61 | 63 | } |
... | ... | @@ -68,7 +70,7 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface { |
68 | 70 | |
69 | 71 | onResize() { |
70 | 72 | this.map.onResize();//not work |
71 | - } | |
73 | + } | |
72 | 74 | |
73 | 75 | getSettingsSchema(): Object { |
74 | 76 | return this.schema; |
... | ... | @@ -84,74 +86,57 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface { |
84 | 86 | } |
85 | 87 | |
86 | 88 | public static settingsSchema(mapProvider, drawRoutes): Object { |
87 | - var schema; | |
88 | - if (mapProvider === 'google-map') { | |
89 | - schema = googleMapSettingsSchema; | |
90 | - schema.groupInfoes = [{ | |
91 | - "formIndex": 0, | |
92 | - "GroupTitle": "Google Map Settings" | |
93 | - }]; | |
94 | - } else if (mapProvider === 'openstreet-map') { | |
95 | - schema = deepClone(openstreetMapSettingsSchema); | |
96 | - schema.groupInfoes = [{ | |
97 | - "formIndex": 0, | |
98 | - "GroupTitle": "Openstreet Map Settings" | |
99 | - }]; | |
100 | - } else if (mapProvider === 'image-map') { | |
101 | - return imageMapSettingsSchema; | |
102 | - } else if (mapProvider === 'tencent-map') { | |
103 | - schema = deepClone(tencentMapSettingsSchema); | |
104 | - schema.groupInfoes = [{ | |
105 | - "formIndex": 0, | |
106 | - "GroupTitle": "Tencent Map Settings" | |
107 | - }]; | |
108 | - } else if (mapProvider === 'here') { | |
109 | - schema = deepClone(hereMapSettingsSchema); | |
110 | - schema.groupInfoes = [{ | |
111 | - "formIndex": 0, | |
112 | - "GroupTitle": "Here Map Settings" | |
113 | - }]; | |
89 | + const providerInfo = providerSets[mapProvider]; | |
90 | + let schema = providerInfo.schema; | |
91 | + schema.groupInfoes = []; | |
92 | + | |
93 | + function addGroupInfo(title: string) { | |
94 | + schema.groupInfoes.push({ | |
95 | + "formIndex": schema.groupInfoes?.length || 0, | |
96 | + "GroupTitle": title | |
97 | + }); | |
114 | 98 | } |
115 | - if (!schema.groupInfoes) schema.groupInfoes = []; | |
99 | + | |
100 | + function mergeSchema(newSchema) { | |
101 | + Object.assign(schema.schema.properties, newSchema.schema.properties); | |
102 | + schema.schema.required = schema.schema.required.concat(newSchema.schema.required); | |
103 | + schema.form.push(newSchema.form);//schema.form.concat(commonMapSettingsSchema.form); | |
104 | + } | |
105 | + | |
106 | + if (providerInfo.name) | |
107 | + addGroupInfo(providerInfo.name + ' Map Settings'); | |
116 | 108 | schema.form = [schema.form]; |
117 | 109 | |
118 | - Object.assign(schema.schema.properties, commonMapSettingsSchema.schema.properties); | |
119 | - schema.schema.required = schema.schema.required.concat(commonMapSettingsSchema.schema.required); | |
120 | - schema.form.push(commonMapSettingsSchema.form);//schema.form.concat(commonMapSettingsSchema.form); | |
121 | - schema.groupInfoes.push({ | |
122 | - "formIndex": schema.groupInfoes.length, | |
123 | - "GroupTitle": "Common Map Settings" | |
124 | - }); | |
110 | + mergeSchema(commonMapSettingsSchema); | |
111 | + addGroupInfo("Common Map Settings"); | |
112 | + | |
125 | 113 | if (drawRoutes) { |
126 | - Object.assign(schema.schema.properties, routeMapSettingsSchema.schema.properties); | |
127 | - schema.schema.required = schema.schema.required.concat(routeMapSettingsSchema.schema.required); | |
128 | - schema.form.push(routeMapSettingsSchema.form);//schema.form = schema.form.concat(routeMapSettingsSchema.form); | |
129 | - schema.groupInfoes.push({ | |
130 | - "formIndex": schema.groupInfoes.length, | |
131 | - "GroupTitle": "Route Map Settings" | |
132 | - }); | |
114 | + mergeSchema(routeMapSettingsSchema); | |
115 | + addGroupInfo("Route Map Settings"); | |
133 | 116 | } else if (mapProvider !== 'image-map') { |
134 | - Object.assign(schema.schema.properties, markerClusteringSettingsSchema.schema.properties); | |
135 | - schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchema.schema.required); | |
136 | - schema.form.push(markerClusteringSettingsSchema.form); | |
137 | - if (mapProvider === 'google-map' || mapProvider === 'tencent-map') { | |
138 | - Object.assign(schema.schema.properties, markerClusteringSettingsSchemaGoogle.schema.properties); | |
139 | - schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchemaGoogle.schema.required); | |
140 | - schema.form[schema.form.length - 1] = schema.form[schema.form.length - 1].concat(markerClusteringSettingsSchemaGoogle.form); | |
141 | - } | |
142 | - if (mapProvider === 'openstreet-map' || mapProvider === 'here') { | |
143 | - Object.assign(schema.schema.properties, markerClusteringSettingsSchemaLeaflet.schema.properties); | |
144 | - schema.schema.required = schema.schema.required.concat(markerClusteringSettingsSchemaLeaflet.schema.required); | |
145 | - schema.form[schema.form.length - 1] = schema.form[schema.form.length - 1].concat(markerClusteringSettingsSchemaLeaflet.form); | |
146 | - } | |
147 | - schema.groupInfoes.push({ | |
148 | - "formIndex": schema.groupInfoes.length, | |
149 | - "GroupTitle": "Markers Clustering Settings" | |
150 | - }); | |
117 | + let clusteringSchema: any = { | |
118 | + schema: { | |
119 | + properties: { | |
120 | + ...markerClusteringSettingsSchemaLeaflet.schema.properties, | |
121 | + ...markerClusteringSettingsSchema.schema.properties | |
122 | + }, | |
123 | + required: { | |
124 | + ...markerClusteringSettingsSchemaLeaflet.schema.required, | |
125 | + ...markerClusteringSettingsSchema.schema.required | |
126 | + } | |
127 | + }, | |
128 | + form: [ | |
129 | + ...markerClusteringSettingsSchemaLeaflet.form, | |
130 | + ...markerClusteringSettingsSchema.form | |
131 | + ] | |
132 | + }; | |
133 | + mergeSchema(clusteringSchema); | |
134 | + addGroupInfo("Markers Clustering Settings"); | |
151 | 135 | } |
152 | - return schema; | |
153 | 136 | |
137 | + return schema; | |
154 | 138 | } |
139 | + | |
155 | 140 | public static actionSources(): Object { |
156 | 141 | return { |
157 | 142 | 'markerClick': { |
... | ... | @@ -168,10 +153,9 @@ TbMapWidgetV2 = class TbMapWidgetV2 implements MapWidgetInterface { |
168 | 153 | } |
169 | 154 | }; |
170 | 155 | } |
156 | + | |
171 | 157 | onDestroy() { |
172 | 158 | } |
173 | - | |
174 | - | |
175 | 159 | } |
176 | 160 | |
177 | 161 | let defaultSettings = { | ... | ... |