Issue #2943952 by andileco: Enable stacking

charts.module

@@ -97,13 +97,15 @@ function template_preprocess_views_view_charts(&$variables) {
 
   if (!isset($plugin_definitions)) {
     // To be removed in drupal 9.
-    $moduleSelector = new ModuleSelector($library, $categories, $seriesData, $options, $attachmentDisplayOptions, $chartId);
+    $moduleSelector = new ModuleSelector($library, $categories, $seriesData, $attachmentDisplayOptions, $options, $chartId);
     if ($moduleSelector->moduleExists()) {
       $moduleSelector->buildVariables($variables);
     }
   }
   else {
     $plugin = $plugin_manager->createInstance($library);
+    $variables['height'] = $options['height'];
+    $variables['width'] = $options['width'];
     $plugin->buildVariables($options, $categories, $seriesData, $attachmentDisplayOptions, $variables, $chartId);
   }
 }

modules/charts_blocks/src/Plugin/Block/ChartsBlock.php

@@ -134,7 +134,7 @@ class ChartsBlock extends BlockBase {
 
     unset($form['display']['background']['#parents']);
     $form['display']['background']['#default_value'] = $this->configuration['background'];
-    
+
     unset($form['display']['three_dimensional']['#parents']);
     $form['display']['three_dimensional']['#default_value'] = $this->configuration['three_dimensional'];
 

modules/charts_blocks/templates/charts-block.html.twig

 {% set library, height, width = 'charts_' ~ library ~ '/' ~ library, options.height, options.width %}
 {{ attach_library("#{ library }") }}
-<div {{ attributes }} {{ content_attributes }} style="width:{{ width }};height:{{ height }};"></div>
+<div {{ attributes }} {{ content_attributes }} style="{% if width is not empty %}width:{{ width }}px;{% endif %}{% if height is not empty %}height:{{ height }}px;{% endif %}"></div>

modules/charts_highcharts/src/Charts/HighchartsChartsRender.php

@@ -6,6 +6,7 @@ use Drupal\charts\Charts\ChartsRenderInterface;
 use Drupal\charts\Util\Util;
 use Drupal\charts_highcharts\Settings\Highcharts\Chart;
 use Drupal\charts_highcharts\Settings\Highcharts\ChartTitle;
+use Drupal\charts_highcharts\Settings\Highcharts\PlotOptionsStacking;
 use Drupal\charts_highcharts\Settings\Highcharts\Xaxis;
 use Drupal\charts_highcharts\Settings\Highcharts\XaxisTitle;
 use Drupal\charts_highcharts\Settings\Highcharts\ChartLabel;
@@ -143,13 +144,22 @@ class HighchartsChartsRender implements ChartsRenderInterface {
       array_push($yAxes, $chartYaxisSecondary);
     }
 
-    // Set Plotoptions.
+    // Set plot options.
     $plotOptions = new PlotOptions();
+    $plotOptionsStacking = new PlotOptionsStacking();
     $plotOptionsSeries = new PlotOptionsSeries();
     $plotOptionsSeriesDataLabels = new PlotOptionsSeriesDataLabels();
-    $plotOptions->setPlotSeries($plotOptionsSeries);
-    $plotOptionsSeries->setDataLabels($plotOptionsSeriesDataLabels);
-    $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    // Set plot options if stacked chart.
+    if(!empty($options['grouping'])) {
+      $plotOptions->setPlotSeries($plotOptionsStacking);
+      $plotOptionsStacking->setDataLabels($plotOptionsSeriesDataLabels);
+      $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    }
+    else {
+      $plotOptions->setPlotSeries($plotOptionsSeries);
+      $plotOptionsSeries->setDataLabels($plotOptionsSeriesDataLabels);
+      $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    }
 
     // Set Tooltip.
     $chartTooltip = new Tooltip();

modules/charts_highcharts/src/Plugin/chart/Highchart.php

@@ -3,10 +3,9 @@
 namespace Drupal\charts_highcharts\Plugin\chart;
 
 use Drupal\charts\Plugin\chart\AbstractChart;
-/* use Drupal\Charts\Annotation\Chart; */
 use Drupal\charts_highcharts\Settings\Highcharts\Chart;
-/* use Drupal\charts_highcharts\Settings\Highcharts\ChartType; */
 use Drupal\charts_highcharts\Settings\Highcharts\ChartTitle;
+use Drupal\charts_highcharts\Settings\Highcharts\PlotOptionsStacking;
 use Drupal\charts_highcharts\Settings\Highcharts\Xaxis;
 use Drupal\charts_highcharts\Settings\Highcharts\XaxisTitle;
 use Drupal\charts_highcharts\Settings\Highcharts\ChartLabel;
@@ -150,13 +149,22 @@ class Highchart extends AbstractChart {
       array_push($yAxes, $chartYaxisSecondary);
     }
 
-    // Set Plotoptions.
+    // Set plot options.
     $plotOptions = new PlotOptions();
+    $plotOptionsStacking = new PlotOptionsStacking();
     $plotOptionsSeries = new PlotOptionsSeries();
     $plotOptionsSeriesDataLabels = new PlotOptionsSeriesDataLabels();
-    $plotOptions->setPlotSeries($plotOptionsSeries);
-    $plotOptionsSeries->setDataLabels($plotOptionsSeriesDataLabels);
-    $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    // Set plot options if stacked chart.
+    if(!empty($options['grouping'])) {
+      $plotOptions->setPlotSeries($plotOptionsStacking);
+      $plotOptionsStacking->setDataLabels($plotOptionsSeriesDataLabels);
+      $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    }
+    else {
+      $plotOptions->setPlotSeries($plotOptionsSeries);
+      $plotOptionsSeries->setDataLabels($plotOptionsSeriesDataLabels);
+      $plotOptionsSeriesDataLabels->setEnabled($options['data_labels']);
+    }
 
     // Set Tooltip.
     $chartTooltip = new Tooltip();
@@ -186,7 +194,6 @@ class Highchart extends AbstractChart {
     $highchart->setChart($chart);
     $highchart->setTitle($chartTitle);
     $highchart->setAxisX($chartXaxis);
-    /* $highchart->yAxis = $yAxes; */
     $highchart->setTooltip($chartTooltip);
     $highchart->setPlotOptions($plotOptions);
     $highchart->setCredits($chartCredits);

modules/charts_highcharts/src/Settings/Highcharts/PlotOptionsStacking.php

+<?php
+
+namespace Drupal\charts_highcharts\Settings\Highcharts;
+
+/**
+ * Plot Options Series.
+ */
+class PlotOptionsStacking implements \JsonSerializable {
+
+  private $dataLabels;
+  private $stacking = 'normal';
+
+  /**
+   * Get Data Labels.
+   *
+   * @return mixed
+   *   Data Labels.
+   */
+  public function getDataLabels() {
+    return $this->dataLabels;
+  }
+
+  /**
+   * Set Data Labels.
+   *
+   * @param mixed $dataLabels
+   *   Data Labels.
+   */
+  public function setDataLabels($dataLabels) {
+    $this->dataLabels = $dataLabels;
+  }
+
+  /**
+   * Get Stacking.
+   *
+   * @return mixed
+   *   Stacking.
+   */
+  public function getStacking() {
+    return $this->stacking;
+  }
+
+  /**
+   * Set Stacking.
+   *
+   * @param mixed $stacking
+   *   Stacking.
+   */
+  public function setStacking($stacking) {
+    $this->stacking = $stacking;
+  }
+
+  /**
+   * Json Serialize.
+   *
+   * @return array
+   *   Json Serialize.
+   */
+  public function jsonSerialize() {
+    $vars = get_object_vars($this);
+
+    return $vars;
+  }
+
+}

src/Plugin/views/style/ChartsPluginStyleChart.php

@@ -24,7 +24,7 @@ use Drupal\views\Plugin\views\style\StylePluginBase;
  */
 class ChartsPluginStyleChart extends StylePluginBase {
 
-  protected $usesGrouping = FALSE;
+ // protected $usesGrouping = FALSE;
   protected $usesFields = TRUE;
   protected $usesRowPlugin = TRUE;
 

templates/views-view-charts.html.twig

-{% set library, height, width = 'charts_' ~ chart_type ~ '/' ~ chart_type, options.height, options.width %}
+{% set library, height, width = 'charts_' ~ chart_type ~ '/' ~ chart_type, height, width %}
 {{ attach_library("#{ library }") }}
-<div {{ attributes }} {{ content_attributes }} style="width:{{ width }};height:{{ height }};"></div>
+<div {{ attributes }} {{ content_attributes }} style="{% if width is not empty %}width:{{ width }}px;{% endif %}{% if height is not empty %}height:{{ height }}px;{% endif %}"></div>