individual point settings in a scatter/line plot - Javascript highcharts

Javascript examples for highcharts:Line Chart

  1. HOME
  2. Javascript
  3. highcharts
  4. Line Chart

Description

individual point settings in a scatter/line plot

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
      <script type="text/javascript">
$(function () {/*from   w  w  w . j ava 2  s  . co m*/
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container'
            },
          tooltip: {
            formatter: function() {
              if(this.x === 3)
              {
                return 'The value for <b>'+ this.x +
                    '</b> is <b>'+ this.y +'</b>';
              }
              else
              {
                return false;
              }
            }
          },
            series: [{
                type: 'line',
              data: [[1,1], [2,3], [3.9, null],
                     {x:4,y:4,marker:{enabled:false}}, [4.1, null],
            [6,1], [7, 3]]
            }]
        });
    });
});

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <script src="https://code.highcharts.com/modules/exporting.js"></script> 
      <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>  
   </body>
</html>

Related Tutorials