Refactoring code to dynamic color point in trip-animation widget

Vladyslav_Prykhodko
1 parent 68eebaf0
Showing 4 changed files with 20 additions and 20 deletions
ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts
ui-ngx/src/app/modules/home/components/widget/lib/maps/schemes.ts
ui-ngx/src/app/modules/home/components/widget/trip-animation/trip-animation.component.ts
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
View file @034ea03
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
View file @034ea03
@@ -626,11 +626,11 @@ export default abstract class LeafletMap {
       }
       this.points = new FeatureGroup();
     }
-	  let pointColor = this.options.pointColor;
+    let pointColor = this.options.pointColor;
     for (const pointsList of pointsData) {
       pointsList.filter(pdata => !!this.convertPosition(pdata)).forEach(data => {
         if (this.options.useColorPointFunction) {
-          pointColor = safeExecute(this.options.colorPointFunction,[data, pointsData, data.dsIndex]);
+          pointColor = safeExecute(this.options.colorPointFunction, [data, pointsData, data.dsIndex]);
         }
         const point = L.circleMarker(this.convertPosition(data), {
           color: pointColor,
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts
View file @034ea03
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts
View file @034ea03
@@ -301,7 +301,7 @@ export class MapWidgetController implements MapWidgetInterface {
             labelFunction: parseFunction(settings.labelFunction, functionParams),
             tooltipFunction: parseFunction(settings.tooltipFunction, functionParams),
             colorFunction: parseFunction(settings.colorFunction, functionParams),
-			      colorPointFunction: parseFunction(settings.colorPointFunction, functionParams),
+            colorPointFunction: parseFunction(settings.colorPointFunction, functionParams),
             polygonColorFunction: parseFunction(settings.polygonColorFunction, functionParams),
             polygonTooltipFunction: parseFunction(settings.polygonTooltipFunction, functionParams),
             markerImageFunction: parseFunction(settings.markerImageFunction, ['data', 'images', 'dsData', 'dsIndex']),
--- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/schemes.ts
View file @034ea03
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/schemes.ts
View file @034ea03
@@ -871,6 +871,15 @@ export const pointSchema =
                 title: 'Point color',
                 type: 'string'
             },
+            useColorPointFunction: {
+                title: 'Use color point function',
+                type: 'boolean',
+                default: false
+            },
+            colorPointFunction: {
+                title: 'Color point function: f(data, dsData, dsIndex)',
+                type: 'string'
+            },
             pointSize: {
                 title: 'Point size (px)',
                 type: 'number',
@@ -899,6 +908,11 @@ export const pointSchema =
             key: 'pointColor',
             type: 'color'
         },
+        'useColorPointFunction',
+        {
+          key: 'colorPointFunction',
+          type: 'javascript'
+        },
         'pointSize',
         'usePointAsAnchor',
         {
@@ -1036,15 +1050,6 @@ export const tripAnimationSchema = {
                 title: 'Custom marker image',
                 type: 'string'
             },
-           useColorPointFunction: {
-                title: 'Use color point function',
-                type: 'boolean',
-                default: false
-            },
-            colorPointFunction: {
-                title: 'Color point function: f(data, dsData, dsIndex)',
-                type: 'string'
-            },			
             markerImageSize: {
                 title: 'Custom marker image size (px)',
                 type: 'number',
@@ -1090,12 +1095,7 @@ export const tripAnimationSchema = {
     }, 'useTooltipFunction', {
         key: 'tooltipFunction',
         type: 'javascript'
-    }, 'autocloseTooltip', 'useColorPointFunction',
-    {
-        key: 'colorPointFunction',
-        type: 'javascript'
-    },
-    {
+    }, 'autocloseTooltip', {
         key: 'markerImage',
         type: 'image'
     }, 'markerImageSize', 'rotationAngle', 'useMarkerImageFunction',
--- a/ui-ngx/src/app/modules/home/components/widget/trip-animation/trip-animation.component.ts
View file @034ea03
+++ b/ui-ngx/src/app/modules/home/components/widget/trip-animation/trip-animation.component.ts
View file @034ea03
@@ -112,7 +112,7 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy 
     this.settings.pointAsAnchorFunction = parseFunction(this.settings.pointAsAnchorFunction, ['data', 'dsData', 'dsIndex']);
     this.settings.tooltipFunction = parseFunction(this.settings.tooltipFunction, ['data', 'dsData', 'dsIndex']);
     this.settings.labelFunction = parseFunction(this.settings.labelFunction, ['data', 'dsData', 'dsIndex']);
-	  this.settings.colorPointFunction = parseFunction(this.settings.colorPointFunction, ['data', 'dsData', 'dsIndex']);
+    this.settings.colorPointFunction = parseFunction(this.settings.colorPointFunction, ['data', 'dsData', 'dsIndex']);
     this.normalizationStep = this.settings.normalizationStep;
     const subscription = this.ctx.defaultSubscription;
     subscription.callbacks.onDataUpdated = () => {
@@ -179,7 +179,7 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy 
       if (this.settings.showPolygon) {
         this.mapWidget.map.updatePolygons(this.interpolatedTimeData);
       }
-      if (this.settings.showPoints || this.settings.useColorPointFunction) {
+      if (this.settings.showPoints) {
         this.mapWidget.map.updatePoints(formattedInterpolatedTimeData.map(ds => _.union(ds)), this.calcTooltip);
       }
       this.mapWidget.map.updateMarkers(currentPosition, true, (trip) => {