 
(function(){



var series = [{"name":"2012 Q1", "y": 97.1 },{"name":"2012 Q2", "y": 97.1 },{"name":"2012 Q3", "y": 97.4 },{"name":"2012 Q4", "y": 97.6 },{"name":"2013 Q1", "y": 97.6 },{"name":"2013 Q2", "y": 97.4 },{"name":"2013 Q3", "y": 98.3 },{"name":"2013 Q4", "y": 99.4 },{"name":"2014 Q1", "y": 99.8 },{"name":"2014 Q2", "y": 100.2 },{"name":"2014 Q3", "y": 100.0 },{"name":"2014 Q4", "y": 98.9 },{"name":"2015 Q1", "y": 99.2 },{"name":"2015 Q2", "y": 99.6 },{"name":"2015 Q3", "y": 100.1 },{"name":"2015 Q4", "y": 101.1 },{"name":"2016 Q1", "y": 101.6 },{"name":"2016 Q2", "y": 101.4 },{"name":"2016 Q3", "y": 101.6 },{"name":"2016 Q4", "y": 101.9 },{"name":"2017 Q1", "y": 106.1 },{"name":"2017 Q2", "y": 106.4 },{"name":"2017 Q3", "y": 108.7 },{"name":"2017 Q4", "y": 107.7 },{"name":"2018 Q1", "y": 108.2 },{"name":"2018 Q2", "y": 108.9 },{"name":"2018 Q3", "y": 108.3 },{"name":"2018 Q4", "y": 106.6 },{"name":"2019 Q1", "y": 106.4 },{"name":"2019 Q2", "y": 106.0 },{"name":"2019 Q3", "y": 105.2 },{"name":"2019 Q4", "y": 104.5 },{"name":"2020 Q1", "y": 104.2 },{"name":"2020 Q2", "y": 102.5 },{"name":"2020 Q3", "y": 101.8 },{"name":"2020 Q4", "y": 102.9 },{"name":"2021 Q1", "y": 102.5 },{"name":"2021 Q2", "y": 103.3 },{"name":"2021 Q3", "y": 106.0 },{"name":"2021 Q4", "y": 106.9 },{"name":"2022 Q1", "y": 107.0 },{"name":"2022 Q2", "y": 110.4 },{"name":"2022 Q3", "y": 111.9 },{"name":"2022 Q4", "y": 113.3 },{"name":"2023 Q1", "y": 113.4 },{"name":"2023 Q2", "y": 118.4 },{"name":"2023 Q3", "y": 118.4 },{"name":"2023 Q4", "y": 118.9 },]

var description = {"title":"SPPI INDEX OUTPUT DOMESTIC - N81 Services to buildings and landscape 2015=100","contact":{"email":"business.prices@ons.gov.uk","name":"Pete Bailey","telephone":"+44 1633 456907"},"releaseDate":"2024-01-17T00:00:00.000Z","nextRelease":"17 April 2024","datasetId":"SPPI","datasetUri":"/economy/inflationandpriceindices/datasets/serviceproducerpriceindices","cdid":"I2AB","unit":"","preUnit":"","source":"","date":"2023 Q4","number":"118.9","sampleSize":"0"};
var linechart = {
   chart: {
     type: 'line',
     marginRight: 16,
    
    events: {
        load: function () {
            var chart = this,
                yAxis = chart.yAxis[0],
                tp = yAxis.tickPositions,
                firstLabel = yAxis.ticks[tp[0]].label.getBBox().width,
                lastLabel = yAxis.ticks[tp[tp.length - 1]].label.getBBox().width,
                bb = yAxis.axisTitle.getBBox();
            yAxis.update({
                title: {
                offset: -bb.width + (firstLabel > lastLabel ? firstLabel : lastLabel)
            }
            });
        }
    }
   },
   colors: ['#007dc3', '#409ed2', '#7fbee1', '#007dc3', '#409ed2', '#7fbee1'],

   title: {
     text: description.title
   },
   subtitle: {
     text: 'Source: ' + description.source,
     floating: true,
     align: 'right',
     x: 0,
     verticalAlign: 'bottom',
     y: 10
   },
   navigation: {
     buttonOptions: {
       enabled: false
     }
   },
   xAxis: {
     categories: ["2012 Q1","2012 Q2","2012 Q3","2012 Q4","2013 Q1","2013 Q2","2013 Q3","2013 Q4","2014 Q1","2014 Q2","2014 Q3","2014 Q4","2015 Q1","2015 Q2","2015 Q3","2015 Q4","2016 Q1","2016 Q2","2016 Q3","2016 Q4","2017 Q1","2017 Q2","2017 Q3","2017 Q4","2018 Q1","2018 Q2","2018 Q3","2018 Q4","2019 Q1","2019 Q2","2019 Q3","2019 Q4","2020 Q1","2020 Q2","2020 Q3","2020 Q4","2021 Q1","2021 Q2","2021 Q3","2021 Q4","2022 Q1","2022 Q2","2022 Q3","2022 Q4","2023 Q1","2023 Q2","2023 Q3","2023 Q4",],
      tickPositioner: function () {
       var positions = [];
       var increment = Math.ceil(((this.dataMax) - (this.dataMin)) / 16);
       var tick = Math.floor(this.dataMin);
       for (tick; tick < this.dataMax; tick += increment) {
         positions.push(tick);
       }
       //prevent last tick label overlap the last data in the array if too close
       var diff = tick - this.dataMax;
       if(diff >= (increment /2) ) {
        var deleted = positions.pop();
       }

       positions.push(this.dataMax);
       return positions;
     },
     labels: {
        formatter: function() {
          var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
          var response = '';
          if (w < 768) {
            if (this.isFirst) {
              count = 0;
            }
            if (count % 4 === 0 || this.isLast) {
              response = this.value;
            }
            count++;
          } else {
            response = this.value;
          }
          return response;
        }
     },
     tickmarkPlacement: 'on'
   },
   yAxis: {
     title: {
        text: " " + " ",
       align: 'high',
       rotation: 360,
       x: -15,
       y: -10
     },
    labels: {
      format: '{value:,f}'
    }
   },

   credits: {
     enabled: false
   },

    annotationsOptions: {
        enabledButtons: false
    },

   plotOptions: {
     series: {
       turboThreshold:0,
       shadow: false,
       states: {
         hover: {
           enabled: true,
           shadow: false,
           lineWidth: 3,
           lineWidthPlus: 0,
           marker: {
             height: 0,
             width: 0,
             halo: false,
             enabled: true,
             fillColor: null,
             radiusPlus: null,
             lineWidth: 3,
             lineWidthPlus: 0
           }
         }
       }
     }
   },
   tooltip: {
     shared: true,
     width: '150px',
     crosshairs: {
       width: 2,
       color: '#f37121'
     },
     positioner: function(labelWidth, labelHeight, point) {
       var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
       var points = {
         x: 30,
         y: 42
       };
       var tooltipX, tooltipY;
       var chart = Highcharts.charts[Highcharts.charts.length - 1];
       if (w > 768) {

         if (point.plotX + labelWidth > chart.plotWidth) {
           tooltipX = point.plotX + chart.plotLeft - labelWidth - 20;
           $("#custom-tooltip").removeClass('tooltip-left');
         } else {
           tooltipX = point.plotX + chart.plotLeft + 20;
           $("#custom-tooltip").removeClass('tooltip-right');
         }

         tooltipY = 50;
         points = {
           x: tooltipX,
           y: tooltipY
         };
       } else {
         $("#custom-tooltip").removeClass('tooltip-left');
         $("#custom-tooltip").removeClass('tooltip-right');
       }

       return points;
     },

     formatter: function() {
       var id1 = '<div id="custom-tooltip" class="tooltip-left tooltip-right">';
       var block = id1 + "<div class='sidebar' >";
       var title = '<b class="title">' + this.points[0].key + ': </b>';
       var symbol = ['<div class="circle">●</div>', '<div class="square">■</div>', '<div class="diamond">♦</div>', '<div class="triangle">▲</div>', '<div class="triangle">▼</div>'];

       var content = block;

       // symbols
       $.each(this.points, function(i, val) {
         content += symbol[i];
       });

       content += "<br/></div>";
       content += "<div class='maintext maintext__fixed-width'>";
       content += title;

       // series names and values
       $.each(this.points, function(i, val) {
         content += '<div class="tiptext">' + val.point.series.chart.series[i].name + "<br/><b>Value: " + val.point.series.chart.series[i].options.preUnit + numberWithCommas(val.y) + " " + val.point.series.chart.series[i].options.unit + '</b></div>';
       });
       content += "</div>";
       return content;
     },

     backgroundColor: 'rgba(255, 255, 255, 0)',
     borderWidth: 0,
     borderColor: 'rgba(255, 255, 255, 0)',
     shadow: false,
     useHTML: true

   },
   series: [{
     name: description.title,
     id: description.id,
     unit: description.unit,
     preUnit: description.preUnit,
     data: series,
     marker: {
       enabled:true,
       radius:2,
       symbol: "circle",
       states: {
         hover: {
           fillColor: '#007dc3',
           radiusPlus: 0,
           lineWidthPlus: 0
         }
       }
     },
     dashStyle: 'Solid'
   }]
 };

if(!description.isIndex) {
  var min;
  for(i = 0; i<series.length; i++) {
   min = min ? Math.min(min, series[i].y) : series[i].y;
  }
       
  if(min > 0) {
   linechart.yAxis.min = 0;
  } else {
   linechart.yAxis.min = min - 1;
  }

 };


    function numberWithCommas(number) {
    var parts = number.toString().split(".");
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    return parts.join(".");
    }

window.linechart = linechart;
return linechart;


 })()