Merge pull request SORMAS-Foundation#3088 from hzi-braunschweig/feature-3065-StackLabelRotation

SORMAS-Foundation#3065 - rotate stack label's when there is more than 1 stack defined

Author: BarnaBartha

sormas-ui/src/main/java/de/symeda/sormas/ui/dashboard/campaigns/CampaignDashboardDiagramComponent.java

@@ -1,14 +1,5 @@
 package de.symeda.sormas.ui.dashboard.campaigns;
 
-import com.vaadin.ui.VerticalLayout;
-import de.symeda.sormas.api.campaign.diagram.CampaignDiagramDataDto;
-import de.symeda.sormas.api.campaign.diagram.CampaignDiagramDefinitionDto;
-import de.symeda.sormas.api.campaign.diagram.CampaignDiagramSeries;
-import de.symeda.sormas.api.i18n.Captions;
-import de.symeda.sormas.api.i18n.I18nProperties;
-import de.symeda.sormas.ui.highcharts.HighChart;
-import org.apache.commons.text.StringEscapeUtils;
-
 import java.math.BigDecimal;
 import java.math.RoundingMode;
 import java.util.ArrayList;
@@ -20,6 +11,17 @@
 import java.util.function.Function;
 import java.util.stream.Collectors;
 
+import org.apache.commons.text.StringEscapeUtils;
+
+import com.vaadin.ui.VerticalLayout;
+
+import de.symeda.sormas.api.campaign.diagram.CampaignDiagramDataDto;
+import de.symeda.sormas.api.campaign.diagram.CampaignDiagramDefinitionDto;
+import de.symeda.sormas.api.campaign.diagram.CampaignDiagramSeries;
+import de.symeda.sormas.api.i18n.Captions;
+import de.symeda.sormas.api.i18n.I18nProperties;
+import de.symeda.sormas.ui.highcharts.HighChart;
+
 @SuppressWarnings("serial")
 public class CampaignDashboardDiagramComponent extends VerticalLayout {
 
@@ -105,19 +107,20 @@ public void buildDiagramChart(String title) {
 				", menuItems: ['viewFullscreen', 'printChart', 'separator', 'downloadPNG', 'downloadJPEG', 'downloadPDF', 'downloadSVG', 'separator', 'downloadCSV', 'downloadXLS', 'viewData', 'separator', 'togglePercentages']");
 		}
 
-		//@formatter:off
-		hcjs.append("} } },"
-				+ "legend: { backgroundColor: 'transparent', margin: 30 },"
-				+ "colors: ['#4472C4', '#ED7D31', '#A5A5A5', '#FFC000', '#5B9BD5', '#70AD47', '#FF0000', '#6691C4','#ffba08','#519e8a','#ed254e','#39a0ed','#FF8C00','#344055','#D36135','#82d173'],"
-				+ "title:{ text: '" + StringEscapeUtils.escapeEcmaScript(title) + "', style: { fontSize: '15px' } },");
-		//@formatter:on
-
 		Map<String, Long> stackMap = diagramDefinition.getCampaignDiagramSeries()
 			.stream()
 			.filter(campaignDiagramSeries -> campaignDiagramSeries.getStack() != null)
 			.map(CampaignDiagramSeries::getStack)
 			.collect(Collectors.groupingBy(Function.identity(), Collectors.counting()));
 
+		//@formatter:off
+		final int legendMargin = stackMap.size() > 1 ? 60 : 30;
+		hcjs.append("} } }," 
+				+ "legend: { backgroundColor: 'transparent', margin: " + legendMargin + " },"
+				+ "colors: ['#4472C4', '#ED7D31', '#A5A5A5', '#FFC000', '#5B9BD5', '#70AD47', '#FF0000', '#6691C4','#ffba08','#519e8a','#ed254e','#39a0ed','#FF8C00','#344055','#D36135','#82d173'],"
+				+ "title:{ text: '" + StringEscapeUtils.escapeEcmaScript(title) + "', style: { fontSize: '15px' } },");
+		//@formatter:on
+
 		hcjs.append("xAxis: {");
 		if (stackMap.size() > 1) {
 			hcjs.append("opposite: true,");
@@ -135,7 +138,7 @@ public void buildDiagramChart(String title) {
 		}
 		if (stackMap.size() > 1) {
 			hcjs.append(
-					", stackLabels: {enabled: true,verticalAlign: 'bottom',crop: false,overflow: 'none',y: 20,formatter: function() {  return this.stack;},style: {  color: 'grey'}}");
+					", stackLabels: {enabled: true,verticalAlign: 'bottom',crop: false, rotation: 45, x:20,y: 20, overflow: 'none',y: 20,formatter: function() {  return this.stack;},style: {  color: 'grey'}}");
 		}
 		hcjs.append("},");
 		//@formatter:on