Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="https://code.highcharts.com/highcharts.src.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.src.js"></script>


<div id="container"></div>

JavaScript

(function(H) {
  var each = H.each,
    perspective = H.perspective;

  H.seriesTypes.column.prototype.translate3dShapes = function() {

    var series = this,
      chart = series.chart,
      seriesOptions = series.options,
      depth = seriesOptions.depth || 25,
      stack = seriesOptions.stacking ?
      (seriesOptions.stack || 0) :
      series.index, // #4743
      z = stack * (depth + (seriesOptions.groupZPadding || 1)),
      borderCrisp = series.borderWidth % 2 ? 0.5 : 0;

    if (chart.inverted && !series.yAxis.reversed) {
      borderCrisp *= -1;
    }

    if (seriesOptions.grouping !== false) {
      z = 0;
    }

    z += (seriesOptions.groupZPadding || 1);
    each(series.data, function(point) {
      if (point.y !== null) {
        var shapeArgs = point.shapeArgs,
          tooltipPos = point.tooltipPos,
          // Array for final shapeArgs calculation.
          // We are checking two dimensions (x and y).
          dimensions = [
            ['x', 'width'],
            ['y', 'height']
          ],
          borderlessBase; // Crisped rects can have +/- 0.5 pixels offset.

        // #3131 We need to check if column is inside plotArea.
        each(dimensions, function(d) {
          borderlessBase = shapeArgs[d[0]] - borderCrisp;
          if (borderlessBase < 0) {
            // If borderLessBase is smaller than 0, it is needed to set
            // its value to 0 or 0.5 depending on borderWidth
            // borderWidth may be even or odd.
            shapeArgs[d[1]] += shapeArgs[d[0]] + borderCrisp;
            shapeArgs[d[0]] = -borderCrisp;
            borderlessBase = 0;
          }
          if (
            borderlessBase + shapeArgs[d[1]] > series[d[0] + 'Axis'].len &&
            shapeArgs[d[1]] !== 0 // Do not change height/width of column if 0.
            // #6708
          ) {
            shapeArgs[d[1]] = series[d[0] + 'Axis'].len - shapeArgs[d[0]];
          }
          if (
            (shapeArgs[d[1]] !== 0) && // Do not...