diff --git a/Modules/Chart/include/QmitkChartData.h b/Modules/Chart/include/QmitkChartData.h
index bd624c2502..654b424727 100644
--- a/Modules/Chart/include/QmitkChartData.h
+++ b/Modules/Chart/include/QmitkChartData.h
@@ -1,114 +1,124 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 
 #ifndef QmitkC3Data_h
 #define QmitkC3Data_h
 
 #include <QmitkChartWidget.h>
 #include <QVariant>
 
 /** \brief This class holds the relevant properties for the chart generation with C3 such as labels and diagram type.
 * It is derived from QObject, because we need Q_PROPERTIES to send Data via QWebChannel to JavaScript.
 * \sa The actual data for the chart generation is in QmitkC3xyData!
 */
 class QmitkChartData : public QObject
 {
   Q_OBJECT
 
   Q_PROPERTY(QVariant m_xAxisLabel READ GetXAxisLabel WRITE SetXAxisLabel NOTIFY SignalXAxisLabelChanged);
   Q_PROPERTY(QVariant m_yAxisLabel READ GetYAxisLabel WRITE SetYAxisLabel NOTIFY SignalYAxisLabelChanged);
   Q_PROPERTY(QVariant m_chartTitle READ GetTitle WRITE SetTitle NOTIFY SignalTitleChanged);
+  Q_PROPERTY(QVariant m_themeName READ GetThemeName WRITE SetThemeName NOTIFY SignalThemeNameChanged);
   Q_PROPERTY(QVariant m_LegendPosition READ GetLegendPosition WRITE SetLegendPosition NOTIFY SignalLegendPositionChanged);
   Q_PROPERTY(QVariant m_ShowLegend READ GetShowLegend WRITE SetShowLegend NOTIFY SignalShowLegendChanged);
   Q_PROPERTY(QVariant m_ShowErrorBars READ GetShowErrorBars WRITE SetShowErrorBars NOTIFY SignalShowErrorBarsChanged);
   Q_PROPERTY(QVariant m_YAxisScale READ GetYAxisScale WRITE SetYAxisScale NOTIFY SignalYAxisScaleChanged);
   Q_PROPERTY(QVariant m_ShowSubchart READ GetShowSubchart WRITE SetShowSubchart NOTIFY SignalShowSubchartChanged);
   Q_PROPERTY(QVariant m_UsePercentageInPieChart READ GetUsePercentageInPieChart WRITE SetUsePercentageInPieChart NOTIFY SignalUsePercentageInPieChartChanged);
   Q_PROPERTY(QVariant m_DataPointSize READ GetDataPointSize WRITE SetDataPointSize NOTIFY SignalDataPointSizeChanged);
   Q_PROPERTY(QVariant m_StackedData READ GetStackedData WRITE SetStackedData NOTIFY SignalStackedDataChanged);
 
 public:
   QmitkChartData();
 
   void SetAppearance(bool showSubChart = true, bool usePercentageInPieChart = false);
 
   Q_INVOKABLE QVariant GetXAxisLabel() const { return m_xAxisLabel; };
   Q_INVOKABLE void SetXAxisLabel(const QVariant& label) { m_xAxisLabel = label; emit SignalXAxisLabelChanged(label); };
 
   Q_INVOKABLE QVariant GetYAxisLabel() const { return m_yAxisLabel; };
   Q_INVOKABLE void SetYAxisLabel(const QVariant& label) { m_yAxisLabel = label; emit SignalYAxisLabelChanged(label); };
 
   Q_INVOKABLE QVariant GetTitle() const { return m_chartTitle; };
   Q_INVOKABLE void SetTitle(const QVariant& title) { m_chartTitle = title; emit SignalTitleChanged(title); };
 
+  Q_INVOKABLE QVariant GetThemeName() const { return m_themeName; };
+  Q_INVOKABLE void SetThemeName(const QVariant &themeName)
+  {
+    m_themeName = themeName;
+    emit SignalThemeNameChanged(themeName);
+  };
+
   Q_INVOKABLE QVariant GetLegendPosition() const { return m_LegendPosition; };
   Q_INVOKABLE void SetLegendPosition(const QVariant& legendPosition) { m_LegendPosition = legendPosition; emit SignalLegendPositionChanged(legendPosition); };
 
   Q_INVOKABLE QVariant GetShowLegend() const { return m_ShowLegend; };
   Q_INVOKABLE void SetShowLegend(const QVariant& show) { m_ShowLegend = show; emit SignalShowLegendChanged(show); };
 
   Q_INVOKABLE QVariant GetShowErrorBars() const { return m_ShowErrorBars; };
   Q_INVOKABLE void SetShowErrorBars(const QVariant &show)
   {
     m_ShowErrorBars = show;
     emit SignalShowErrorBarsChanged(show);
   };
 
   Q_INVOKABLE QVariant GetYAxisScale() const { return m_YAxisScale; };
   Q_INVOKABLE void SetYAxisScale(const QVariant& YAxisScale) { m_YAxisScale = YAxisScale; emit SignalYAxisScaleChanged(YAxisScale); };
 
   Q_INVOKABLE QVariant GetShowSubchart() const { return m_ShowSubchart; };
   Q_INVOKABLE void SetShowSubchart(const QVariant& showSubchart) { m_ShowSubchart = showSubchart; emit SignalShowSubchartChanged(showSubchart); };
 
   Q_INVOKABLE QVariant GetUsePercentageInPieChart() const { return m_UsePercentageInPieChart; };
   Q_INVOKABLE void SetUsePercentageInPieChart(const QVariant& usePercentageInPieChart) { m_UsePercentageInPieChart = usePercentageInPieChart; emit SignalUsePercentageInPieChartChanged(usePercentageInPieChart); };
 
   Q_INVOKABLE QVariant GetDataPointSize() const { return m_DataPointSize; };
   Q_INVOKABLE void SetDataPointSize(const QVariant& showDataPoints) { if (showDataPoints > 0) { m_DataPointSize = 3; } else { m_DataPointSize = 0; } emit SignalDataPointSizeChanged(showDataPoints); };
 
   Q_INVOKABLE QVariant GetStackedData() const { return m_StackedData; };
   Q_INVOKABLE void SetStackedData(const QVariant& stackedData) { m_StackedData = stackedData; emit SignalStackedDataChanged(m_StackedData); };
 
 signals:
   void SignalYAxisLabelChanged(const QVariant label);
   void SignalXAxisLabelChanged(const QVariant label);
   void SignalLegendPositionChanged(const QVariant legendPosition);
   void SignalShowLegendChanged(const QVariant show);
   void SignalShowErrorBarsChanged(const QVariant show);
   void SignalYAxisScaleChanged(const QVariant YAxisScale);
   void SignalTitleChanged(const QVariant title);
+  void SignalThemeNameChanged(const QVariant themeName);
   void SignalShowSubchartChanged(const QVariant showSubchart);
   void SignalUsePercentageInPieChartChanged(const QVariant usePercentageInPieChart);
   void SignalDataPointSizeChanged(const QVariant showDataPoints);
   void SignalStackedDataChanged(const QVariant stackedData);
 
 private:
   QVariant m_xAxisLabel;
   QVariant m_yAxisLabel;
   QVariant m_chartTitle;
+  QVariant m_themeName = "dark";
 
   QVariant m_ShowLegend = true;
   QVariant m_ShowErrorBars;
   QVariant m_LegendPosition = "topRight";
   QVariant m_ShowSubchart;
   QVariant m_YAxisScale;
   QVariant m_UsePercentageInPieChart;
   QVariant m_numberDatasets;
   QVariant m_DataPointSize = 0;
   QVariant m_StackedData;
 };
 
 #endif  //QmitkC3Data_h
diff --git a/Modules/Chart/include/QmitkChartWidget.h b/Modules/Chart/include/QmitkChartWidget.h
index b62c8b0737..02342cc921 100644
--- a/Modules/Chart/include/QmitkChartWidget.h
+++ b/Modules/Chart/include/QmitkChartWidget.h
@@ -1,253 +1,254 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 #ifndef QmitkC3jsWidget_h
 #define QmitkC3jsWidget_h
 
 #include <map>
 #include <memory>
 #include <QWidget>
 
 #include <MitkChartExports.h>
 
 /*!
 \brief QmitkChartWidget is a widget to display various charts based on the javascript chart library C3js.
 * \details Data is added via AddData1D() or AddData2D().\n
 * There can be multiple charts (of different types with different properties) created by calling AddData1D or AddData2D multiple times.\n\n
 * The following chart types are supported:
 * * line chart: http://c3js.org/samples/simple_multiple.html
 * * bar chart: http://c3js.org/samples/chart_bar.html
 * * spline chart: http://c3js.org/samples/chart_spline.html
 * * pie chart: http://c3js.org/samples/chart_pie.html
 * * scatter chart: http://c3js.org/samples/chart_scatter.html
 * * area chart: http://c3js.org/samples/chart_area.html
 * * area spline chart: http://c3js.org/samples/chart_area.html
 *
 * Technical details: The javascript code is embedded in a QWebEngineView. The actual js code is implemented in resource\Chart.js.
 * \sa http://c3js.org for further information about the used javaScript library.
 * \ingroup Modules/Chart
 */
 class MITKCHART_EXPORT QmitkChartWidget : public QWidget
 {
   Q_OBJECT
 
 public:
   /*!
   * \brief enum of diagram types.
   */
   enum class ChartType {
     bar, /*!< bar chart, see http://c3js.org/samples/chart_bar.html */
     line, /*!< line chart, see http://c3js.org/samples/simple_multiple.html */
     spline, /*!< spline chart (smoothed line chart), see http://c3js.org/samples/chart_spline.html */
     pie, /*!< pie chart, see http://c3js.org/samples/chart_pie.html*/
     area, /*!< area chart, see http://c3js.org/samples/chart_area.html*/
     area_spline, /*!< area-spline chart, see http://c3js.org/samples/chart_area.html*/
     scatter /*!< scatter chart, see http://c3js.org/samples/chart_scatter.html*/
   };
   /*!
   * \brief enum of chart style (modifies background and line color).
   */
   enum class ChartStyle {
     darkstyle, /*!< background color: dark gray, line color: blue */
     lightstyle /*!< background color: white, line color: blue */
   };
   enum class LineStyle {
     solid,
     dashed
   };
   enum class AxisScale {
     linear,
     log
   };
 
   /*!
   * \brief enum of legend position.
   * See http://c3js.org/reference.html#legend-position
   */
   enum class LegendPosition {
     bottomMiddle,
     bottomRight,
     topRight,
     topLeft,
     middleRight
   };
 
   explicit QmitkChartWidget(QWidget* parent = nullptr);
   //for UnitTests
   explicit QmitkChartWidget(QWidget *parent, bool unitTest);
   ~QmitkChartWidget() override;
 
   /*!
   * \brief Adds 1D data to the widget
   * \details internally, the list is converted to a map with increasing integers keys starting at 0.
   * \param label the name of the data that is also used as identifier.
   * \param chartType the chart type that should be used for this data entry
   * \note the data can be cleared with ClearDiagram()
   * \note If the label name already exists, the name is replaced with a unique one by concatenating numbers to it.
   * \warning Pie chart is significantly different than the other chart types. Here, the data given by AddData1D is summed. Each entry represents a different category.
   */
   void AddData1D(const std::vector<double>& data1D, const std::string& label, ChartType chartType = ChartType::bar);
 
   /*!
   * \brief Adds 2D data to the widget. Call repeatedly for displaying multiple charts.
   * \details each entry represents a data point: key: value --> x-value: y-value.
   * \param label the name of the data that is also used as identifier.
   * \param chartType the chart type that should be used for this data entry
   * \note the data can be cleared with ClearDiagram()
   * \note If the label name already exists, the name is replaced with a unique one by concatenating numbers to it.
   * \warning Pie chart is significantly different than the other chart types. Here, the data given by AddData1D is summed. Each entry represents a different category.
   */
   void AddData2D(const std::map<double, double> &data2D,
                  const std::string &label,
                  ChartType chartType = ChartType::bar);
 
   /*!
   * \brief Removes data from the widget, works for 1D and 2D Data
   * \param label the name of the data that is also used as identifier.
   * \note All data can be cleared with ClearDiagram()
   * \throws Invalid Argument Exception when the label cannot be found
   */
   void RemoveData(const std::string& label);
 
   /*!
   * \brief Sets the color of one data entry (identifier is previously assigned label)
   * \details the color name can be "red" or a hex number (#FF0000).
   * \warning Either define all data entries with a color or no data entry. If a mixed approach is used,
   * C3 choses the color of the data entry (that could be the same as a user defined color).
   * \note If an unknown label is given, nothing happens.
   *  \sa https://www.w3schools.com/cssref/css_colors.asp
   */
   void SetColor(const std::string& label, const std::string& colorName);
 
   /*!
   * \brief Sets the line style of one data entry (identifier is previously assigned label)
   * \details two line styles are possible: LineStyle::solid and LineStyle::dashed.
   * The default line style is solid.
   * \note If an unknown label is given, nothing happens.
   *  \warning only sets the line style if the current chart type is ChartType::line.
   *  However, the line style remains also if the chart changes (e.g. new chart type)
   */
   void SetLineStyle(const std::string& label, LineStyle style);
 
   /*!
   * \brief Sets the axis scale to either linear (default) or logarithmic.
   */
   void SetYAxisScale(AxisScale scale);
 
   void SetXAxisLabel(const std::string& label);
 
   void SetYAxisLabel(const std::string& label);
   /*!
   * \brief Sets a title for the chart.
   */
   void SetTitle(const std::string &title);
 
   /*!
   * \brief Changes the chart type for all data entries and reloads the chart
   */
   void SetChartTypeForAllDataAndReload(ChartType type);
   /*!
   * \brief Sets the chart type for a data entry
   * \details for available types, see ChartType
   * \note If an unknown label is given, nothing happens.
   * \warning Pie chart is significantly different than the other chart types. Here, the data given by AddData1D is summed. Each entry represents a different category.
   * \sa DiagramType for available types
   */
   void SetChartType(const std::string& label, ChartType type);
 
   void SetErrorBars(const std::string &label, const std::vector<double> &errorPlus, const std::vector<double>& errorMinus = std::vector<double>());
 
   /*!
   * \brief Sets the legend position.
   * \details Default position is bottom.
   * \sa LegendPosition for available types
   */
   void SetLegendPosition(LegendPosition position);
 
   void SetShowLegend(bool show);
 
   void SetStackedData(bool stacked);
 
   /*!
   * \brief Displays the chart in the widget
   * \param showSubChart if a subchart is displayed inside the widget or not (see http://c3js.org/samples/options_subchart.html).
   * \exception if no data has been provided (\sa AddData1D AddData2D)
   */
   void Show(bool showSubChart=false);
 
   /*!
   * \brief Either displays the dataPoints or not
   * \param showDataPoints if dataPoints are displayed inside the widget or not.
   * \details: example for not showing points: http://c3js.org/samples/point_show.html
   * example for showing the points: http://c3js.org/samples/simple_multiple.html
   */
   void SetShowDataPoints(bool showDataPoints);
 
   /*!
   * \brief Clears all data inside and resets the widget.
   */
   void Clear();
 
   /*!
-  * \brief Changes the theme of the widget.
+  * \brief Sets the theme of the widget.
   */
   void SetTheme(ChartStyle themeEnabled);
 
   /*!
   * \brief Sets whether the subchart shall be shown.
   * \details Changes the state of the current chart object. Needs to be reloaded with Reload() to display changes.
   * \param showSubChart if a subchart is displayed inside the widget or not.
   */
   void SetShowSubchart(bool showSubChart);
 
   /*!
    * \brief Sets whether the error bars shall be shown.
    * \details Changes the state of the current chart object. Needs to be reloaded with Reload() to display changes.
    * \param showErrorBars if error bars are displayed or not.
    */
   void SetShowErrorBars(bool showErrorBars);
 
   /*!
    * \brief Reloads the chart in the widget
    * \details reloading may be needed to display added data in an existing chart
    */
   void Reload();
 
   QSize sizeHint() const override;
 
 public slots:
   void OnLoadFinished(bool isLoadSuccessful);
+  void OnPageSuccessfullyLoaded();
 
 signals:
   void PageSuccessfullyLoaded();
 
 private:
 
   QString convertBooleanValue(bool value) {
     if (value)
     {
       return "true";
     }
     else
     {
       return "false";
     }
   }
 
   class Impl;
   std::unique_ptr<Impl> m_Impl;
 };
 
 #endif
diff --git a/Modules/Chart/resource/Chart.js b/Modules/Chart/resource/Chart.js
index 9d27f0ac1a..12122ab823 100644
--- a/Modules/Chart/resource/Chart.js
+++ b/Modules/Chart/resource/Chart.js
@@ -1,291 +1,320 @@
 document.body.style.backgroundColor = 'rgb(240, 240, 240)';
 
 const minHeight = 255;
 var chart;
 
 var chartData;
 var errorValuesPlus=[];
 var errorValuesMinus=[];
 var xValues=[];
 var yValues=[];
 var dataLabels=[];
 var xs = {};
 
 var dataColors = {};
 var chartTypes = {};
 var lineStyle = {};
+var backgroundColor = '#f0f0f0';
+var foregroundColor = 'black';
 
 var dataProperties = {};
 
 // Important loading function. This will be executed at first in this whole script.
 // Fetching data from QWebChannel and storing them for display purposes.
 window.onload = function()
 {
   initHeight();
 
   new QWebChannel(qt.webChannelTransport, function(channel) {
     chartData = channel.objects.chartData;
 
     let count = 0;
     for(let propertyName in channel.objects) {
     if (propertyName != 'chartData')
     {
         let xDataTemp = channel.objects[propertyName].m_XData;
         let yDataTemp = channel.objects[propertyName].m_YData;
 	      let errorsTempPlus = channel.objects[propertyName].m_ErrorDataPlus;
 		  let errorsTempMinus = channel.objects[propertyName].m_ErrorDataMinus;
         let dataLabel = channel.objects[propertyName].m_Label;
         dataLabels.push(dataLabel);
 
         console.log("loading datalabel: "+dataLabel);
 
         //add label to x array
         xDataTemp.unshift('x'+count.toString())
         xs[dataLabel] = 'x' + count.toString()
 
         xDataTemp.push(null); //append null value, to make sure the last tick on x-axis is displayed correctly
         yDataTemp.unshift(dataLabel)
         yDataTemp.push(null); //append null value, to make sure the last tick on y-axis is displayed correctly
 
         xValues[count] = xDataTemp
         yValues[count] = yDataTemp
         errorValuesPlus[count] = errorsTempPlus;
 		errorValuesMinus[count] = errorsTempMinus;
 		
 
         let tempLineStyle = '';
 
         if (channel.objects[propertyName].m_LineStyleName == "solid")
   			{
   			  tempLineStyle = ''
   			}
   			else
   			{
   			  tempLineStyle = { 'style': 'dashed' }
   			}
 
         dataProperties[dataLabel] = {
             "color" : channel.objects[propertyName].m_Color,
             "chartType": channel.objects[propertyName].m_ChartType,
             "style": tempLineStyle
         }
 
   			count++;
   		}
   	}
-
+	var theme = chartData.m_themeName;
+	setThemeColors(theme);
     generateChart(chartData);
-
   });
 }
 
 /**
  * Inits the height of the chart element to 90% of the full window height.
  */
 function initHeight() {
   var size = window.innerHeight-(window.innerHeight/100*10); //subtract 10% of height to hide vertical scrool bar
   let chart = document.getElementById("chart");
   chart.style.height = `${size}px`;
 }
 
 function getPlotlyChartType(inputType){
   let plotlyType = "";
   if (inputType == "line"){
     plotlyType = "scatter";
   } else if (inputType == "bar"){
     plotlyType = "bar";
   }
   return plotlyType;
 }
 
 /**
  * Generate error bars object
  *
  * @param {array} errors - contains error bar values
  * @return error bar object
  */
 function generateErrorBars(errors, visible){
 	let errorObject = {
 	  type: 'data',
 	  array: errors,
 	  visible: visible
 	}
 
 	return errorObject;
 }
 
 function generateErrorBarsAsymmetric(errorsPlus, errorsMinus, visible){
 	let errorObject = generateErrorBars(errorsPlus, visible);
 	errorObject["arrayminus"] = errorsMinus;
 	errorObject["symmetric"] = false;
 	
 	return errorObject;
 }
 
 function generateLineOptions(options){
   return {
     color : options.color
   }
 }
 
 /**
  * Here, the chart magic takes place. Plot.ly is called.
  *
  * @param {object} chartData - containing the options for plotting, not the actual values
  */
 function generateChart(chartData)
 {
   console.log("generate chart");
 	if (chartData == undefined)
 	{
 		chartData = {}
 	}
 
 	if (dataLabels == undefined)
 	{
     dataLabels = []
 	}
 
   //=============================== DATA ========================
   let data = [];
 
   for (let index = 0; index < dataLabels.length; index++){
 
     let inputType = dataProperties[dataLabels[index]]["chartType"];
     let chartType = getPlotlyChartType(inputType);
 
     let trace = {
       x: xValues[index].slice(1),
       y: yValues[index].slice(1),
       type: chartType,
       name: dataLabels[index]
     };
 
 	  if(typeof errorValuesPlus[index] !== 'undefined'){
 		  if(typeof errorValuesMinus[index] !== 'undefined' && errorValuesMinus[index].length > 0)
 		  {
 			trace["error_y"] = generateErrorBarsAsymmetric(errorValuesPlus[index], errorValuesMinus[index], chartData.m_ShowErrorBars);
 		  }else{
 			trace["error_y"] = generateErrorBars(errorValuesPlus[index], chartData.m_ShowErrorBars);
 		  }
 	  }
 
     if (dataProperties[dataLabels[index]]["style"] == "dashed"){
       trace["line"]["dash"] = "dot"
     }
 
     // ===================== CHART TYPE OPTIONS HANDLING ===========
     if (chartType == "scatter"){
       trace["line"] = generateLineOptions(dataProperties[dataLabels][index]["color"])
     }
 
     data.push(trace)
   }
 
   //=============================== STYLE ========================
-  let marginTop = chartData.m_diagramTitle == undefined ? 10 : 50;
+  let marginTop = chartData.m_chartTitle == undefined ? 10 : 50;
 
   if (chartData.m_LegendPosition == "bottomMiddle"){
 	  var legendX = 0.5;
 	  var legendY = -0.75;
   }
   else if (chartData.m_LegendPosition == "bottomRight"){
 	  var legendX = 1;
 	  var legendY = 0;
   }
   else if (chartData.m_LegendPosition == "topRight"){
 	  var legendX = 1;
 	  var legendY = 1;
   }
   else if (chartData.m_LegendPosition == "topLeft"){
 	  var legendX = 0;
 	  var legendY = 1;
   }
   else if (chartData.m_LegendPosition == "middleRight"){
 	  var legendX = 1;
 	  var legendY = 0.5;
   }
   var layout = {
-    title: chartData.m_diagramTitle,
+	  paper_bgcolor : backgroundColor,
+	  plot_bgcolor : backgroundColor,
+    title:chartData.m_chartTitle,
+	titlefont: {
+		color:foregroundColor
+	},
     xaxis: {
-      title: chartData.m_xAxisLabel
+      title: chartData.m_xAxisLabel,
+	  color: foregroundColor
     },
     yaxis: {
-      title: chartData.m_yAxisLabel
+      title: chartData.m_yAxisLabel,
+	  color: foregroundColor
     },
     margin: {
       l: 50,
       r: 10,
       b: 50,
       t: marginTop,
       pad: 4
     },
 	showlegend: chartData.m_ShowLegend,
 	legend: {
 		x: legendX,
-		y: legendY
+		y: legendY,
+		font : {
+			color: foregroundColor
+		}
 	}
   };
 
   if (chartData.m_YAxisScale){
       layout.yaxis["type"] = "log"
   }
 
   if (chartData.m_ShowSubchart){
     layout.xaxis.rangeslider = {}; // adds range slider below x axis
   }
 
   Plotly.newPlot('chart', data, layout, {displayModeBar: false, responsive: true});
 }
 
 /**
  * Change theme of chart.
  *
  * @param {string} color - dark or not dark
  */
 function changeTheme(color) {
+	setThemeColors(color);
 link = document.getElementsByTagName("link")[0];
   if (color == 'dark') {
     link.href = "Chart_dark.css";
   }
   else
   {
     link.href = "Chart.css";
   }
 };
 
+/**
+ * Reload the chart with the given arguments.
+ *
+ * This method is called by C++. Changes on signature with caution.
+ */
 function Reload(){
   console.log("Reload chart");
   generateChart(chartData);
 }
 
 function SetShowSubchart(showSubchart)
 {
-  chartData.m_ShowSubchart = showSubchart;
+    chartData.m_ShowSubchart = showSubchart;
+}
+
+function setThemeColors(theme){
+	if (theme == 'dark'){
+		backgroundColor = '#2d2d30';
+		foregroundColor = 'white';
+	}
+	else {
+		backgroundColor = '#f0f0f0';
+		foregroundColor = 'black';
+	}
 }
 
 function SetStackDataString(stackDataString)
 {
   chartData.m_StackedData = stackDataString;
 }
 
 function SetShowErrorBars(showErrorBars)
 {
   chartData.m_ShowErrorBars = showErrorBars;
 }
 /**
  * Transforms the view to another chart type.
  *
  * This method is called by C++. Changes on signature with caution.
  * @param {string} transformTo - 'line' or 'bar'
  */
 function transformView(transformTo) {
   console.log("transform view");
   console.log(transformTo);
 
   dataProperties[dataLabels[0]]["chartType"] = transformTo; // preserve chartType for later updates
   let plotlyType = getPlotlyChartType(transformTo);
   let chart = document.getElementById("chart");
   let update = {type : plotlyType}
   Plotly.restyle(chart, update, 0); // updates the given plotly trace at index 0 with an update object built of a standard trace object
 };
diff --git a/Modules/Chart/resource/Chart_dark.css b/Modules/Chart/resource/Chart_dark.css
index 0a853aa57e..2ed85596bc 100644
--- a/Modules/Chart/resource/Chart_dark.css
+++ b/Modules/Chart/resource/Chart_dark.css
@@ -1,46 +1,3 @@
 body {
-    background-color: #323231 !important;
-}
-
-/*-- Bar --*/
-.c3-bar {
-  fill-opacity: 1; 
-  }
-  
-.c3-bar._expanded_ {
-  fill: red !important; /*-- The !important tag prevents the color from being overwritten at rendering--*/
-  fill-opacity: 1; 
-}
-
-/*-- Line --*/
-.c3-line {
-  stroke-width: 1px;
-  stroke: #ADB1B6;
-  /*stroke-dasharray: 5,5; /*to make it dashed*/
-}
-
-/*-- Point --*/
-.c3-circle._expanded_ {
-  stroke-width: 1px;
-  stroke: red !important;
-  fill: red !important; /*-- The !important tag prevents the color from being overwritten at rendering--*/}
-
-path.domain { stroke: #ADB1B6 !important; }
-.c3 .c3-axis-x path, .c3 .c3-axis-x line, .c3 .c3-axis-x ticks {
-  stroke: #ADB1B6 !important;
-}
-.c3 .c3-axis-y path, .c3 .c3-axis-y line, .c3 .c3-axis-y ticks {
-  stroke: #ADB1B6 !important;
-}
-.c3 text {
-  fill:#ADB1B6 !important;
-}
-.c3-tooltip{background-color:#323231 !important;}
-.c3-tooltip th{
-  background-color:#323231 !important;
-  color:#ADB1B6 !important;
-}
-.c3-tooltip td{
-  background-color:#323231 !important;
-  color:#ADB1B6 !important;
+    background-color: #2d2d30 !important;
 }
diff --git a/Modules/Chart/resource/QmitkChartWidget.html b/Modules/Chart/resource/QmitkChartWidget.html
index 7371dc950a..0d14a5da6a 100644
--- a/Modules/Chart/resource/QmitkChartWidget.html
+++ b/Modules/Chart/resource/QmitkChartWidget.html
@@ -1,15 +1,14 @@
 <!DOCTYPE html>
 <html>
   <head>
     <!-- It is important, that Histogram.css is mentioned first here, to be able to replace it for dark theme-->
     <link href="Chart.css" rel="stylesheet" type="text/css">
-	  <link href="qrc:///C3js/c3.min.css" rel="stylesheet" type="text/css">
 
     <script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
     <script src="qrc:///C3js/plotly-1.42.5.min.js"></script>
   </head>
   <body>
     <div id="chart"></div>
     <script src="Chart.js"></script>
   </body>
 </html>
diff --git a/Modules/Chart/resource/empty.html b/Modules/Chart/resource/empty.html
index b557decc4f..1a8411b6fc 100644
--- a/Modules/Chart/resource/empty.html
+++ b/Modules/Chart/resource/empty.html
@@ -1,15 +1,12 @@
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 <html lang="en">
   <head>
-    <!-- It is important, that Histogram.css is mentioned first here, to be able to replace it for dark theme-->
-      <link href="Histogram.css" rel="stylesheet" type="text/css">
-	  <link href="qrc:///C3js/c3.min.css" rel="stylesheet" type="text/css">
+    <!-- It is important, that Chart.css is mentioned first here, to be able to replace it for dark theme-->
+      <link href="Chart.css" rel="stylesheet" type="text/css">
 
     <script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
-    <script src="qrc:///C3js/plotly-1.42.5.min.js"></script>
   </head>
   <body>
-    <div id="chart"></div>
     <script src="empty.js"></script>
   </body>
 </html>
diff --git a/Modules/Chart/resource/empty_dark.html b/Modules/Chart/resource/empty_dark.html
deleted file mode 100644
index 4146f9e1f7..0000000000
--- a/Modules/Chart/resource/empty_dark.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
-<html lang="en"> 
-  <head> 
-    <style>
-            html, body {
-                background-color: #323231;
-            }
-
-        </style>
-  </head> 
-</html> 
\ No newline at end of file
diff --git a/Modules/Chart/src/QmitkChartWidget.cpp b/Modules/Chart/src/QmitkChartWidget.cpp
index 0a01aa6a2a..1e17c65332 100644
--- a/Modules/Chart/src/QmitkChartWidget.cpp
+++ b/Modules/Chart/src/QmitkChartWidget.cpp
@@ -1,588 +1,613 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 
 #include <regex>
 
 #include <QGridLayout>
 #include <QWebChannel>
 #include <QWebEngineSettings>
 #include <QWebEngineView>
 #include <QmitkChartWidget.h>
 
 #include "mitkExceptionMacro.h"
 #include <QmitkChartData.h>
 #include <QmitkChartxyData.h>
 
 class CustomPage : public QWebEnginePage
 {
 public:
   CustomPage(QObject *parent = 0) : QWebEnginePage(parent) {}
   virtual void javaScriptConsoleMessage(JavaScriptConsoleMessageLevel /*level*/,
                                         const QString &message,
                                         int lineNumber,
                                         const QString & /*sourceID*/)
   {
     MITK_INFO << "JS > " << lineNumber << ": " << message.toStdString();
   }
 };
 
 class QmitkChartWidget::Impl final
 {
 public:
   explicit Impl(QWidget *parent);
   ~Impl();
 
   Impl(const Impl &) = delete;
   Impl &operator=(const Impl &) = delete;
 
   void AddData1D(const std::vector<double> &data1D, const std::string &label, QmitkChartWidget::ChartType chartType);
   void AddData2D(const std::map<double, double> &data2D,
                  const std::string &label,
                  QmitkChartWidget::ChartType chartType);
 
   void RemoveData(const std::string &label);
 
   void ClearData();
 
   void SetColor(const std::string &label, const std::string &colorName);
   void SetLineStyle(const std::string &label, LineStyle style);
 
   void SetYAxisScale(AxisScale scale);
 
   void SetXAxisLabel(const std::string &label);
 
   void SetYAxisLabel(const std::string &label);
 
   void SetTitle(const std::string &title);
 
   void SetErrorBars(const std::string &label, const std::vector<double> &errorPlus, const std::vector<double>& errorMinus = std::vector<double>());
+  std::string GetThemeName() const;
+  void SetThemeName(ChartStyle style);
+
   void SetChartType(QmitkChartWidget::ChartType chartType);
   void SetLegendPosition(LegendPosition position);
   void SetChartTypeByLabel(const std::string &label, QmitkChartWidget::ChartType chartType);
 
   void Show(bool showSubChart);
 
   void SetShowLegend(bool show);
   void SetShowErrorBars(bool show);
 
   void SetShowDataPoints(bool showDataPoints = false);
 
   void SetChartType(const std::string &label, QmitkChartWidget::ChartType chartType);
 
   std::string ConvertChartTypeToString(QmitkChartWidget::ChartType chartType) const;
 
   void ClearJavaScriptChart();
   void InitializeJavaScriptChart();
   void CallJavaScriptFuntion(const QString &command);
 
   QSize sizeHint() const;
 
 private:
   using ChartxyDataVector = std::vector<std::unique_ptr<QmitkChartxyData>>;
   std::string GetUniqueLabelName(const QList<QVariant> &labelList, const std::string &label) const;
   QmitkChartxyData *GetDataElementByLabel(const std::string &label) const;
   QList<QVariant> GetDataLabels(const ChartxyDataVector &c3xyData) const;
-  void MapTypes();
 
   QWebChannel *m_WebChannel;
   QWebEngineView *m_WebEngineView;
 
   QmitkChartData m_C3Data;
   ChartxyDataVector m_C3xyData;
   std::map<QmitkChartWidget::ChartType, std::string> m_ChartTypeToName;
+  std::map<QmitkChartWidget::ChartStyle, std::string> m_ChartStyleToName;
   std::map<QmitkChartWidget::LegendPosition, std::string> m_LegendPositionToName;
   std::map<QmitkChartWidget::LineStyle, std::string> m_LineStyleToName;
   std::map<QmitkChartWidget::AxisScale, std::string> m_AxisScaleToName;
 };
 
+std::string QmitkChartWidget::Impl::GetThemeName() const {
+  return m_C3Data.GetThemeName().toString().toStdString();
+}
+
 QmitkChartWidget::Impl::Impl(QWidget *parent)
   : m_WebChannel(new QWebChannel(parent)), m_WebEngineView(new QWebEngineView(parent))
 {
   // disable context menu for QWebEngineView
   m_WebEngineView->setContextMenuPolicy(Qt::NoContextMenu);
 
   m_WebEngineView->setPage(new CustomPage());
 
   // Set the webengineview to an initial empty page. The actual chart will be loaded once the data is calculated.
-  m_WebEngineView->setUrl(QUrl(QStringLiteral("qrc:///C3js/empty.html")));
+
+  m_WebEngineView->load(QUrl(QStringLiteral("qrc:///C3js/empty.html")));
   m_WebEngineView->page()->setWebChannel(m_WebChannel);
+
   m_WebEngineView->settings()->setAttribute(QWebEngineSettings::FocusOnNavigationEnabled, false);
 
   connect(m_WebEngineView, SIGNAL(loadFinished(bool)), parent, SLOT(OnLoadFinished(bool)));
   auto layout = new QGridLayout(parent);
   layout->setMargin(0);
   layout->addWidget(m_WebEngineView);
   m_ChartTypeToName.emplace(ChartType::bar, "bar");
   m_ChartTypeToName.emplace(ChartType::line, "line");
   m_ChartTypeToName.emplace(ChartType::spline, "spline");
   m_ChartTypeToName.emplace(ChartType::pie, "pie");
   m_ChartTypeToName.emplace(ChartType::area, "area");
   m_ChartTypeToName.emplace(ChartType::area_spline, "area-spline");
   m_ChartTypeToName.emplace(ChartType::scatter, "scatter");
 
   m_LegendPositionToName.emplace(LegendPosition::bottomMiddle, "bottomMiddle");
   m_LegendPositionToName.emplace(LegendPosition::bottomRight, "bottomRight");
   m_LegendPositionToName.emplace(LegendPosition::topRight, "topRight");
   m_LegendPositionToName.emplace(LegendPosition::topLeft, "topLeft");
   m_LegendPositionToName.emplace(LegendPosition::middleRight, "middleRight");
 
   m_LineStyleToName.emplace(LineStyle::solid, "solid");
   m_LineStyleToName.emplace(LineStyle::dashed, "dashed");
 
   m_AxisScaleToName.emplace(AxisScale::linear, "");
   m_AxisScaleToName.emplace(AxisScale::log, "log");
+
+  m_ChartStyleToName.emplace(ChartStyle::lightstyle, "light");
+  m_ChartStyleToName.emplace(ChartStyle::darkstyle, "dark");
 }
 
 QmitkChartWidget::Impl::~Impl() {}
 
 std::string CheckForCorrectHex(const std::string &colorName)
 {
   std::regex rgx("([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})");
   std::smatch match;
 
   if (!colorName.empty() && colorName.at(0) != '#' && std::regex_search(colorName.begin(), colorName.end(), match, rgx))
   {
     return "#" + colorName;
   }
   else
   {
     return colorName;
   }
 }
 
 void QmitkChartWidget::Impl::AddData1D(const std::vector<double> &data1D,
                                        const std::string &label,
                                        QmitkChartWidget::ChartType type)
 {
   std::map<double, double> transformedData2D;
   unsigned int count = 0;
   // transform the 1D data to 2D data
   for (const auto &ele : data1D)
   {
     transformedData2D[count] = ele;
     count++;
   }
 
   AddData2D(transformedData2D, label, type);
 }
 
 void QmitkChartWidget::Impl::AddData2D(const std::map<double, double> &data2D,
                                        const std::string &label,
                                        QmitkChartWidget::ChartType type)
 {
   QMap<QVariant, QVariant> data2DConverted;
   for (const auto &aValue : data2D)
   {
     data2DConverted.insert(aValue.first, aValue.second);
   }
   const std::string chartTypeName(m_ChartTypeToName.at(type));
 
   auto definedLabels = GetDataLabels(m_C3xyData);
   auto uniqueLabel = GetUniqueLabelName(definedLabels, label);
   if (type == ChartType::scatter)
   {
     SetShowDataPoints(true);
     MITK_INFO << "Enabling data points for all because of scatter plot";
   }
 
   m_C3xyData.push_back(std::make_unique<QmitkChartxyData>(
     data2DConverted, QVariant(QString::fromStdString(uniqueLabel)), QVariant(QString::fromStdString(chartTypeName))));
 }
 
 void QmitkChartWidget::Impl::RemoveData(const std::string &label)
 {
   for (ChartxyDataVector::iterator iter = m_C3xyData.begin(); iter != m_C3xyData.end(); ++iter)
   {
     if ((*iter)->GetLabel().toString().toStdString() == label)
     {
       m_C3xyData.erase(iter);
       return;
     }
   }
 
   throw std::invalid_argument("Cannot Remove Data because the label does not exist.");
 }
 
 void QmitkChartWidget::Impl::ClearData()
 {
   for (auto &xyData : m_C3xyData)
   {
     m_WebChannel->deregisterObject(xyData.get());
   }
   m_C3xyData.clear();
 }
 
 void QmitkChartWidget::Impl::SetColor(const std::string &label, const std::string &colorName)
 {
   auto element = GetDataElementByLabel(label);
   if (element)
   {
     auto colorChecked = CheckForCorrectHex(colorName);
     element->SetColor(QVariant(QString::fromStdString(colorChecked)));
   }
 }
 
 void QmitkChartWidget::Impl::SetLineStyle(const std::string &label, LineStyle style)
 {
   auto element = GetDataElementByLabel(label);
   // only has effect with chart type line
   if (element && element->GetChartType() == QVariant(QString::fromStdString(ConvertChartTypeToString(ChartType::line))))
   {
     const std::string lineStyleName(m_LineStyleToName.at(style));
     element->SetLineStyle(QVariant(QString::fromStdString(lineStyleName)));
   }
 }
 
 void QmitkChartWidget::Impl::SetYAxisScale(AxisScale scale)
 {
   const std::string axisScaleName(m_AxisScaleToName.at(scale));
   m_C3Data.SetYAxisScale(QString::fromStdString(axisScaleName));
 }
 
 QmitkChartxyData *QmitkChartWidget::Impl::GetDataElementByLabel(const std::string &label) const
 {
   for (const auto &qmitkChartxyData : m_C3xyData)
   {
     if (qmitkChartxyData->GetLabel().toString() == label.c_str())
     {
       return qmitkChartxyData.get();
     }
   }
   MITK_WARN << "label " << label << " not found in QmitkChartWidget";
   return nullptr;
 }
 
 QList<QVariant> QmitkChartWidget::Impl::GetDataLabels(const ChartxyDataVector &c3xyData) const
 {
   QList<QVariant> dataLabels;
   for (auto element = c3xyData.begin(); element != c3xyData.end(); ++element)
   {
     dataLabels.push_back((*element)->GetLabel());
   }
   return dataLabels;
 }
 
 void QmitkChartWidget::Impl::SetXAxisLabel(const std::string &label)
 {
   m_C3Data.SetXAxisLabel(QString::fromStdString(label));
 }
 
 void QmitkChartWidget::Impl::SetYAxisLabel(const std::string &label)
 {
   m_C3Data.SetYAxisLabel(QString::fromStdString(label));
 }
 
 void QmitkChartWidget::Impl::SetTitle(const std::string &title)
 {
   m_C3Data.SetTitle(QString::fromStdString(title));
 }
 
+void QmitkChartWidget::Impl::SetThemeName(QmitkChartWidget::ChartStyle style)
+{
+  const std::string themeName(m_ChartStyleToName.at(style));
+  m_C3Data.SetThemeName(QString::fromStdString(themeName));
+}
+
 void QmitkChartWidget::Impl::SetChartType(QmitkChartWidget::ChartType chartType)
 {
   for (auto iterator = m_C3xyData.begin(); iterator != m_C3xyData.end(); ++iterator)
   {
     SetChartTypeByLabel((*iterator)->GetLabel().toString().toStdString(), chartType);
   }
 
   auto chartTypeName = ConvertChartTypeToString(chartType);
   const QString command = QString::fromStdString("transformView('" + chartTypeName + "')");
   CallJavaScriptFuntion(command);
 }
 
 void QmitkChartWidget::Impl::SetChartTypeByLabel(const std::string &label, QmitkChartWidget::ChartType chartType)
 {
   auto element = GetDataElementByLabel(label);
   if (element)
   {
     if (chartType == ChartType::scatter)
     {
       SetShowDataPoints(true);
       MITK_INFO << "Enabling data points for all because of scatter plot";
     }
     auto chartTypeName = ConvertChartTypeToString(chartType);
     element->SetChartType(QVariant(QString::fromStdString(chartTypeName)));
   }
 }
 
 void QmitkChartWidget::Impl::SetLegendPosition(QmitkChartWidget::LegendPosition legendPosition)
 {
   const std::string legendPositionName(m_LegendPositionToName.at(legendPosition));
   m_C3Data.SetLegendPosition(QString::fromStdString(legendPositionName));
 }
 
 void QmitkChartWidget::Impl::Show(bool showSubChart)
 {
   if (m_C3xyData.empty())
   {
     MITK_WARN << "no data available for display in chart";
   }
   else
   {
     m_C3Data.SetAppearance(showSubChart, m_C3xyData.front()->GetChartType() == QVariant("pie"));
   }
 
-    InitializeJavaScriptChart();
+  InitializeJavaScriptChart();
 }
 
 void QmitkChartWidget::Impl::SetShowLegend(bool show)
 {
   m_C3Data.SetShowLegend(show);
 }
 
 void QmitkChartWidget::Impl::SetShowErrorBars(bool show)
 {
   m_C3Data.SetShowErrorBars(show);
 }
 
 void QmitkChartWidget::Impl::SetShowDataPoints(bool showDataPoints)
 {
   if (showDataPoints == true)
   {
     m_C3Data.SetDataPointSize(3);
   }
   else
   {
     m_C3Data.SetDataPointSize(0);
   }
 }
 
 void QmitkChartWidget::Impl::SetChartType(const std::string &label, QmitkChartWidget::ChartType chartType)
 {
   auto element = GetDataElementByLabel(label);
   if (element)
   {
     if (chartType == ChartType::scatter)
     {
       SetShowDataPoints(true);
       MITK_INFO << "Enabling data points for all because of scatter plot";
     }
     const std::string chartTypeName(m_ChartTypeToName.at(chartType));
     element->SetChartType(QVariant(QString::fromStdString(chartTypeName)));
   }
 }
 
 void QmitkChartWidget::Impl::SetErrorBars(const std::string &label, const std::vector<double> &errorPlus, const std::vector<double>& errorMinus)
 {
   auto element = GetDataElementByLabel(label);
   if (element)
   {
     QList<QVariant> errorConvertedPlus;
     for (const auto &aValue : errorPlus)
     {
       errorConvertedPlus.append(aValue);
     }
 
     QList<QVariant> errorConvertedMinus;
     for (const auto &aValue : errorMinus)
     {
       errorConvertedMinus.append(aValue);
     }
 
     element->SetErrorDataPlus(errorConvertedPlus);
     element->SetErrorDataMinus(errorConvertedMinus);
   }
 }
 
 std::string QmitkChartWidget::Impl::ConvertChartTypeToString(QmitkChartWidget::ChartType chartType) const
 {
   return m_ChartTypeToName.at(chartType);
 }
 
 QSize QmitkChartWidget::Impl::sizeHint() const
 {
   return QSize(400, 300);
 }
 
 void QmitkChartWidget::Impl::CallJavaScriptFuntion(const QString &command)
 {
   m_WebEngineView->page()->runJavaScript(command);
 }
 
 void QmitkChartWidget::Impl::ClearJavaScriptChart()
 {
-  m_WebEngineView->setUrl(QUrl(QStringLiteral("qrc:///C3js/empty.html")));
+  m_WebEngineView->load(QUrl(QStringLiteral("qrc:///C3js/empty.html")));
 }
 
 void QmitkChartWidget::Impl::InitializeJavaScriptChart()
 {
   m_WebChannel->registerObject(QStringLiteral("chartData"), &m_C3Data);
   unsigned count = 0;
   for (auto &xyData : m_C3xyData)
   {
     QString variableName = "xyData" + QString::number(count);
     m_WebChannel->registerObject(variableName, xyData.get());
     count++;
   }
 
   m_WebEngineView->load(QUrl(QStringLiteral("qrc:///C3js/QmitkChartWidget.html")));
 }
 
 std::string QmitkChartWidget::Impl::GetUniqueLabelName(const QList<QVariant> &labelList, const std::string &label) const
 {
   QString currentLabel = QString::fromStdString(label);
   int counter = 0;
   while (labelList.contains(currentLabel))
   {
     currentLabel = QString::fromStdString(label + std::to_string(counter));
     counter++;
   }
   return currentLabel.toStdString();
 }
 
-QmitkChartWidget::QmitkChartWidget(QWidget *parent) : QWidget(parent), m_Impl(new Impl(this)) {}
+QmitkChartWidget::QmitkChartWidget(QWidget *parent) : QWidget(parent), m_Impl(new Impl(this)) {
+  connect(this, &QmitkChartWidget::PageSuccessfullyLoaded, this, &QmitkChartWidget::OnPageSuccessfullyLoaded);
+}
 
 QmitkChartWidget::~QmitkChartWidget() {}
 
 void QmitkChartWidget::AddData2D(const std::map<double, double> &data2D, const std::string &label, ChartType type)
 {
   m_Impl->AddData2D(data2D, label, type);
 }
 
 void QmitkChartWidget::SetColor(const std::string &label, const std::string &colorName)
 {
   m_Impl->SetColor(label, colorName);
 }
 
 void QmitkChartWidget::SetLineStyle(const std::string &label, LineStyle style)
 {
   m_Impl->SetLineStyle(label, style);
 }
 
 void QmitkChartWidget::SetYAxisScale(AxisScale scale)
 {
   m_Impl->SetYAxisScale(scale);
 }
 
 void QmitkChartWidget::AddData1D(const std::vector<double> &data1D, const std::string &label, ChartType type)
 {
   m_Impl->AddData1D(data1D, label, type);
 }
 
 void QmitkChartWidget::RemoveData(const std::string &label)
 {
   m_Impl->RemoveData(label);
 }
 
 void QmitkChartWidget::SetXAxisLabel(const std::string &label)
 {
   m_Impl->SetXAxisLabel(label);
 }
 
 void QmitkChartWidget::SetYAxisLabel(const std::string &label)
 {
   m_Impl->SetYAxisLabel(label);
 }
 
 void QmitkChartWidget::SetTitle(const std::string &title)
 {
   m_Impl->SetTitle(title);
 }
 
 void QmitkChartWidget::SetShowDataPoints(bool showDataPoints)
 {
   m_Impl->SetShowDataPoints(showDataPoints);
 }
 
 void QmitkChartWidget::SetChartType(const std::string &label, ChartType type)
 {
   m_Impl->SetChartType(label, type);
 }
 
 void QmitkChartWidget::SetErrorBars(const std::string &label, const std::vector<double> &errorPlus, const std::vector<double>& errorMinus) 
 {
   m_Impl->SetErrorBars(label, errorPlus, errorMinus);
 }
 
 void QmitkChartWidget::SetLegendPosition(LegendPosition position)
 {
   m_Impl->SetLegendPosition(position);
 }
 
 void QmitkChartWidget::SetShowLegend(bool show)
 {
   m_Impl->SetShowLegend(show);
 }
 
 void QmitkChartWidget::SetStackedData(bool stacked) {
   Q_UNUSED(stacked)  //this is a temporary solution and will be changed as soon as this method is implemented
   MITK_WARN << "not yet implemented";
 }
 
 void QmitkChartWidget::Show(bool showSubChart)
 {
   m_Impl->Show(showSubChart);
 }
 
 void QmitkChartWidget::Clear()
 {
   m_Impl->ClearData();
   m_Impl->ClearJavaScriptChart();
 }
 
 void QmitkChartWidget::OnLoadFinished(bool isLoadSuccessfull)
 {
   if (isLoadSuccessfull)
   {
     emit PageSuccessfullyLoaded();
   }
 }
 
-void QmitkChartWidget::SetChartTypeForAllDataAndReload(ChartType type)
-{
-  m_Impl->SetChartType(type);
-}
-
-void QmitkChartWidget::SetTheme(ChartStyle themeEnabled)
-{
+void QmitkChartWidget::OnPageSuccessfullyLoaded() {
+  auto themeName = m_Impl->GetThemeName();
   QString command;
-  if (themeEnabled == ChartStyle::darkstyle)
+  if (themeName == "dark")
   {
     command = QString("changeTheme('dark')");
   }
   else
   {
     command = QString("changeTheme('light')");
   }
 
   m_Impl->CallJavaScriptFuntion(command);
 }
 
+void QmitkChartWidget::SetChartTypeForAllDataAndReload(ChartType type)
+{
+  m_Impl->SetChartType(type);
+}
+
+void QmitkChartWidget::SetTheme(ChartStyle themeEnabled)
+{
+  m_Impl->SetThemeName(themeEnabled);
+}
+
 void QmitkChartWidget::SetShowSubchart(bool showSubChart)
 {
   QString subChartString = convertBooleanValue(showSubChart);
   const QString command = QString("SetShowSubchart(" + subChartString + ")");
   m_Impl->CallJavaScriptFuntion(command);
 }
 
 void QmitkChartWidget::SetShowErrorBars(bool showErrorBars) 
 {
   m_Impl->SetShowErrorBars(showErrorBars);
 
   //QString showErrorBarsString = convertBooleanValue(showErrorBars);
   //const QString command = QString("SetShowErrorBars(" + showErrorBarsString + ")");
   //m_Impl->CallJavaScriptFuntion(command);
 }
 
 void QmitkChartWidget::Reload()
 {
   const QString command = QString("Reload()");
   m_Impl->CallJavaScriptFuntion(command);
 }
 
 QSize QmitkChartWidget::sizeHint() const
 {
   return m_Impl->sizeHint();
 }
diff --git a/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.cpp b/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.cpp
index 507ecd6e43..3c7b6464e6 100644
--- a/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.cpp
+++ b/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.cpp
@@ -1,144 +1,138 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 
 #include "QmitkHistogramVisualizationWidget.h"
 
 #include <QClipboard>
 
 QmitkHistogramVisualizationWidget::QmitkHistogramVisualizationWidget(QWidget* parent) : QWidget(parent)
 {
 	m_Controls.setupUi(this);
   m_Controls.checkBoxShowSubchart->setChecked(false);
   m_Controls.spinBoxNBins->setValue(m_DefaultNBins);
   m_Controls.spinBoxNBins->setMinimum(m_MinNBins);
   m_Controls.spinBoxNBins->setMaximum(m_MaxNBins);
 
   CreateConnections();
 }
 
 void QmitkHistogramVisualizationWidget::SetHistogram(itk::Statistics::Histogram<double>::ConstPointer histogram, const std::string& dataLabel)
 {
 	if (histogram == nullptr)
 		return;
 
 	m_Histogram = histogram;
 	m_Controls.chartWidget->AddData2D(ConvertHistogramToMap(m_Histogram), dataLabel);
 	m_Controls.chartWidget->SetChartType(dataLabel, QmitkChartWidget::ChartType::bar);
 	m_Controls.chartWidget->SetXAxisLabel("Gray value");
 	m_Controls.chartWidget->SetYAxisLabel("Frequency");
   m_Controls.chartWidget->Show(m_Controls.checkBoxShowSubchart->isChecked());
 	SetGUIElementsEnabled(true);
 }
 
 void QmitkHistogramVisualizationWidget::Reset()
 {
   m_Controls.chartWidget->Clear();
 	SetGUIElementsEnabled(false);
 }
 
 void QmitkHistogramVisualizationWidget::SetTheme(QmitkChartWidget::ChartStyle style)
 {
-  m_ChartStyle = style;
+  m_Controls.chartWidget->SetTheme(style);
 }
 
 void QmitkHistogramVisualizationWidget::CreateConnections()
 {
 	connect(m_Controls.buttonCopyHistogramToClipboard, &QPushButton::clicked, this, &QmitkHistogramVisualizationWidget::OnClipboardButtonClicked);
 	connect(m_Controls.checkBoxUseDefaultNBins, &QCheckBox::clicked, this, &QmitkHistogramVisualizationWidget::OnDefaultNBinsCheckBoxChanged);
 	connect(m_Controls.spinBoxNBins, &QSpinBox::editingFinished, this, &QmitkHistogramVisualizationWidget::OnNBinsSpinBoxValueChanged);
 	connect(m_Controls.checkBoxShowSubchart, &QCheckBox::clicked, this, &QmitkHistogramVisualizationWidget::OnShowSubchartCheckBoxChanged);
-  connect(m_Controls.chartWidget, &QmitkChartWidget::PageSuccessfullyLoaded, this, &QmitkHistogramVisualizationWidget::OnPageSuccessfullyLoaded);
 }
 
 void QmitkHistogramVisualizationWidget::SetGUIElementsEnabled(bool enabled)
 {
 	this->setEnabled(enabled);
 	m_Controls.groupBoxPlot->setEnabled(enabled);
 	m_Controls.checkBoxShowSubchart->setEnabled(enabled);
 	m_Controls.checkBoxUseDefaultNBins->setEnabled(enabled);
 	m_Controls.spinBoxNBins->setEnabled(!m_Controls.checkBoxUseDefaultNBins->isChecked());
 	m_Controls.buttonCopyHistogramToClipboard->setEnabled(enabled);
 }
 
 std::map<double, double> QmitkHistogramVisualizationWidget::ConvertHistogramToMap(itk::Statistics::Histogram<double>::ConstPointer histogram) const
 {
 	std::map<double, double> histogramMap;
 	if (histogram)
 	{
 		auto endIt = histogram->End();
 		auto it = histogram->Begin();
 
 		// generating Lists of measurement and frequencies
 		for (; it != endIt; ++it)
 		{
 			double frequency = it.GetFrequency();
 			double measurement = it.GetMeasurementVector()[0];
 			histogramMap.emplace(measurement, frequency);
 		}
 
 	}
 	return histogramMap;
 }
 
 void QmitkHistogramVisualizationWidget::OnClipboardButtonClicked()
 {
 	if (m_Histogram)
 	{
 		QApplication::clipboard()->clear();
 		QString clipboard("Measurement \t Frequency\n");
 		auto iter = m_Histogram->Begin();
 		auto iterEnd = m_Histogram->End();
 		for (; iter != iterEnd; ++iter)
 		{
 			clipboard = clipboard.append("%L1 \t %L2\n")
 				.arg(iter.GetMeasurementVector()[0], 0, 'f', 2)
 				.arg(iter.GetFrequency());
 		}
 
 		QApplication::clipboard()->setText(clipboard, QClipboard::Clipboard);
 	}
 }
 
 void QmitkHistogramVisualizationWidget::OnDefaultNBinsCheckBoxChanged()
 {
 	if (m_Controls.checkBoxUseDefaultNBins->isChecked())
 	{
 		m_Controls.spinBoxNBins->setEnabled(false);
     if (m_Controls.spinBoxNBins->value() != static_cast<int>(m_DefaultNBins) ) {
       m_Controls.spinBoxNBins->setValue(m_DefaultNBins);
       OnNBinsSpinBoxValueChanged();
     }
 	}
 	else
 	{
 		m_Controls.spinBoxNBins->setEnabled(true);
 	}
 }
 
 void QmitkHistogramVisualizationWidget::OnNBinsSpinBoxValueChanged()
 {
 	emit RequestHistogramUpdate(m_Controls.spinBoxNBins->value());
 }
 
 void QmitkHistogramVisualizationWidget::OnShowSubchartCheckBoxChanged()
 {
 	m_Controls.chartWidget->Show(m_Controls.checkBoxShowSubchart->isChecked());
 }
-
-void QmitkHistogramVisualizationWidget::OnPageSuccessfullyLoaded()
-{
-  m_Controls.chartWidget->SetTheme(m_ChartStyle);
-}
diff --git a/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.h b/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.h
index aac9fdf1c3..a1a92aaccf 100644
--- a/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.h
+++ b/Modules/ImageStatisticsUI/Qmitk/QmitkHistogramVisualizationWidget.h
@@ -1,75 +1,73 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 #ifndef QmitkHistogramVisualizationWidget_H__INCLUDED
 #define QmitkHistogramVisualizationWidget_H__INCLUDED
 
 #include <MitkImageStatisticsUIExports.h>
 #include <ui_QmitkHistogramVisualizationWidget.h>
 
 //itk
 #include <itkHistogram.h>
 
 /**
 * \brief Widget for displaying Histograms.
 */
 
 class MITKIMAGESTATISTICSUI_EXPORT QmitkHistogramVisualizationWidget : public QWidget
 {
 	Q_OBJECT
 
 public:
 	QmitkHistogramVisualizationWidget(QWidget* parent = nullptr);
 	/** \brief Draws the histogram and enables the GUI elements. */
   void SetHistogram(itk::Statistics::Histogram<double>::ConstPointer histogram, const std::string& dataLabel);
 	/** \brief Clears the histogram and disables all GUI elements. */
 	void Reset();
   /** \brief Sets the theme (either dark or light) */
   void SetTheme(QmitkChartWidget::ChartStyle style);
 
 signals:
 	/** \brief Signal to be emitted when the number of bins is changed by the user. The HistogramCalculator should connect to this signal and recalculate the data accordingly. */
 	void RequestHistogramUpdate(unsigned int nBins);
 
 private:
 
 	void CreateConnections();
 
 	void SetGUIElementsEnabled(bool enabled);
 	/** \brief Helper function to convert the histogram in order to forward it to the ChartWidget. */
 	std::map<double, double> ConvertHistogramToMap(itk::Statistics::Histogram<double>::ConstPointer histogram) const;
 
 //slots
 	/** \brief  Saves the histogram to the clipboard. */
 	void OnClipboardButtonClicked();
 	/** \brief Enables / Disables SpinBox to change the number of bins. */
 	void OnDefaultNBinsCheckBoxChanged();
 	/** \brief Emits the signal RequestHistogramUpdate(unsigned int nBins) with the updated value. */
 	void OnNBinsSpinBoxValueChanged();
 	/** \brief Shows / Hides the subchart. */
 	void OnShowSubchartCheckBoxChanged();
-  void OnPageSuccessfullyLoaded();
 
 private:
 	Ui::QmitkHistogramVisualizationControls m_Controls;
   const unsigned int m_DefaultNBins = 100;
   const unsigned int m_MinNBins = 10;
   const unsigned int m_MaxNBins = 10000;
 
 	itk::Statistics::Histogram<double>::ConstPointer m_Histogram;
-  QmitkChartWidget::ChartStyle m_ChartStyle = QmitkChartWidget::ChartStyle::darkstyle;
 };
 
 #endif //QmitkHistogramVisualizationWidget_H__INCLUDED
\ No newline at end of file
diff --git a/Plugins/org.mitk.gui.qt.chartExample/src/internal/ChartExample.cpp b/Plugins/org.mitk.gui.qt.chartExample/src/internal/ChartExample.cpp
index 37ed214d7a..b214408158 100644
--- a/Plugins/org.mitk.gui.qt.chartExample/src/internal/ChartExample.cpp
+++ b/Plugins/org.mitk.gui.qt.chartExample/src/internal/ChartExample.cpp
@@ -1,194 +1,190 @@
 /*===================================================================
 
 The Medical Imaging Interaction Toolkit (MITK)
 
 Copyright (c) German Cancer Research Center,
 Division of Medical and Biological Informatics.
 All rights reserved.
 
 This software is distributed WITHOUT ANY WARRANTY; without
 even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.
 
 See LICENSE.txt or http://www.mitk.org for details.
 
 ===================================================================*/
 
 
 // Blueberry
 #include <berryISelectionService.h>
 #include <berryIWorkbenchWindow.h>
 #include <berryWorkbenchPlugin.h>
 #include <berryIQtStyleManager.h>
 
 // Qmitk
 #include "ChartExample.h"
 
 // Qt
 #include <QMessageBox>
 #include <QRandomGenerator>
 
-// mitk image
-#include <mitkImage.h>
-
 
 const std::string ChartExample::VIEW_ID = "org.mitk.views.chartexample";
 
 void ChartExample::SetFocus()
 {
   m_Controls.m_buttonCreateChart->setFocus();
 }
 
 void ChartExample::CreateQtPartControl(QWidget *parent)
 {
   // create GUI widgets from the Qt Designer's .ui file
   m_Controls.setupUi(parent);
   connect(m_Controls.m_buttonCreateChart, &QPushButton::clicked, this, &ChartExample::CreateChart);
   connect(m_Controls.m_buttonClearChart, &QPushButton::clicked, this, &ChartExample::ClearChart);
   connect(m_Controls.m_buttonAddData, &QPushButton::clicked, this, &ChartExample::AddData);
 
   FillRandomDataValues();
-
-  m_Controls.m_Chart->SetTheme(GetColorTheme());
+  auto chartStyle = GetColorTheme();
+  m_Controls.m_Chart->SetTheme(chartStyle);
 
   m_Controls.m_lineEditXAxisLabel->setText("xLabel");
   m_Controls.m_lineEditYAxisLabel->setText("yLabel");
 
   m_chartNameToChartType.emplace("bar", QmitkChartWidget::ChartType::bar);
   m_chartNameToChartType.emplace("line", QmitkChartWidget::ChartType::line);
   m_chartNameToChartType.emplace("spline", QmitkChartWidget::ChartType::spline);
   m_chartNameToChartType.emplace("pie", QmitkChartWidget::ChartType::pie);
   m_chartNameToChartType.emplace("area", QmitkChartWidget::ChartType::area);
   m_chartNameToChartType.emplace("area-spline", QmitkChartWidget::ChartType::area_spline);
   m_chartNameToChartType.emplace("scatter", QmitkChartWidget::ChartType::scatter);
 
   m_LineNameToLineType.emplace("solid", QmitkChartWidget::LineStyle::solid);
   m_LineNameToLineType.emplace("dashed", QmitkChartWidget::LineStyle::dashed);
 
   m_AxisScaleNameToAxisScaleType.emplace("linear", QmitkChartWidget::AxisScale::linear);
   m_AxisScaleNameToAxisScaleType.emplace("logarithmic", QmitkChartWidget::AxisScale::log);
 }
 
 void ChartExample::FillRandomDataValues()
 {
   std::vector<double> numbers = generateRandomNumbers(10, 10.0);
   std::string text = convertToText(numbers, ";");
   m_Controls.m_lineEditDataVector->setText(QString::fromStdString(text));
 
   m_Controls.m_lineEditDataLabel->setText("test" + QString::number(countForUID));
   countForUID++;
 }
 
 void ChartExample::CreateChart()
 {
   auto dataYAxisScaleType = m_AxisScaleNameToAxisScaleType.at(m_Controls.m_comboBoxYAxisScale->currentText().toStdString());
   auto xAxisLabel = m_Controls.m_lineEditXAxisLabel->text().toStdString();
   auto yAxisLabel = m_Controls.m_lineEditYAxisLabel->text().toStdString();
   auto showLegend = m_Controls.m_checkBoxShowLegend->isChecked();
   auto showDataPoints = m_Controls.m_checkBoxShowDataPoints->isChecked();
   auto stackedData = m_Controls.m_checkBoxStackedData->isChecked();
   auto showSubchart = m_Controls.m_checkBoxShowSubchart->isChecked();
 
   m_Controls.m_Chart->SetYAxisScale(dataYAxisScaleType);
   m_Controls.m_Chart->SetXAxisLabel(xAxisLabel);
   m_Controls.m_Chart->SetYAxisLabel(yAxisLabel);
   m_Controls.m_Chart->SetShowLegend(showLegend);
   m_Controls.m_Chart->SetShowErrorBars(true);
   m_Controls.m_Chart->SetShowDataPoints(showDataPoints);
   m_Controls.m_Chart->SetStackedData(stackedData);
   m_Controls.m_Chart->Show(showSubchart);
 }
 
 
 void ChartExample::ClearChart()
 {
   m_Controls.m_Chart->Clear();
   m_Controls.m_plainTextEditDataView->clear();
 }
 
 void ChartExample::AddData()
 {
   auto lineEditData = m_Controls.m_lineEditDataVector->text();
   std::vector<double> data;
   for(const QString entry : lineEditData.split(';'))
   {
     data.push_back(entry.toDouble());
   }
 
   auto chartType = m_chartNameToChartType.at(m_Controls.m_comboBoxChartType->currentText().toStdString());
   std::string dataLabel = m_Controls.m_lineEditDataLabel->text().toStdString();
   std::string dataColor = m_Controls.m_lineEditColor->text().toStdString();
   auto dataLineStyleType = m_LineNameToLineType.at(m_Controls.m_comboBoxLineStyle->currentText().toStdString());
   
   m_Controls.m_Chart->AddData1D(data, dataLabel, chartType);
   if (!dataColor.empty()) {
     m_Controls.m_Chart->SetColor(dataLabel, dataColor);
   }
 
   auto errorValuesMinus = std::vector<double>(data.size());
   std::transform(data.begin(), data.end(), errorValuesMinus.begin(), [](double d) { return d / 2; });
   m_Controls.m_Chart->SetErrorBars(dataLabel, data, errorValuesMinus);
 
   m_Controls.m_Chart->SetLineStyle(dataLabel, dataLineStyleType);
 
   QString dataOverview;
   dataOverview.append(m_Controls.m_lineEditDataLabel->text());
   dataOverview.append("(").append(m_Controls.m_comboBoxChartType->currentText());
   if (!dataColor.empty()) {
     dataOverview.append(", ").append(dataColor.c_str());
   }
   dataOverview.append(", ").append(m_Controls.m_comboBoxLineStyle->currentText());
   dataOverview.append(")");
   dataOverview.append(":").append(lineEditData);
 
   m_Controls.m_plainTextEditDataView->appendPlainText(dataOverview);
 
   FillRandomDataValues();
 }
 
 std::vector<double> ChartExample::generateRandomNumbers(unsigned int amount, double max) const
 {
   QRandomGenerator gen;
   gen.seed(time(NULL));
 
   std::vector<double> data;
   for (unsigned int i = 0; i < amount; i++) {
     data.push_back(gen.bounded(max));
   }
 
   return data;
 }
 
 std::string ChartExample::convertToText(std::vector<double> numbers, std::string delimiter) const
 {
   std::ostringstream oss;
   oss.precision(3);
 
   if (!numbers.empty())
   {
     for (auto number : numbers) {
       oss << number << delimiter;
     }
   }
   auto aString = oss.str();
   aString.pop_back();
   return aString;
 }
 
 QmitkChartWidget::ChartStyle ChartExample::GetColorTheme() const
 {
   ctkPluginContext* context = berry::WorkbenchPlugin::GetDefault()->GetPluginContext();
   ctkServiceReference styleManagerRef = context->getServiceReference<berry::IQtStyleManager>();
   if (styleManagerRef)
   {
     auto styleManager = context->getService<berry::IQtStyleManager>(styleManagerRef);
     if (styleManager->GetStyle().name == "Dark") {
       return QmitkChartWidget::ChartStyle::darkstyle;
     }
     else {
       return QmitkChartWidget::ChartStyle::lightstyle;
     }
   }
   return QmitkChartWidget::ChartStyle::darkstyle;
 }
-