@@ -73,17 +73,6 @@ export class FieldGisEditMap extends Component {
7373 }
7474 }
7575
76- onLoadMap ( ) {
77- if ( this . props . record . data [ this . props . name ] ) {
78- this . map . on ( "load" , async ( ) => {
79- this . addSourceAndLayer (
80- this . sourceId ,
81- this . props . record . data [ this . props . name ]
82- ) ;
83- } ) ;
84- }
85- }
86-
8776 _getMapStyle ( ) {
8877 if ( this . mapTilerKey ) {
8978 return maptilersdk . MapStyle . STREETS ;
@@ -169,73 +158,6 @@ export class FieldGisEditMap extends Component {
169158 return null ;
170159 }
171160
172- addSourceAndLayer ( sourceId , jsonString ) {
173- if ( ! this . map . getSource ( sourceId ) ) {
174- this . addSource ( sourceId , jsonString ) ;
175- this . addLayer ( sourceId ) ;
176- }
177- }
178-
179- addSource ( sourceId , jsonString ) {
180- const obj = JSON . parse ( jsonString ) ;
181- const centroid = turf . centroid ( obj ) ;
182-
183- this . map . addSource ( sourceId , {
184- type : "geojson" ,
185- data : obj ,
186- } ) ;
187- this . map . setCenter ( centroid . geometry . coordinates ) ;
188-
189- this . source = this . map . getSource ( sourceId ) ;
190- }
191-
192- addLayer ( sourceId ) {
193- // Polygon
194- this . map . addLayer ( {
195- id : `${ sourceId } -polygon-layerid` ,
196- type : "fill" ,
197- source : sourceId ,
198- filter : [ "all" , [ "==" , "$type" , "Polygon" ] , [ "!=" , "mode" , "static" ] ] ,
199- layout : { } ,
200- paint : {
201- "fill-color" : "#98b" ,
202- "fill-opacity" : 0.8 ,
203- } ,
204- } ) ;
205-
206- // Point
207- this . map . addLayer ( {
208- id : `${ sourceId } -point-layerid` ,
209- type : "circle" ,
210- source : sourceId ,
211- filter : [ "all" , [ "==" , "$type" , "Point" ] , [ "!=" , "mode" , "static" ] ] ,
212- layout : { } ,
213- paint : {
214- "circle-color" : "#FF680A" ,
215- } ,
216- } ) ;
217-
218- // Linestring
219- this . map . addLayer ( {
220- id : `${ sourceId } -linestring-layerid` ,
221- type : "line" ,
222- source : sourceId ,
223- filter : [ "all" , [ "==" , "$type" , "LineString" ] , [ "!=" , "mode" , "static" ] ] ,
224- layout : { } ,
225- paint : {
226- "line-color" : "#e11" ,
227- "line-width" : 4 ,
228- } ,
229- } ) ;
230- }
231-
232- removeSourceAndLayer ( source ) {
233- this . map . removeLayer ( `${ source } -polygon-layerid` ) ;
234- this . map . removeLayer ( `${ source } -point-layerid` ) ;
235- this . map . removeLayer ( `${ source } -linestring-layerid` ) ;
236- this . map . removeSource ( source ) ;
237- }
238-
239161 onUIChange ( ) {
240162 this . addDrawInteraction ( ) ;
241163 }
@@ -244,18 +166,26 @@ export class FieldGisEditMap extends Component {
244166 const self = this ;
245167 const hasData = Boolean ( this . props . record . data [ this . props . name ] ) ;
246168
247- function updateArea ( e ) {
248- var data = self . draw . getAll ( ) ;
249- if ( data . features . length > 0 ) {
250- self . props . record . update ( {
251- [ self . props . name ] : JSON . stringify ( data . features [ 0 ] . geometry ) ,
252- } ) ;
253- }
169+ // Remove previous event listeners to prevent stacking on onUIChange() calls
170+ if ( this . _drawHandlers ) {
171+ this . map . off ( "draw.create" , this . _drawHandlers . update ) ;
172+ this . map . off ( "draw.update" , this . _drawHandlers . update ) ;
173+ this . map . off ( "draw.delete" , this . _drawHandlers . delete ) ;
254174 }
255175
256- function deleteArea ( e ) {
257- self . props . record . update ( { [ self . props . name ] : null } ) ;
258- }
176+ this . _drawHandlers = {
177+ update ( e ) {
178+ var data = self . draw . getAll ( ) ;
179+ if ( data . features . length > 0 ) {
180+ self . props . record . update ( {
181+ [ self . props . name ] : JSON . stringify ( data . features [ 0 ] . geometry ) ,
182+ } ) ;
183+ }
184+ } ,
185+ delete ( e ) {
186+ self . props . record . update ( { [ self . props . name ] : null } ) ;
187+ } ,
188+ } ;
259189
260190 if ( this . draw ) {
261191 this . map . removeControl ( this . draw ) ;
@@ -303,9 +233,9 @@ export class FieldGisEditMap extends Component {
303233 }
304234 }
305235
306- this . map . on ( "draw.create" , updateArea ) ;
307- this . map . on ( "draw.update" , updateArea ) ;
308- this . map . on ( "draw.delete" , deleteArea ) ;
236+ this . map . on ( "draw.create" , this . _drawHandlers . update ) ;
237+ this . map . on ( "draw.update" , this . _drawHandlers . update ) ;
238+ this . map . on ( "draw.delete" , this . _drawHandlers . delete ) ;
309239 }
310240
311241 addDrawInteractionStyle ( ) {
0 commit comments