merge labels in xAxis in column chart - Javascript highcharts

Javascript examples for highcharts:Chart Axis

  1. HOME
  2. Javascript
  3. highcharts
  4. Chart Axis

Description

merge labels in xAxis in column chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Highcharts Demo</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script> 
      <script type="text/javascript">
var chart_PortfolioDetailsDistribution;
var popupChart;//w w w.j  av a 2  s .co m
$(document).ready(function () {
    chart_PortfolioDetailsDistribution = new Highcharts.Chart({
        chart:{animation:false,renderTo:'smallchart3'}
        ,title:{text:'Distribution'}
        ,tooltip:{headerFormat:'',pointFormat:'<b>{point.name}</b>: {point.y}'}
        ,legend:{enabled:false}
        ,credits:{enabled:false}
        ,plotOptions:{series:{animation:false,borderWidth:0,dataLabels:{format:'<b>{point.y}</b>'}
        ,groupPadding:0,pointPadding:0}
    }
    ,yAxis:{
        title:{text:null}
    }
    ,xAxis:{
        labels:{enabled:false,rotation:-90}
        ,title:{text:null}
        ,type:'category'
    }
    ,series:[{
        data:[['<-10%',0],['<-5%',3],['<-2.5%',3],['<-1%',2],['<0%',10],['>0%',3],['>1%',0],['>2.5%',0],['>5%',0],['>10%',0]],
        name:'Portfolio',
        type:'column'}]
    });
    popupChart = new Highcharts.Chart(Highcharts.merge(chart_PortfolioDetailsDistribution.options, {
            chart: { renderTo: 'smallchart4' },
            xAxis: [{ labels: { enabled: true }}],
            legend: { enabled: true },
            plotOptions: { series: { dataLabels: { enabled: true } }}
        }));
});

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <div id="smallchart3" style="height: 400px"></div> 
      <div id="smallchart4" style="height: 400px"></div>  
   </body>
</html>

Related Tutorials