@forter/chart - npm Package Compare versions

Comparing version 5.20.1 to 5.20.2

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log
 
+## [5.20.2](https://github.com/forter/web-components/compare/@forter/chart@5.20.1...@forter/chart@5.20.2) (2022-07-28)
+
+**Note:** Version bump only for package @forter/chart
+
+
+
+
+
 ## [5.20.1](https://github.com/forter/web-components/compare/@forter/chart@5.20.0...@forter/chart@5.20.1) (2022-07-28)
@@ -8,0 +16,0 @@

chart-config-builders/time-axis-config-builder.js

@@ -95,3 +95,3 @@ import { merge } from 'lodash-es';
         // Hide the last tick if it's not a bar chart
-        return index === values.length - 1 && !isBarChart ? undefined : value;
+        return index === values.length - 1 && !isBarChart ? '' : value;
       }
@@ -98,0 +98,0 @@ },

chart-config-builders/tooltip-config-builder.js

@@ -11,7 +11,11 @@ import { html } from 'lit-element';
     previewMode
-  } = context; // eslint-disable-next-line prefer-destructuring
+  } = context;
+  const {
+    xAxisType,
+    series
+  } = config; // eslint-disable-next-line prefer-destructuring
 
   const {
     seriesType
-  } = config.series[0];
+  } = series[0];
   const isMissingDrilldown = config === null || config === void 0 ? void 0 : (_config$series = config.series) === null || _config$series === void 0 ? void 0 : _config$series.some(singleLine => !singleLine.hasDrillDown);
@@ -23,4 +27,3 @@ context.tooltipPosition = {
 
-  const external = // eslint-disable-next-line max-len
-  chartJSContext => tooltipCallback(chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType);
+  const external = chartJSContext => tooltipCallback(chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType);
 
@@ -39,3 +42,3 @@ const callbackObject = {
 
-const tooltipCallback = (chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType) => {
+const tooltipCallback = (chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType) => {
   const tooltipModel = chartJSContext.tooltip;
@@ -50,5 +53,24 @@
 
-  extractDataAndRenderTooltip(tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType);
+  extractDataAndRenderTooltip(tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType);
 };
 
+const getNextTick = ({
+  dataPoint,
+  xAxisType
+}) => {
+  var _chart$data$datasets$, _chart$data$datasets$2;
+
+  const {
+    chart,
+    raw
+  } = dataPoint;
+  const timeFieldAxisTypes = ['SINGLE_TIME_FIELD_SINGLE_NON_TIME_FIELD', 'SINGLE_TIME_FIELD'];
+  const indexOfCurrentTick = chart.data.datasets[0].data.map(e => e.x).indexOf(raw.x);
+  const nextTick = (_chart$data$datasets$ = chart.data.datasets[0]) === null || _chart$data$datasets$ === void 0 ? void 0 : (_chart$data$datasets$2 = _chart$data$datasets$.data[indexOfCurrentTick + 1]) === null || _chart$data$datasets$2 === void 0 ? void 0 : _chart$data$datasets$2.x;
+  return {
+    isTimeRange: timeFieldAxisTypes.includes(xAxisType) && nextTick,
+    nextTick
+  };
+};
+
 const isTreeMapSeries = seriesType => seriesType === 'TREEMAP';
@@ -77,8 +99,16 @@
 const extractNonTreeMapData = ({
-  dataPoint
+  dataPoint,
+  xAxisType
 }) => {
+  const {
+    isTimeRange,
+    nextTick
+  } = getNextTick({
+    dataPoint,
+    xAxisType
+  });
   return {
     tooltipMainInsight: get(dataPoint, 'raw.yFormatted'),
     mainInsightLabel: get(dataPoint, 'raw.aggregationLabel'),
-    tooltipPositionText: get(dataPoint, 'raw.x'),
+    tooltipPositionText: `${get(dataPoint, 'raw.x')} ${isTimeRange ? `- ${nextTick}` : ''}`,
     note: get(dataPoint, 'raw.note')
@@ -89,3 +119,3 @@ };
 
-const extractDataAndRenderTooltip = (tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType) => {
+const extractDataAndRenderTooltip = (tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType) => {
   const dataPoint = get(tooltipModel, 'dataPoints[0]');
@@ -103,3 +133,4 @@ const {
   }) : extractNonTreeMapData({
-    dataPoint
+    dataPoint,
+    xAxisType
   });
@@ -106,0 +137,0 @@ extractedData = {

package.json

 {
   "name": "@forter/chart",
-  "version": "5.20.1",
+  "version": "5.20.2",
   "description": "chart from Forter Components",
@@ -60,3 +60,3 @@ "author": "Forter Developers",
   },
-  "gitHead": "31aefc18517e94ddd69deb3ccd2c38db7c500e4f"
+  "gitHead": "934554bc35daed0333c5f825d2919cc0a558a85b"
 }

src/chart-config-builders/time-axis-config-builder.js

@@ -74,3 +74,3 @@ import { merge } from 'lodash-es';
         return (index === (values.length - 1) && !isBarChart)
-          ? undefined
+          ? ''
           : value;
@@ -77,0 +77,0 @@ },

src/chart-config-builders/tooltip-config-builder.js

@@ -6,17 +6,21 @@ import { get, merge } from 'lodash-es';
   const { tooltipElement, canvas, previewMode } = context;
+  const { xAxisType, series } = config;
   // eslint-disable-next-line prefer-destructuring
-  const { seriesType } = config.series[0];
+  const { seriesType } = series[0];
 
   const isMissingDrilldown = config?.series?.some(singleLine => !singleLine.hasDrillDown);
-  context.tooltipPosition = {
-    x: -999,
-    y: -999
-  };
+  context.tooltipPosition = { x: -999, y: -999 };
 
-  const external =
-      // eslint-disable-next-line max-len
-      chartJSContext => tooltipCallback(chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType);
-  const callbackObject =
-    { options: { plugins: { tooltip: { external } } } };
+  const external = chartJSContext => tooltipCallback(
+    chartJSContext,
+    tooltipElement,
+    canvas,
+    previewMode,
+    isMissingDrilldown,
+    seriesType,
+    xAxisType
+  );
 
+  const callbackObject = { options: { plugins: { tooltip: { external } } } };
+
   return merge(chartJSConfig, callbackObject);
@@ -27,3 +31,3 @@ };
 // eslint-disable-next-line max-len
-const tooltipCallback = (chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType) => {
+const tooltipCallback = (chartJSContext, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType) => {
   const tooltipModel = chartJSContext.tooltip;
@@ -38,5 +42,16 @@ if (tooltipModel.opacity === 0) {
   // eslint-disable-next-line max-len
-  extractDataAndRenderTooltip(tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType);
+  extractDataAndRenderTooltip(tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType);
 };
 
+const getNextTick = ({ dataPoint, xAxisType }) => {
+  const { chart, raw } = dataPoint;
+  const timeFieldAxisTypes = ['SINGLE_TIME_FIELD_SINGLE_NON_TIME_FIELD', 'SINGLE_TIME_FIELD'];
+  const indexOfCurrentTick = chart.data.datasets[0].data.map(e => e.x).indexOf(raw.x);
+  const nextTick = chart.data.datasets[0]?.data[indexOfCurrentTick + 1]?.x;
+  return {
+    isTimeRange: (timeFieldAxisTypes.includes(xAxisType) && nextTick),
+    nextTick
+  };
+};
+
 const isTreeMapSeries = seriesType => seriesType === 'TREEMAP';
@@ -57,7 +72,8 @@
 
-const extractNonTreeMapData = ({ dataPoint }) => {
+const extractNonTreeMapData = ({ dataPoint, xAxisType }) => {
+  const { isTimeRange, nextTick } = getNextTick({ dataPoint, xAxisType });
   return {
     tooltipMainInsight: get(dataPoint, 'raw.yFormatted'),
     mainInsightLabel: get(dataPoint, 'raw.aggregationLabel'),
-    tooltipPositionText: get(dataPoint, 'raw.x'),
+    tooltipPositionText: `${get(dataPoint, 'raw.x')} ${isTimeRange ? `- ${nextTick}` : ''}`,
     note: get(dataPoint, 'raw.note'),
@@ -68,3 +84,3 @@ };
 // eslint-disable-next-line max-len
-const extractDataAndRenderTooltip = (tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType) => {
+const extractDataAndRenderTooltip = (tooltipModel, tooltipElement, canvas, previewMode, isMissingDrilldown, seriesType, xAxisType) => {
   const dataPoint = get(tooltipModel, 'dataPoints[0]');
@@ -80,3 +96,3 @@ const { offsetLeft: positionX, offsetTop: positionY } = canvas;
   // eslint-disable-next-line max-len
-  let extractedData = isTreeMapSeries(seriesType) ? extractTreeMapData({ dataPoint }) : extractNonTreeMapData({ dataPoint });
+  let extractedData = isTreeMapSeries(seriesType) ? extractTreeMapData({ dataPoint }) : extractNonTreeMapData({ dataPoint, xAxisType });
   extractedData = { previewMode, isMissingDrilldown, ...extractedData };
@@ -83,0 +99,0 @@ tooltipElement.innerHTML = renderTooltip(extractedData);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

241214

increased by1.38%

Lines of code

4015

increased by1.08%

No dependency changes