Jump to content
JChartFX Community

danibert1

Members
 View Profile  See their activity

  • Posts

    4

  • Joined

  • Last visited

 Content Type 

Posts posted by danibert1

  3. Conditional Question

    in General Questions

    Posted

     Hi,

     in the following script, I have 2 line charts and a condition to change the line color. 
    How can I apply the condition to only one of the lines and leave the other one untouched?

    <!DOCTYPE html>
    <html>
    <head>
      <title>Using Conditional Attributes</title>  
       <link rel="stylesheet" type="text/css" href="http://www.jchartfx.com/libs/v7/current/styles/jchartfx.css"/>
      
    <style type="text/css">
    #chart .SpecialCondition { stroke: #FF0040; }
    #chart .SpecialConditionLine { stroke: #FF0040; }
    </style>
      
    <script type="text/javascript" src="'>http://www.jchartfx.com/libs/v7/current/js/jchartfx.system.js"></script>
    <script type="text/javascript" src="'>http://www.jchartfx.com/libs/v7/current/js/jchartfx.coreVector.js"></script>  
    <script type="text/javascript" src="'>http://www.jchartfx.com/libs/v7/current/js/jchartfx.advanced.js"></script>  
    <script type="text/javascript">
       window.onload = function () {
     onLoadDoc();
    }

    var chart1;
     
     
    function onLoadDoc() {
     chart1 = new cfx.Chart();

     var axisY = chart1.getAxisY();
        axisY.setMin(500);
        axisY.setMax(2000);

      chart1.getData().setSeries(2);
      var series1 = chart1.getSeries().getItem(0);
      var series2 = chart1.getSeries().getItem(1);

        var conditional = new cfx.ConditionalAttributes();
        var condition = conditional.getCondition();
        condition.setFrom(1000);
        condition.setTo(1400);
        conditional.setText("Important");
        conditional.setTag("SpecialCondition");
        chart1.getConditionalAttributes().add(conditional);

     var data = [
      { "a": "1", "a": 1300, "b": 800 },
      { "a": "2", "a": 1900, "b": 900 },
      { "a": "3", "a": 1900, "b": 1350 }, 
      { "a": "4", "a": 1700, "b": 1500},
      { "a": "5", "a": 750, "b": 999 },    
     ];
        chart1.setDataSource(data);
     
     var chartDiv = document.getElementById('ChartDiv1');
     chart1.create(chartDiv);
    }
    </script>
    </head>
    <body>
    <div id="ChartDiv1" style="width:500px;height:375px;display:inline-block"></div>
    </body>
    </html>

     

     Thank you very much for all hints 

    post-2107-1393974354458_thumb.gif

×
×
  • Create New...