feat: added truncateLegends options

src/js/charts/AxisChart.js

@@ -429,7 +429,8 @@ export default class AxisChart extends BaseChart {
 					'0',
 					barWidth,
 					this.colors[i],
-					d.name);
+					d.name,
+					this.config.truncateLegends);
 				this.legendArea.appendChild(rect);
 			});
 		}

src/js/charts/BaseChart.js

@@ -34,7 +34,8 @@ export default class BaseChart {
 			showTooltip: 1, // calculate
 			showLegend: 1, // calculate
 			isNavigable: options.isNavigable || 0,
-			animate: 1
+			animate: 1,
+			truncateLegends: options.truncateLegends || 0
 		};
 
 		this.measures = JSON.parse(JSON.stringify(BASE_MEASURES));

src/js/utils/draw-utils.js

@@ -24,3 +24,14 @@ export function equilizeNoOfElements(array1, array2,
 	}
 	return [array1, array2];
 }
+
+export function truncateString(txt, len) {
+	if (!txt) {
+		return;
+	}
+	if (txt.length > len) {
+		return txt.slice(0, len-3) + '...';
+	} else {
+		return txt;
+	}
+}

src/js/utils/draw.js

@@ -1,10 +1,11 @@
-import { getBarHeightAndYAttr } from './draw-utils';
+import { getBarHeightAndYAttr, truncateString } from './draw-utils';
 import { getStringWidth } from './helpers';
 import { DOT_OVERLAY_SIZE_INCR, PERCENTAGE_BAR_DEFAULT_DEPTH } from './constants';
 import { lightenDarkenColor } from './colors';
 
 export const AXIS_TICK_LENGTH = 6;
 const LABEL_MARGIN = 4;
+const LABEL_MAX_CHARS = 15;
 export const FONT_SIZE = 10;
 const BASE_LINE_COLOR = '#dadada';
 const FONT_FILL = '#555b51';
@@ -182,7 +183,9 @@ export function heatSquare(className, x, y, size, fill='none', data={}) {
 	return createSVG("rect", args);
 }
 
-export function legendBar(x, y, size, fill='none', label) {
+export function legendBar(x, y, size, fill='none', label, truncate=false) {
+	label = truncate ? truncateString(label, LABEL_MAX_CHARS) : label;
+
 	let args = {
 		className: 'legend-bar',
 		x: 0,