With pie charts, we can do something more informative by displaying another pie chart side by side for the comparison of data. This can be done by simply specifying two series configurations in the series array.

We continue to use the previous example for the chart on the left-hand side and we create a new category series from the same dataset, but grouped by platforms this time. The following is the series configuration for doing so:

      series: [{
        center: [ '25%', '50%' ],
        data: [ [ 'Nintendo', 54030288 ], 
            [ 'Electronic Arts', 31367739 ], 
            .... ]
      }, {
        center: [ '75%', '50%' ],
        dataLabels: {
          formatter: function() {
            var str = this.point.name + ': ' + Highcharts.numberFormat(this.percentage, 0) + '%';
            return formatWithLineBreaks(str);
          }
        },
        data: [ [ 'Xbox', 80627548 ], 
            [ 'PS3', 64788830 ], 
            . . . ] ]
      }]

As we can see, we use a new option, center, to position the pie chart. The option contains an array of two percentage values— the first is the ratio of the "x" position to the whole container width, whereas the second percentage value is the "y" ratio. The default value is ['50%', '50%'], which is in the middle of the container. In this example, we specify the first percentage values to '25%' and '75%', which are in the middle of the left- and the right-hand side halves respectively.

In the second series, we will choose to display the pie chart with percentage data labels instead of unit values. The following is the screenshot of a chart with double pies:

On the surface, this is not much different to plotting two separate pie charts in an individual <div> tag, apart from sharing the same title. The main benefit is that we can combine different series type presentations under the same chart. For instance, we want to present the distribution in ratio in pie series directly above each group of multiple column series. We will learn how to do this later in the chapter.