Need help plotting chart

Share RGraph:   Share or Like RGraph on Facebook!

« 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 wabajwa89@gmail.com on 8th November 2016
Hi,
I want to make a complex calculations i.e to make a graph of magnitude by using real and imaginary values.
So, can you help me how can i do it.
THanks
Posted by Richard on 8th November 2016
Hi there,

Given that you've told me very little - probably not. Make your calculations before you plot the chart - and then use the results to create the chart.



Richard
Posted by WAB on 9th November 2016
<!DOCTYPE html >
<html>
<head>
    
     <script src="new.js"></script>
     <script src="www.rgraph.net/libraries/RGraph.common.core.js\" ></script>
     <script src="www.rgraph.net/libraries/RGraph.common.csv.js\" ></script>
     <script src="www.rgraph.net/libraries/RGraph.common.dynamic.js\" ></script>
     <script src="www.rgraph.net/libraries/RGraph.common.tooltips.js\" ></script>
     <script src="www.rgraph.net/libraries/RGraph.line.js\" ></script>
    
     <title>RGraph CSV data line chart</title>
    
     <meta name="robots" content="noindex,nofollow" />
     <meta name="description" content="A Line chart" />
     
</head>
<body>
     <div style="display: none" id="myData">
  <canvas id="cvs" width="900" height="350">[No canvas support]</canvas> </div>
 
  <script>new RGraph.CSV('id:myData', function (csv)
         {
      var S11Real=[ 0.020180869,
0.076769722,
0.158682648,
/*0.249837894,
0.332117498,
0.388486758,
0.405658248,
0.375893016,
0.297781091,
0.176066766,
0.020719825,
-0.154486149,
-0.333632456,
-0.500341719,
-0.639326271,
-0.737695083,
-0.785953411,
-0.778665026,
-0.714772534,
-0.597587985,
-0.434481613,
-0.236305676,
-0.016600065,
0.209367793,
0.425668306,
0.61681863,
0.768867683,
0.870392412,
0.913338195,
0.89365007,
0.811642808,
0.672076424,
0.483922947,
0.25982078,
0.015255194,
-0.232495359,
-0.46558171,
-0.666874686,
-0.82124639,
-0.916740684,
-0.945537841,*/
];
var S11Imaginary=[
0.067554591,
0.117156377,
0.134184249,
/*0.109954669,
0.043093439,
-0.060492282,
-0.188868822,
-0.326157405,
-0.454964126,
-0.558727284,
-0.623674109,
-0.640215131,
-0.603726043,
-0.514749853,
-0.378702137,
-0.20518555,
-0.007023892,
0.200878822,
0.402758663,
0.583207037,
0.728307796,
0.826634253,
0.870054852,
0.854307438,
0.779313361,
0.649215215,
0.472135336,
0.25966463,
0.0261122,
-0.212445676,
-0.43926652,
-0.638109861,
-0.794408319,
-0.896357163,
-0.935831164,
-0.909067785,
-0.817049526,
-0.665548149,
-0.464818102,
-0.228945676,
0.025103565,*/
];
var S11Mag[]=new Array[];


for(var k=0;k<41;k++){
S11Mag[k]= Math.sqrt(Math.pow(S11Real[k],2)+Math.pow(S11Imaginary[k],2));
}

var line = new RGraph.Line({
             id: 'cvs',
             data: data,
             options: {
                 labels: [
                     '1', '2',
                     '3', '4',
                     'May', 'Jun',
                     'Jul', 'Aug',
                     'Sep', 'Oct',
                     'Nov', 'Dec'
                 ],
                 gutterLeft: 35
             }
         }).draw();



       new RGraph.CSV('id:myData', function (csv)
        
                
                 RGraph.tooltips.style.textAlign = 'left';
                 RGraph.tooltips.style.backgroundColor = 'rgba(255,255,255,0.75)';
                 RGraph.tooltips.style.border = '2px solid blue';
             })

             new RGraph.Line({
                 id: 'cvs',
                 data: data,
                 options: {
                     linewidth: 2,
                     backgroundGridVlines: false,
                     backgroundGridBorder: false,
                     backgroundGridAutofitNumhlines: 4,
                     noaxes: true,
                     ymax: 110,
                     ymin: 70,
                     tickmarks: false,
                     shadow: false,
                     ylabelsCount: 4,
                     gutterLeft: 50,
                     gutterRight: 50,
                     colors: ['#7CB5EC'],
                     title: 'Example',
                     titleYaxis: 'Y-Axis',
                     titleYaxisPos: 0.15,
                     titleYaxisBold: false,
                     titleYaxisSize: 10,
                     textAccessible: false,
                     tooltips: tooltips,
                     highlightStyle: 'halo',
                     labels: [
                         '','','Jan `15',
                         '','','Apr `15',
                         '','','Jul `15',
                         '','','Oct `15',
                         '','','Jan `16',
                         '','','Apr `16',
                         '','','Jul `16',
                         '','','Sep `16'
                     ]
                 }
             }).trace();
         });
     </script>
</body>
</html>
Posted by WAB on 9th November 2016
This is what i am doing.. but can't able to get the results. on the page nothing is showing. can someone help that how can i show the results.
thanks
Posted by Richard on 9th November 2016
Hi there,

Well first of all, put the libraries on your own server and update the <script> tags. Put the files in the samw place as your new.js file and change the tags to this:

<script src="RGraph.common.core.js" ></script>
<script src="RGraph.common.csv.js" ></script>
<script src="RGraph.common.dynamic.js" ></script>
<script src="RGraph.common.tooltips.js" ></script>
<script src="RGraph.line.js" ></script>

And secondly, check your console for the error message. In Google Chrome you can press CTRL=SHIFT+J That will bring up the console and show you any error message.



Richard

Add a reply




« Back to message list