Jump to content
JChartFX Community

indiansher

Members
  • Posts

    2
  • Joined

  • Last visited

Posts posted by indiansher

  1.  Hi,

    I am unable to get tooltips for graphs that are displayed over bootstrap modal window

    I guess this is an issue of z-index, but I am not able to figure out, how to modify the z-index of tooltip!

    Below is all the necessary reference required:

    BOOTSTRAP MODAL WINDOW REFERENCE : http://getbootstrap.com/javascript/#modals

    HTML CODE for MODAL WINDOW

        <!-- Modal -->
            <div class="modal fade" id="productModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
              <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <h4 class="modal-title" id="myModalLabel"></h4>
                  </div>
                  <div class="modal-body">
                    <div id="graph-div" style="width: 870px;height: 450px;display:inline-block;background-color: white">
                        
                    </div>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                  </div>
                </div>
              </div>
            </div>

    JAVASCRIPT FUNCTION

    function loadModalChart(data,min,max)
     {        
     	  var data=[{"CODE":"ABC","QTY":25},{"CODE":"BC","QTY":25},{"CODE":"AB","QTY":25},{"CODE":"AC","QTY":25}];	
     	  $('#graph-div').empty();
     	  var chart1;
          chart1 = new cfx.Chart();
          chart1.setDataSource(data);
          chart1.getAnimations().getLoad().setEnabled(true);		//Enable Animation
          chart1.getData().setSeries(1);
          chart1.getAxisY().setMin(min);
          chart1.getAxisY().setMax(max);
    
          var series1 = chart1.getSeries().getItem(0);
          series1.setGallery(cfx.Gallery.Lines);	
    
          var title = new cfx.TitleDockable();		
          title.setText("Sales Graph");
          chart1.getTitles().add(title);
          
          chart1.getDataGrid().setVisible(true); 
          chart1.getDataGrid().setDock(cfx.DockArea.Right);
          var divHolder = document.getElementById('graph-div');
          chart1.create(divHolder);
    
     }

     

     

    Thanks in Advance. 

    :D

×
×
  • Create New...