When the animated chart is in progress, something magic just happen!


« 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 Leo Yuan on 1st November 2013
Hi there,
   I have came across an interesting bug, the details is discribed as below.
   Suppose you have two graphs on your page, one is named "lineChart" which is drew without animation, just using `.Draw()`, and the other one is named "dynaLineChart" which is drew using `RGraph.Effects.Line.jQuery.Trace(line)`, when you refreshed your page, and in the meantime, you clicked anywhere in the page, magic happened, the first graph just disappeared!!! And clicked once more, the graph came back, How could it be?!
   The code is like below:
`html`
   <canvas id="lineChart" width="500" height="400">[No Canvas Support]</canvas>
   <canvas id="dynaLineChart" width="500" height="400">[No Canvas Support]</canvas>

`script`
<script src="../libraries/RGraph.common.core.js" ></script>
<script src="../libraries/RGraph.common.dynamic.js" ></script>
<script src="../libraries/RGraph.common.effects.js" ></script>
<script src="../libraries/RGraph.line.js" ></script>
<script src="../libraries/jquery.min.js" ></script>
<script>
   function drawLine() {
     RGraph.Reset(document.getElementById('lineChart'));
     var line = new RGraph.Line('lineChart', [84,-5,-30,-26,-45,12,84,73,60])
         .Set('labels',['Felicity','Gary','Neil','Jay','Helga','Ray','Kev','Luis','Pete'])
         .Set('colors', ['black'])
         .Set('shadow', true)
         .Set('shadow.offsetx', 1)
         .Set('shadow.offsety', 1)
         .Set('linewidth', 2)
         .Set('yaxispos', 'right')
         .Set('xaxispos', 'center')
         .Set('hmargin', 5)
         .Draw();
   }

   function drawDLine() {
     RGraph.Reset(document.getElementById('dynaLineChart'));
     var line2 = new RGraph.Line('dynaLineChart', [84,-5,-30,-26,-45,12,84,73,60])
         .Set('labels', ['Felicity','Gary','Neil','Jay','Helga','Ray','Kev','Luis','Pete'])
         .Set('colors', ['black'])
         .Set('shadow', true)
         .Set('shadow.offsetx', 1)
         .Set('shadow.offsety', 1)
         .Set('linewidth', 2)
         .Set('yaxispos', 'right')
         .Set('xaxispos', 'center')
         .Set('hmargin', 5)
     RGraph.Effects.Line.jQuery.Trace(line2);
   }

   $(function() {
     drawLine();
     drawDLine();
   });
</script>
Posted by RGraph Support on 1st November 2013
Hi there,


It's probably due to the way that the Trace effect works - which involves drawing the chart without the line and then slowly revealing the line on anothe canvas on top of it.

You could try using the Trace2 effect instead which works differently using the clip() function - so any redraws should not adversely affect the canvas.




Richard, RGraph Support
Please remember to link to the RGraph website

Help support RGraph - single site license only £99
    www.rgraph.net/license#single-site
Posted by Leo Yuan on 3rd November 2013
oh, it really helped a lot and did solve my problem.
thank you, richard.

Add a reply

 




« Back to message list
RGraph on social media