HOME
PDF

Javascript examples

Nasser M. Abbasi

July 1, 2015 page compiled on July 1, 2015 at 7:47pm

1 XY plot using flot library

This shows how to make a plot of a sin(x)  function. The library used is http://www.flotcharts.org/

Click on ex1.htm to see the output. The source code is

  <html lang="en">
  <head>
  <title>
    Simple Javascript example 1
  </title>
      <meta charset="UTF-8">
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <title>Flot Examples: Basic Options</title>
   <script language="javascript" type="text/javascript" src="/scripts/flot/jquery.js"></script>
   <script language="javascript" type="text/javascript" src="/scripts/flot/jquery.flot.js"></script>
   <script type="text/javascript">
  
   $(function() {
      var options = {
             series: {
                lines: { show: true, fill: false, lineWidth:1},
                points: { show: false },
                color:"rgb(0, 0, 0)"
                     }
      };
   var data = [];
   for (var i = -2*Math.PI; i < 2*Math.PI; i += Math.PI/10) {
   data.push([i, Math.sin(i)]);
   }
   $.plot("#plot", [data], options);
   $("#footer").prepend("Flot " + $.plot.version + " &ndash; ");
   });
  
   </script>
  </head>
  <body>
  Example showing how to plot a sin function using flot library.
  
    <div id="plot" style="width:400px;height:300px"></div>
  
  </body>
  </html>