ail-framework/var/www/modules/trendingcharts/templates/trending_graphs/Protocolstrending.html

<div class="row">
    <div class="col-lg-12">
        <div class="row">
            <div class="col-lg-6">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <i id="flash-scheme" class="glyphicon glyphicon-flash " flash-scheme=""></i> Top Progression for the last 5 days
                    </div>
                    <div class="panel-body">
                        <div class="col-lg-12">
                            <div class="flot-chart-content pull-right" id='tooltip_graph1-scheme' align="right">No bar hovered</div>
                        </div>
                        <div class="row">
                            <div class="flot-chart-content col-lg-3" id="flot-pie-chart1-scheme" style="height:250px; width:48%;"></div>
                            <div class="flot-chart-content col-lg-3" id="flot-bar-chart1-scheme" style="height:250px; width:48%; margin:5px;"><div class="alert alert-info">Click on a part</div></div>
                        </div>
                        <!-- /.row -->
                    </div>
                    <!-- /.panel-body -->
                </div>
            </div>
            <!-- /.panel -->
            <div class="col-lg-6">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <i id="flash-scheme" class="glyphicon glyphicon-flash " flash-scheme=""></i> Top Progression for the last 15 days
                    </div>
                    <div class="panel-body">
                        <div class="col-lg-12">
                            <div class="flot-chart-content pull-right" id='tooltip_graph2-scheme' align="right">No bar hovered</div>
                        </div>
                        <div class="">
                            <div class="flot-chart-content col-lg-3" id="flot-bar-chart2-scheme" style="height:250px; width:100%; margin:5px;"><div class="alert alert-info">Click on a part</div></div>
                        </div>
                        <!-- /.row -->
                    </div>
                   <!-- /.panel-body -->
                </div>
            </div>
        </div>
        <!-- /.panel -->
    </div>
</div>


<div class="panel panel-default">
    <div class="panel-heading">
        <i class="fa fa-bar-chart-o fa-fw"></i> Protocols Trend
        <div class="pull-right">
            <div class="btn-group">
                <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
                    Actions
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu pull-right" role="menu">
                    <li><a href="#" id="linear">Linear Scale</a>
                    </li>
                    <li><a href="#" id="log">Log Scale</a>
                    </li>
                    <li><a href="#" id="unzoom" onclick="unzoomGraph()">Unzoom</a>
                    </li>
                    <li class="divider"></li>
                    <li><a href="#" id="edit_graph">Edit graph words</a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="btn-group btn-group-xs pull-right" style="margin-right: 5px;">
            <button type="button" class="btn btn-primary" onclick="take_top(5);">5</button>
            <button type="button" class="btn btn-primary" onclick="take_top(10);">10</button>
            <button type="button" class="btn btn-primary" onclick="take_top(15);">15</button>
        </div>

    </div>
    <!-- /.panel-heading -->
      <div class="panel-body">
         <!-- <div id="ProtocolsTrending" style="width:100%;"></div> -->
          <div id="ProtocolTrending" style="width:100%; height:800px;"></div>
      </div>
    <!-- /.panel-body -->
</div>