Commit 2e445e79b6ac737dfcee79c04e194ea4ae8aa023
Committed by
GitHub
Merge pull request #526 from jktu2870/flot
UI:Fix 'Timeseries - Flot' widget (the legend breaks tooltips)
Showing
1 changed file
with
52 additions
and
9 deletions
@@ -238,6 +238,7 @@ export default class TbFlot { | @@ -238,6 +238,7 @@ export default class TbFlot { | ||
238 | if (this.ticksFormatterFunction) { | 238 | if (this.ticksFormatterFunction) { |
239 | return this.ticksFormatterFunction(value); | 239 | return this.ticksFormatterFunction(value); |
240 | } | 240 | } |
241 | + | ||
241 | var factor = this.tickDecimals ? Math.pow(10, this.tickDecimals) : 1, | 242 | var factor = this.tickDecimals ? Math.pow(10, this.tickDecimals) : 1, |
242 | formatted = "" + Math.round(value * factor) / factor; | 243 | formatted = "" + Math.round(value * factor) / factor; |
243 | if (this.tickDecimals != null) { | 244 | if (this.tickDecimals != null) { |
@@ -248,9 +249,12 @@ export default class TbFlot { | @@ -248,9 +249,12 @@ export default class TbFlot { | ||
248 | formatted = (precision ? formatted : formatted + ".") + ("" + factor).substr(1, this.tickDecimals - precision); | 249 | formatted = (precision ? formatted : formatted + ".") + ("" + factor).substr(1, this.tickDecimals - precision); |
249 | } | 250 | } |
250 | } | 251 | } |
251 | - formatted += ' ' + this.tickUnits; | 252 | + if (this.tickUnits) { |
253 | + formatted += ' ' + this.tickUnits; | ||
254 | + } | ||
255 | + | ||
252 | return formatted; | 256 | return formatted; |
253 | - } | 257 | + }; |
254 | 258 | ||
255 | this.yaxis.tickFormatter = ctx.yAxisTickFormatter; | 259 | this.yaxis.tickFormatter = ctx.yAxisTickFormatter; |
256 | 260 | ||
@@ -262,6 +266,16 @@ export default class TbFlot { | @@ -262,6 +266,16 @@ export default class TbFlot { | ||
262 | this.yaxis.labelFont.color = this.yaxis.font.color; | 266 | this.yaxis.labelFont.color = this.yaxis.font.color; |
263 | this.yaxis.labelFont.size = this.yaxis.font.size+2; | 267 | this.yaxis.labelFont.size = this.yaxis.font.size+2; |
264 | this.yaxis.labelFont.weight = "bold"; | 268 | this.yaxis.labelFont.weight = "bold"; |
269 | + if (angular.isNumber(settings.yaxis.tickSize)) { | ||
270 | + this.yaxis.tickSize = settings.yaxis.tickSize; | ||
271 | + } else { | ||
272 | + this.yaxis.tickSize = null; | ||
273 | + } | ||
274 | + if (angular.isNumber(settings.yaxis.tickDecimals)) { | ||
275 | + this.yaxis.tickDecimals = settings.yaxis.tickDecimals | ||
276 | + } else { | ||
277 | + this.yaxis.tickDecimals = null; | ||
278 | + } | ||
265 | if (settings.yaxis.ticksFormatter && settings.yaxis.ticksFormatter.length) { | 279 | if (settings.yaxis.ticksFormatter && settings.yaxis.ticksFormatter.length) { |
266 | try { | 280 | try { |
267 | this.yaxis.ticksFormatterFunction = new Function('value', settings.yaxis.ticksFormatter); | 281 | this.yaxis.ticksFormatterFunction = new Function('value', settings.yaxis.ticksFormatter); |
@@ -491,9 +505,19 @@ export default class TbFlot { | @@ -491,9 +505,19 @@ export default class TbFlot { | ||
491 | 505 | ||
492 | createYAxis(keySettings, units) { | 506 | createYAxis(keySettings, units) { |
493 | var yaxis = angular.copy(this.yaxis); | 507 | var yaxis = angular.copy(this.yaxis); |
508 | + var tickDecimals, tickSize; | ||
494 | 509 | ||
495 | var label = keySettings.axisTitle && keySettings.axisTitle.length ? keySettings.axisTitle : yaxis.label; | 510 | var label = keySettings.axisTitle && keySettings.axisTitle.length ? keySettings.axisTitle : yaxis.label; |
496 | - var tickDecimals = angular.isDefined(keySettings.axisTickDecimals) ? keySettings.axisTickDecimals : 0; | 511 | + if (angular.isNumber(keySettings.axisTickDecimals)) { |
512 | + tickDecimals = keySettings.axisTickDecimals; | ||
513 | + } else { | ||
514 | + tickDecimals = yaxis.tickDecimals; | ||
515 | + } | ||
516 | + if (angular.isNumber(keySettings.axisTickSize)) { | ||
517 | + tickSize = keySettings.axisTickSize; | ||
518 | + } else { | ||
519 | + tickSize = yaxis.tickSize; | ||
520 | + } | ||
497 | var position = keySettings.axisPosition && keySettings.axisPosition.length ? keySettings.axisPosition : "left"; | 521 | var position = keySettings.axisPosition && keySettings.axisPosition.length ? keySettings.axisPosition : "left"; |
498 | 522 | ||
499 | var min = angular.isDefined(keySettings.axisMin) ? keySettings.axisMin : yaxis.min; | 523 | var min = angular.isDefined(keySettings.axisMin) ? keySettings.axisMin : yaxis.min; |
@@ -504,6 +528,7 @@ export default class TbFlot { | @@ -504,6 +528,7 @@ export default class TbFlot { | ||
504 | yaxis.max = max; | 528 | yaxis.max = max; |
505 | yaxis.tickUnits = units; | 529 | yaxis.tickUnits = units; |
506 | yaxis.tickDecimals = tickDecimals; | 530 | yaxis.tickDecimals = tickDecimals; |
531 | + yaxis.tickSize = tickSize; | ||
507 | yaxis.alignTicksWithAxis = position == "right" ? 1 : null; | 532 | yaxis.alignTicksWithAxis = position == "right" ? 1 : null; |
508 | yaxis.position = position; | 533 | yaxis.position = position; |
509 | 534 | ||
@@ -549,7 +574,7 @@ export default class TbFlot { | @@ -549,7 +574,7 @@ export default class TbFlot { | ||
549 | } | 574 | } |
550 | } | 575 | } |
551 | yaxis.hidden = hidden; | 576 | yaxis.hidden = hidden; |
552 | - var newIndex = -1; | 577 | + var newIndex = 1; |
553 | if (!yaxis.hidden) { | 578 | if (!yaxis.hidden) { |
554 | this.options.yaxes.push(yaxis); | 579 | this.options.yaxes.push(yaxis); |
555 | newIndex = this.options.yaxes.length; | 580 | newIndex = this.options.yaxes.length; |
@@ -932,6 +957,16 @@ export default class TbFlot { | @@ -932,6 +957,16 @@ export default class TbFlot { | ||
932 | "title": "Ticks formatter function, f(value)", | 957 | "title": "Ticks formatter function, f(value)", |
933 | "type": "string", | 958 | "type": "string", |
934 | "default": "" | 959 | "default": "" |
960 | + }, | ||
961 | + "tickDecimals": { | ||
962 | + "title": "The number of decimals to display", | ||
963 | + "type": "number", | ||
964 | + "default": 0 | ||
965 | + }, | ||
966 | + "tickSize": { | ||
967 | + "title": "Step size between ticks", | ||
968 | + "type": "number", | ||
969 | + "default": null | ||
935 | } | 970 | } |
936 | } | 971 | } |
937 | } | 972 | } |
@@ -990,6 +1025,8 @@ export default class TbFlot { | @@ -990,6 +1025,8 @@ export default class TbFlot { | ||
990 | "items": [ | 1025 | "items": [ |
991 | "yaxis.min", | 1026 | "yaxis.min", |
992 | "yaxis.max", | 1027 | "yaxis.max", |
1028 | + "yaxis.tickDecimals", | ||
1029 | + "yaxis.tickSize", | ||
993 | "yaxis.showLabels", | 1030 | "yaxis.showLabels", |
994 | "yaxis.title", | 1031 | "yaxis.title", |
995 | "yaxis.titleAngle", | 1032 | "yaxis.titleAngle", |
@@ -1014,10 +1051,10 @@ export default class TbFlot { | @@ -1014,10 +1051,10 @@ export default class TbFlot { | ||
1014 | 1051 | ||
1015 | static datakeySettingsSchema(defaultShowLines) { | 1052 | static datakeySettingsSchema(defaultShowLines) { |
1016 | return { | 1053 | return { |
1017 | - "schema": { | 1054 | + "schema": { |
1018 | "type": "object", | 1055 | "type": "object", |
1019 | - "title": "DataKeySettings", | ||
1020 | - "properties": { | 1056 | + "title": "DataKeySettings", |
1057 | + "properties": { | ||
1021 | "showLines": { | 1058 | "showLines": { |
1022 | "title": "Show lines", | 1059 | "title": "Show lines", |
1023 | "type": "boolean", | 1060 | "type": "boolean", |
@@ -1063,6 +1100,11 @@ export default class TbFlot { | @@ -1063,6 +1100,11 @@ export default class TbFlot { | ||
1063 | "type": "number", | 1100 | "type": "number", |
1064 | "default": 0 | 1101 | "default": 0 |
1065 | }, | 1102 | }, |
1103 | + "axisTickSize": { | ||
1104 | + "title": "Axis step size between ticks", | ||
1105 | + "type": "number", | ||
1106 | + "default": null | ||
1107 | + }, | ||
1066 | "axisPosition": { | 1108 | "axisPosition": { |
1067 | "title": "Axis position", | 1109 | "title": "Axis position", |
1068 | "type": "string", | 1110 | "type": "string", |
@@ -1076,7 +1118,7 @@ export default class TbFlot { | @@ -1076,7 +1118,7 @@ export default class TbFlot { | ||
1076 | }, | 1118 | }, |
1077 | "required": ["showLines", "fillLines", "showPoints"] | 1119 | "required": ["showLines", "fillLines", "showPoints"] |
1078 | }, | 1120 | }, |
1079 | - "form": [ | 1121 | + "form": [ |
1080 | "showLines", | 1122 | "showLines", |
1081 | "fillLines", | 1123 | "fillLines", |
1082 | "showPoints", | 1124 | "showPoints", |
@@ -1089,6 +1131,7 @@ export default class TbFlot { | @@ -1089,6 +1131,7 @@ export default class TbFlot { | ||
1089 | "axisMax", | 1131 | "axisMax", |
1090 | "axisTitle", | 1132 | "axisTitle", |
1091 | "axisTickDecimals", | 1133 | "axisTickDecimals", |
1134 | + "axisTickSize", | ||
1092 | { | 1135 | { |
1093 | "key": "axisPosition", | 1136 | "key": "axisPosition", |
1094 | "type": "rc-select", | 1137 | "type": "rc-select", |
@@ -1405,4 +1448,4 @@ export default class TbFlot { | @@ -1405,4 +1448,4 @@ export default class TbFlot { | ||
1405 | } | 1448 | } |
1406 | } | 1449 | } |
1407 | 1450 | ||
1408 | -/* eslint-enable angular/angularelement */ | ||
1451 | +/* eslint-enable angular/angularelement */ |