title: Create graph in tooltip of highchart
body: <p>Have some data to display as column in highchart. The data is about registrations per month in columns. </p>
  
  <p>Following is the link for jsfiddle: 
  <a href="http://jsfiddle.net/CkkbF/161/" rel="nofollow">http://jsfiddle.net/CkkbF/161/</a>
  In each tooltip of graph want to show another column chart. </p>
  
  <pre><code>$(function () {
      // Registrations Data
      var data ={10:{"Morning":2,"Afternoon":3,"Night":5},//Jan
          12:{"Morning":2,"Afternoon":5,"Night":5},//Feb
          15:{"Morning":5,"Afternoon":3,"Night":7},//Mar
          17:{"Morning":8,"Afternoon":3,"Night":6},//Apr
          18:{"Morning":2,"Afternoon":3,"Night":13}, //May
          22:{"Morning":12,"Afternoon":3,"Night":7},//June
          15:{"Morning":2,"Afternoon":8,"Night":5},//July
          27:{"Morning":12,"Afternoon":11,"Night":4},//Aug
          17:{"Morning":2,"Afternoon":5,"Night":10},//Sep
          10:{"Morning":2,"Afternoon":3,"Night":5},//Oct
          14:{"Morning":2,"Afternoon":4,"Night":8},Nov
          24:{"Morning":12,"Afternoon":7,"Night":5},DEc
      }
      var series_data=[]
  
      for (key in data) {series_data.push(parseInt(key))}
  
      var chart = new Highcharts.Chart({
          chart: {
              renderTo: 'container',
              type: 'column'
          },
          xAxis: {
              categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
                  },
  
          series: [{
              data: series_data   
          }]
      });
  });
  </code></pre>
  
  <p>E.g. In above jsfiddle example<br>
  So on hover of Column associated with January data , it should show another column highchart in tooltip {"Morning":2,"Afternoon":3,"Night":5}.
  i.e. In morning 2, Afternoon 3 and Night 5 registrations. </p>
  
  <p>Any help how to achieve this. </p>