Chart not showing in JSP page


« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Basavaraj on 13th April 2016
Hello I am trying to create two chart in one jsp page. But only one canvas is displaying correctly other one is not displaying as we expected.


<canvas id="cvs" width="500" height="250">
     [No canvas support]
</canvas>

<canvas id="cvs1" width="500" height="250">
     [No canvas support]
</canvas>


<script>

     window.onload = function ()
     {
      var Pending_SCS_Review="<%=Pending_SCS_Review%>";
      var Under_SCS_Review="<%=Under_SCS_Review%>";
      var Complete="<%=Complete%>";
      var Legal_Review="<%=Legal_Review%>";
         var data = [Pending_SCS_Review,Under_SCS_Review,Complete,Legal_Review];
       

         var bar = new RGraph.Bar({
             id: 'cvs',
             data: data,
             options: {
                 backgroundGridAutofitNumvlines: 0,
                 linewidth: 0,
                 shadow: false,
                 hmargin: 10,
                 colors: ['Gradient(pink:red:#f33)', 'Gradient(green:#0f0)'],
                 title: 'A basic graph with charts in tooltips',
                 labels: ['Pending_SCS_Review','Under_SCS_Review','Complete','Legal_Review'],
                
                 textSize:7,
                 clearto: 'white',
                 variant: '3d',
                 gutterBottom: 90
             }
         }).wave({frames: 60});
        
        
         var vsopInDev="<%=vsopInDev%>";
         var vsopInShow="<%=vsopInShow%>";
         var vsopInPOHold="<%=vsopInPOHold%>";
         var vsopSignOff="<%=vsopSignOff%>";
         var vsopInProduction="<%=vsopInProduction%>";
        
         var data= [vsopInDev,vsopInShow,vsopInPOHold,vsopSignOff,vsopInProduction];
         var pie = new RGraph.Pie({
             id: 'cvs1',
             data:data,
             options: {
                 gutterLeft: 50,
                 gutterRight: 50,
                 linewidth: 0,
                 strokestyle: 'rgba(0,0,0,0)',
                 labels: ['vsopInDev','vsopInShow','vsopInPOHold','vsopSignOff','vsopInProduction'],
                 colors: ['red','green','blue','cyan','yellow'],
                 variant: 'pie3d',
                 radius: 100,
                 labelsSticks: true,
                 labelsSticksLength: 25,
                 radius: 80,
                 shadowOffsety: 5,
                 shadowColor: '#aaa',
                 exploded: [,,20]
             }
         }).draw();
        
         };
Posted by Richard on 13th April 2016
`Hi,

Your variable assignment:

  var vsopInDev="<%=vsopInDev%>";
  var vsopInShow="<%=vsopInShow%>";
  var vsopInPOHold="<%=vsopInPOHold%>";
  var vsopSignOff="<%=vsopSignOff%>";
  var vsopInProduction="<%=vsopInProduction%>";
         
  var data= [vsopInDev,vsopInShow,vsopInPOHold,vsopSignOff,vsopInProduction];

I'll assume that they're numbers - in which case they shouldn't have quotes around them. So you could rewrite the code as this, without the quotes:


  var dev = <%=vsopInDev%>,
  var show = <%=vsopInShow%>;
  var pohold = <%=vsopInPOHold%>;
  var signoff = <%=vsopSignOff%>;
  var production = <%=vsopInProduction%>;
         
  var data= [dev, show, pohold, signoff, production];


If it still doesn't work, look at the page source in your browser to see what it looks like after the JSP variables have been put in the page.





Richard
Posted by Basavaraj on 13th April 2016
Thank You Richard it's working great.

Add a reply

 




« Back to message list
RGraph on social media