Commit 034ea03f247b1c0354e7b708460c6086c5e87e4f

Authored by Vladyslav_Prykhodko
1 parent 68eebaf0

Refactoring code to dynamic color point in trip-animation widget

... ... @@ -626,11 +626,11 @@ export default abstract class LeafletMap {
626 626 }
627 627 this.points = new FeatureGroup();
628 628 }
629   - let pointColor = this.options.pointColor;
  629 + let pointColor = this.options.pointColor;
630 630 for (const pointsList of pointsData) {
631 631 pointsList.filter(pdata => !!this.convertPosition(pdata)).forEach(data => {
632 632 if (this.options.useColorPointFunction) {
633   - pointColor = safeExecute(this.options.colorPointFunction,[data, pointsData, data.dsIndex]);
  633 + pointColor = safeExecute(this.options.colorPointFunction, [data, pointsData, data.dsIndex]);
634 634 }
635 635 const point = L.circleMarker(this.convertPosition(data), {
636 636 color: pointColor,
... ...
... ... @@ -301,7 +301,7 @@ export class MapWidgetController implements MapWidgetInterface {
301 301 labelFunction: parseFunction(settings.labelFunction, functionParams),
302 302 tooltipFunction: parseFunction(settings.tooltipFunction, functionParams),
303 303 colorFunction: parseFunction(settings.colorFunction, functionParams),
304   - colorPointFunction: parseFunction(settings.colorPointFunction, functionParams),
  304 + colorPointFunction: parseFunction(settings.colorPointFunction, functionParams),
305 305 polygonColorFunction: parseFunction(settings.polygonColorFunction, functionParams),
306 306 polygonTooltipFunction: parseFunction(settings.polygonTooltipFunction, functionParams),
307 307 markerImageFunction: parseFunction(settings.markerImageFunction, ['data', 'images', 'dsData', 'dsIndex']),
... ...
... ... @@ -871,6 +871,15 @@ export const pointSchema =
871 871 title: 'Point color',
872 872 type: 'string'
873 873 },
  874 + useColorPointFunction: {
  875 + title: 'Use color point function',
  876 + type: 'boolean',
  877 + default: false
  878 + },
  879 + colorPointFunction: {
  880 + title: 'Color point function: f(data, dsData, dsIndex)',
  881 + type: 'string'
  882 + },
874 883 pointSize: {
875 884 title: 'Point size (px)',
876 885 type: 'number',
... ... @@ -899,6 +908,11 @@ export const pointSchema =
899 908 key: 'pointColor',
900 909 type: 'color'
901 910 },
  911 + 'useColorPointFunction',
  912 + {
  913 + key: 'colorPointFunction',
  914 + type: 'javascript'
  915 + },
902 916 'pointSize',
903 917 'usePointAsAnchor',
904 918 {
... ... @@ -1036,15 +1050,6 @@ export const tripAnimationSchema = {
1036 1050 title: 'Custom marker image',
1037 1051 type: 'string'
1038 1052 },
1039   - useColorPointFunction: {
1040   - title: 'Use color point function',
1041   - type: 'boolean',
1042   - default: false
1043   - },
1044   - colorPointFunction: {
1045   - title: 'Color point function: f(data, dsData, dsIndex)',
1046   - type: 'string'
1047   - },
1048 1053 markerImageSize: {
1049 1054 title: 'Custom marker image size (px)',
1050 1055 type: 'number',
... ... @@ -1090,12 +1095,7 @@ export const tripAnimationSchema = {
1090 1095 }, 'useTooltipFunction', {
1091 1096 key: 'tooltipFunction',
1092 1097 type: 'javascript'
1093   - }, 'autocloseTooltip', 'useColorPointFunction',
1094   - {
1095   - key: 'colorPointFunction',
1096   - type: 'javascript'
1097   - },
1098   - {
  1098 + }, 'autocloseTooltip', {
1099 1099 key: 'markerImage',
1100 1100 type: 'image'
1101 1101 }, 'markerImageSize', 'rotationAngle', 'useMarkerImageFunction',
... ...
... ... @@ -112,7 +112,7 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy
112 112 this.settings.pointAsAnchorFunction = parseFunction(this.settings.pointAsAnchorFunction, ['data', 'dsData', 'dsIndex']);
113 113 this.settings.tooltipFunction = parseFunction(this.settings.tooltipFunction, ['data', 'dsData', 'dsIndex']);
114 114 this.settings.labelFunction = parseFunction(this.settings.labelFunction, ['data', 'dsData', 'dsIndex']);
115   - this.settings.colorPointFunction = parseFunction(this.settings.colorPointFunction, ['data', 'dsData', 'dsIndex']);
  115 + this.settings.colorPointFunction = parseFunction(this.settings.colorPointFunction, ['data', 'dsData', 'dsIndex']);
116 116 this.normalizationStep = this.settings.normalizationStep;
117 117 const subscription = this.ctx.defaultSubscription;
118 118 subscription.callbacks.onDataUpdated = () => {
... ... @@ -179,7 +179,7 @@ export class TripAnimationComponent implements OnInit, AfterViewInit, OnDestroy
179 179 if (this.settings.showPolygon) {
180 180 this.mapWidget.map.updatePolygons(this.interpolatedTimeData);
181 181 }
182   - if (this.settings.showPoints || this.settings.useColorPointFunction) {
  182 + if (this.settings.showPoints) {
183 183 this.mapWidget.map.updatePoints(formattedInterpolatedTimeData.map(ds => _.union(ds)), this.calcTooltip);
184 184 }
185 185 this.mapWidget.map.updateMarkers(currentPosition, true, (trip) => {
... ...