Untitled

 avatar
unknown
plain_text
2 months ago
3.2 kB
5
Indexable
//Start Barchart Value Color Script
widget.on('domready', function (widget, args) {
    const consolelog = false;
    if (consolelog) { console.log(widget); }
	
    var largestBarHeight = 0;
	var point = $('.highcharts-series-group', element).find(".highcharts-point");
	point.each(function(index, element) {
    var barHeight = point[index].height.baseVal.value;
    if (barHeight > largestBarHeight) {
        largestBarHeight = barHeight;
    }
	});


    function setFontColor(index, element) {
        if (typeof point[index].height != 'undefined') {
            var barHeight = point[index].height.baseVal.value;
			
            
			var value = $(element).find("tspan").text()
		
			
			var valueLength = value.length;
			
			
			var isNegative = value.includes("-")
			
			var defaultColor = getComputedStyle(element).getPropertyValue("color");
			
		
            var labelPosition = element.parentElement.transform.baseVal[0].matrix.e;
			
			var difference = labelPosition - barHeight
			
			var totalHeight = barHeight + largestBarHeight
			
			if (!isNegative && barHeight < labelPosition) {
				barHeight = barHeight + difference + 1
			} 
            
		
			
			
			if (consolelog) { console.log(index); }
            if (consolelog) { console.log(barHeight, "is the bar Height"); }
            if (consolelog) { console.log(element.parentElement.transform.baseVal[0].matrix.e, "is the label position"); }
			if (consolelog) { console.log(largestBarHeight, "is the largest bar height"); }
			if (consolelog) { console.log(valueLength, "is the value length"); }
			if (consolelog) { console.log(defaultColor, "is the default color"); }
			if (consolelog) { console.log(difference, "difference"); }
			
            if (!isNegative) {
                // if the bar height is greater than the label position AND the bar height is equal to the largest bar height + the difference between the label position and the bar height + 1, than it paints as white.
                if (barHeight  > labelPosition && barHeight === largestBarHeight + difference + 1) {
					if (consolelog) { console.log(barHeight, "is not the largest bar"); }
					
                    element.style.fill = "#FFFFFF"; // white color
                }  else if (barHeight  > labelPosition && difference <= 0) {
					
					element.style.fill = "#FFFFFF"; // white color
				} 
				  else if (value === "$0"){
				
					element.style.fill = defaultColor;
				} else if (barHeight < valueLength ) {
				
					element.style.fill = defaultColor;
				} 
					
            }
			
			else if (isNegative) {
            // if the labelPostion is equal to 0, it should be incremented to go right and inside the bar
            if (labelPosition === 0 && barHeight === largestBarHeight) {
                element.parentElement.transform.baseVal[0].matrix.e += valueLength;
				element.style.fill = "#FFFFFF"; // white color
				
            }
			}
			
        } else {
            if (consolelog) { console.log(" Undefined " + index); }
        }
    }
    var labels = $('.highcharts-data-labels', element).find(".highcharts-label").children();
    if (consolelog) { console.log(labels); }
    labels.each(setFontColor);
});

//End Barchart Value Color Script












Editor is loading...
Leave a Comment