1

I am trying to combine the line chart with the stacked bar chart using jqplot js. But, when I try separately both of them working fine. But, I don't know how to combine the both.

Please kindly check the below Screenshot. I need the output exactly same as like this.

https://i.stack.imgur.com/p8QiA.jpg

The code I've tried 

$(document).ready(function(){
              var line1 = [[2000, 7], [2001, 9], [2002, 15], 
              [2003, 12], [2004, 3], [2005, 6], [2006, 18]];
              var line2 = [[2000, 7], [2001, 9], [2002, 15], 
              [2003, 12], [2004, 3], [2005, 6], [2006, 18]];
              var line3 = [ 28, 13, 54, 47, 16, 14, 23];

              var plot2 = $.jqplot('win', [line1, line2, line3], {
                stackSeries: true,
                animate: true,
                series:[{renderer:$.jqplot.BarRenderer}, {xaxis:'x2axis', yaxis:'y2axis'}],
                axesDefaults: {
                    tickRenderer: $.jqplot.CanvasAxisTickRenderer ,
                    tickOptions: {
                      angle: 30
                    }
                },
                axes: {
                  xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer
                  },
                  x2axis: {
                    renderer: $.jqplot.CategoryAxisRenderer
                  },
                  yaxis: {
                    autoscale:true
                  },
                  y2axis: {
                    autoscale:true
                  }
                }
              });
            });

Please kindly help me to achieve this.

Thanks in advance.

Mohamed Ismail
  • 13
  • 5
  • 1
    What did you try so far? – Ahmad Oct 21 '13 at 07:22
  • I've checked the below link [StackOverflow Example](http://stackoverflow.com/questions/10727285/combined-line-and-bar-w-jqplot) [JSFiddle Reference](http://jsfiddle.net/Boro/ZbHsD/) I tried to integrate but, I'm unable to. – Mohamed Ismail Oct 21 '13 at 07:34
  • 1
    Please see example #3 on [this page](http://www.jqplot.com/tests/rotated-tick-labels.php) – AnthonyLeGovic Oct 21 '13 at 08:38
  • @AnthonyLeGovic Thank you for your reply. But I've tried this one already. I'm unable to make the stacked bar chart like the 3rd Example in the following link [Stacked Bar Chart](http://www.jqplot.com/tests/bar-charts.php). I need the Stacked bar chart combined with line Chart. Please kindly help me to solve this issue. – Mohamed Ismail Oct 21 '13 at 09:08
  • @AnthonyLeGovic - Please check the code, what I've tried so far. – Mohamed Ismail Oct 21 '13 at 09:20
  • @user1828706 in your example code, how do you want to use line3? Your question is lacking detail. – Ben Smith Oct 21 '13 at 22:39
  • @Fresh I've added the screenshot above. Please check that one. I needed the chart exactly same as in the screenshot. – Mohamed Ismail Oct 22 '13 at 04:25

0 Answers0