@extends('monitoring/layout.treatment_layout') 
@section('title','BettrAi | Treatment Plan Configuration') 
@section('content')
<style type="text/css">
    #divLoadingInPopup1.tabloadershow1 {
        display: none;
        position: fixed;
        z-index: 100;
        background-image: url("{{ url('assets/images/loading-icon.gif') }}");
        opacity: 0.90;
        left: 0px;
        bottom: 0px;
        right: 0px;
        top: 50px;
        background-repeat: no-repeat;
        background-position: center center;
        background-color: white;
    }
    /* .loop_graph_tile{
        max-height: 450px;
        overflow-y: auto;
    } */
    .graph_table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 20px;
    }
    .graph_th, .graph_td {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 1px;
    }
    .graph_th {
        background-color: #ccc !important;
        padding: 0.2rem 1rem !important;
    }
    .fa-check{
        color:green;
        cursor: default !important;
    }
    .fa-times{
        color:red;
        cursor: default !important;
    }
    .grey_bg_class{
        background: #ccc !important;
    }
    .blue_bg_class{
        background: #4f72fb;
    }
    .nav_side_link{
        padding: 0.75rem 0.1rem !important;
    }
    .navi-text{
        font-size: 0.8rem !important;
    }
    .navi-icon{
        flex: 0 0 1rem !important;
    }
    .risk_status_label{
        position: absolute !important;
        top: 28% !important;
        left: 19% !important;
    }
    .table_data_details{
        display: revert !important;
    }
</style>
<script src="{{ url('/assets/js/highstock.js') }}"></script>
<script src="{{ url('/assets/js/highcharts-more.js') }}"></script>
<div class="card card-custom gutter-b mt-10 ml-12 mr-6">
    <div class="card-header py-6">
        <div class="col-lg-4 float-right mt-2">
            <div class="col-lg-12">
                <h3 class="font-size-h3 text-primary">Report | Risk Predictive Analysis</h3>
            </div>
        </div>
        <div class="col-lg-8 float-right" style="text-align: right;" align="right">
            <div class="col-lg-6 ml-0 pl-0 float-left mt-2">
                <div class="radio-inline font-weight-bold text-dark">
                    <label class="radio" style="font-size: 12px;">
                        <input type="radio" checked="checked" class="view_type" name="all_sections" value="0" onclick="show_hide_sections('graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                    <span></span></label>
                    <label class="radio" style="font-size: 12px;">
                        <input type="radio" class="view_type" value="1" name="all_sections" onclick="show_hide_sections('table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                    </label>											
                </div>
            </div>
            <div class="col-lg-6 float-right">
                <div class="col-lg-12">
                    <div class="input-group">
                        <select name="rem_period_type" id="rem_period_type" class="filter_select form-control font-weight-bolder filter_ddls" onchange="view_all_reminders('296',this.value,'bear Gonzalez')">
                            <!-- <option selected="selected" value="c">Today</option>
                            <option value="w"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">This Week</font></font></option> -->
                            <option value="m">Current Month</option>
                            <!-- <option value="p"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Previous Month</font></font></option> -->
                        </select>
                    </div>
                </div>
                <!-- <div class="col-lg-4 float-right mt-n6">
                    <div class="input-group">
                        <div class="col-lg-2 col-sm-2 col-sm-2 mr-10">
                            <a href="javascript:void(0)" title="" data-toggle="tooltip" onclick="send_sms_popup()" data-original-title="Send Text">
                            <i class="flaticon-graph icon-xl"></i></a>
                        </div>
                        <div class="col-lg-2 col-sm-2 col-sm-2">
                            <a href="javascript:void(0)" title="" data-toggle="tooltip" onclick="send_sms_popup()" data-original-title="Send Text">
                            <i class="fa fa-share-alt icon-xl"></i></a>
                        </div>
                    </div>
                </div> -->
            </div>
        </div>
    </div>
    <!--end::Body-->
</div>

<div class="d-flex flex-row mt-2 mb-20 mx-5">
    <!-- <div class="flex-row-auto offcanvas-mobile w-200px w-xxl-275px" id="kt_inbox_aside">
        <div class="card card-custom card-stretch">
            <div class="card-body px-5">
                <ul class="navi">
                    <li class="navi-item">
                        <a class="navi-link nav_side_link">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Account Clinical Monitoring</span>
                        </a>
                    </li>
                    <li class="navi-item">
                        <a class="navi-link nav_side_link" href="#">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Clinical Nurse Monitoring</span>
                        </a>
                    </li>
                    <li class="navi-item">
                        <a class="navi-link nav_side_link" href="#">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Risk Distribution Histogram</span>
                        </a>
                    </li>
                </ul>
                <div class="separator separator-dashed mt-5 mb-8"></div>
                <a href="#" class="btn btn-outline-primary">Add Comparison <i class="icon-1x text-dark-50 flaticon2-plus"></i></a>
            </div>
        </div>
    </div> -->
    <!--end::Aside-->
    <!--begin::List-->
    <div class="flex-row-fluid ml-lg-8 d-block" id="kt_inbox_list">
        <!--begin::Card-->
        <div class="card card-custom card-stretch">
            <!--begin::Header-->
            <!--end::Header-->
            <!--begin::Body-->
            <div class="card-body table-responsive px-0" style="overflow: hidden;">
                <div class="row">
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-5">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Risk Distribution Histogram</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                            <input type="radio" checked="checked" class="view_type" name="riskdis_sections" value="0" onclick="show_hide_indisections('riskdistribution','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                            <input type="radio" class="view_type" name="riskdis_sections" value="1" name="loop_view_type" onclick="show_hide_indisections('riskdistribution','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>	
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="riskdistribution_graph_btn" type="button" onclick="riskdistribution_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="riskdistribution_graph" class="graph_section">
                                </div>
                                <div id="riskdistribution_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Contributing Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Admissions For CHF(1M)</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Decrease in Medication Adherence</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">No. of changes in Medication Regimen at Discharge</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Level of Caregiver Support</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-5">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Medical Adherence</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" checked="checked" name="riskdis_sections" class="view_type" value="0" onclick="show_hide_indisections('mediadherence','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskdis_sections" class="view_type" value="1" onclick="show_hide_indisections('mediadherence','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="mediadherence_graph_btn" type="button" onclick="mediadherence_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="mediadherence_graph" class="graph_section">
                                </div>
                                <div id="mediadherence_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <tbody>
                                            <tr>
                                                <td class="blue_bg_class">RxPense</td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                            </tr>
                                            <tr>
                                                <td class="blue_bg_class">Spencer</td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                            </tr>
                                            <tr>
                                                <td class="blue_bg_class">Karie</td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                            </tr>
                                            <tr>
                                                <td class="blue_bg_class">Hero</td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                            </tr>
                                            <tr>
                                                <td class="blue_bg_class">Livi</td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                            </tr>
                                            <tr>
                                                <td class="blue_bg_class">Philips</td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-check" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                                <td class="graph_td"><i class="fa fa-times" aria-hidden="true"></i></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-5">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Hospitalization History</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                            <input type="radio" name="riskhospital_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('hospitalization','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                            <input type="radio" name="riskhospital_sections" class="view_type" value="1" onclick="show_hide_indisections('hospitalization','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="hospitalization_graph_btn" type="button" onclick="hospitalization_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="hospitalization_graph" class="graph_section">
                                </div>
                                <div id="hospitalization_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Patient Name</th>
                                                <th class="graph_th">Emergency Room Visits</th>
                                                <th class="graph_th">Hospitalization</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Alfred Futterkisle</td>
                                                <td class="graph_td">20</td>
                                                <td class="graph_td">2</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Centro Commercial Moctezuma</td>
                                                <td class="graph_td">13</td>
                                                <td class="graph_td">3</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Emst Handel</td>
                                                <td class="graph_td">10</td>
                                                <td class="graph_td">1</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Island Trading</td>
                                                <td class="graph_td">14</td>
                                                <td class="graph_td">0</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Laughing Bacchus Winecellars</td>
                                                <td class="graph_td">18</td>
                                                <td class="graph_td">6</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Magazzini Riuniti</td>
                                                <td class="graph_td">16</td>
                                                <td class="graph_td">4</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-5">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Healthcare Cost By Patients</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskhealth_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('healthcarecost','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskhealth_sections" class="view_type" value="1" onclick="show_hide_indisections('healthcarecost','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="healthcarecost_graph_btn" type="button" onclick="healthcarecost_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="healthcarecost_graph" class="graph_section">
                                </div>
                                <div id="healthcarecost_table" class="table_section" style="display:none;">
                                <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Patient Name</th>
                                                <th class="graph_th">Medication Cost</th>
                                                <th class="graph_th">Hospitalization Cost</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Alfred Futterkisle</td>
                                                <td class="graph_td">2000</td>
                                                <td class="graph_td">200</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Centro Commercial Moctezuma</td>
                                                <td class="graph_td">1003</td>
                                                <td class="graph_td">300</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Emst Handel</td>
                                                <td class="graph_td">13340</td>
                                                <td class="graph_td">166</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Island Trading</td>
                                                <td class="graph_td">12343</td>
                                                <td class="graph_td">1999</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Laughing Bacchus Winecellars</td>
                                                <td class="graph_td">1846</td>
                                                <td class="graph_td">656</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Magazzini Riuniti</td>
                                                <td class="graph_td">1689</td>
                                                <td class="graph_td">429</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Risk Stratification Score</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="risksatisfy_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('risksatisfycon','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="risksatisfy_sections" class="view_type" value="1" onclick="show_hide_indisections('risksatisfycon','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                </div>
                                <div id="risksatisfycon_graph" class="graph_section" style="height:420px !important;">
                                    <canvas id="risksatisfy_graph"></canvas>
                                </div>
                                <div id="risksatisfycon_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Program</th>
                                                <th class="graph_th">Risk Stratification Score</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">RPM</td>
                                                <td class="graph_td">70</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">RTM</td>
                                                <td class="graph_td">65</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">CCM</td>
                                                <td class="graph_td">58</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">PCM</td>
                                                <td class="graph_td">73</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">TCM</td>
                                                <td class="graph_td">54</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">BHI</td>
                                                <td class="graph_td">67</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Chronic Kidney Disease Risk Factors and Score</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-5">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="chronic_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('kidneydisease','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="chronic_sections" class="view_type" value="1" onclick="show_hide_indisections('kidneydisease','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="kidneydisease_graph_btn" type="button" onclick="kidneydisease_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="kidneydisease_graph" class="graph_section">
                                </div>
                                <div id="kidneydisease_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Change in Antichrolinergic Cognitive Burden Scale</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Increase in # of Unique Prescribers</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Frailty Percentile</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Level of Reported Medication Side Effects</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Risk of potentially avoidable hospitalization for diabetes in the next 12 months</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-5">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskpot_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('potential','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskpot_sections" class="view_type" value="1" onclick="show_hide_indisections('potential','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="potential_graph_btn" type="button" onclick="potential_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="potential_graph" class="graph_section">
                                </div>
                                <div id="potential_table" class="table_section" style="display:none;">
                                <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Change in Antichrolinergic Cognitive Burden Scale</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Increase in # of Unique Prescribers</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Frailty Percentile</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Level of Reported Medication Side Effects</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title pl-4">
                                            <span class="card-label font-weight-bolder text-dark">Risk of all cause Mortality in next 12 months</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-5">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskmortal_sections" checked="checked" class="view_type" value="0" onclick="show_hide_indisections('riskmortality','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" name="riskmortal_sections" class="view_type" value="1" onclick="show_hide_indisections('riskmortality','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                    <div class="col-lg-1">
                                        <button class="btn btn-success py-1" id="riskmortality_graph_btn" type="button" onclick="riskmortality_graph_func();" style="float: right;display:none;">Back</button>									
                                    </div>
                                </div>
                                <div id="riskmortality_graph" class="graph_section">
                                </div>
                                <div id="riskmortality_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr class="grey_bg_class">
                                                <th class="graph_th">Contributing Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Admissions For CHF(1M)</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Decrease in Medication Adherence</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">No. of changes in Medication Regimen at Discharge</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                            <tr class="grey_bg_class">
                                                <td class="graph_td">Level of Caregiver Support</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>                                    
<script>var _tooltip = jQuery.fn.tooltip;</script>
<script>jQuery.fn.tooltip = _tooltip;</script>
<script type="text/javascript">
// Rising Risk and Cost Bloomers
riskdistribution_graph_func();
function riskdistribution_graph_func(){
    $('#riskdistribution_graph_btn').hide();
    var riskdistribution_graph_chart = Highcharts.chart('riskdistribution_graph', {
        chart: {
            type: 'column'
        },
        title: {
            align: 'left',
            text: ''
        },
        subtitle: {
            align: 'left',
            text: ''
        },
        accessibility: {
            announceNewData: {
                enabled: true
            }
        },
        xAxis: {
            type: 'category',
            title: {
                text: 'Risk Levels'
            }
        },
        yAxis: {
            title: {
                text: 'Number of Patients'
            }

        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            series: {
                borderWidth: 0,
                dataLabels: {
                    enabled: true,
                    format: '{point.y:.1f}'
                }
            }
        },

        tooltip: {
            headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
            pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>'
        },

        series: [
            {
                name: 'Risk Levels',
                colorByPoint: true,
                data: [
                    {
                        name: 'Low Risk',
                        color :'#4998f1',
                        y: 54,
                    },
                    {
                        name: 'Moderate Risk',
                        color :'#fbb828',
                        y: 44,
                    },
                    {
                        name: 'High Risk',
                        color :'#fc673e',
                        y: 36,
                    }
                ]
            }
        ]
    });
    riskdistribution_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	{
		label.style.cursor = "pointer";
		label.style.fill = "blue";
	});
	for (let i = 0; i<riskdistribution_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	{
		riskdistribution_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
			get_drilldown_details('riskdistribution_graph',i);
		}
	};
}

//Readmission Rate Count
mediadherence_graph_func();
function mediadherence_graph_func(){
    $('#mediadherence_graph_btn').hide();
    var mediadherence_graph_chart = Highcharts.chart('mediadherence_graph', {
        chart: {
            type: 'column',
        },

        title: {
            text: '',
            align: 'left'
        },

        subtitle: {
            text: '',
            align: 'left'
        },

        xAxis: {
            categories: ['Jan','Feb','Mar','Apr','May','Jun']
        },
        credits: {
            enabled: false
        },
        yAxis: [{ // Primary axis
                className: 'highcharts-color-0',
                title: {
                    text: 'Percentage'
                }
            }, 
            // { // Secondary axis
            // 	className: 'highcharts-color-1',
            // 	opposite: true,
            // 	title: {
            // 		text: 'BMI'
            // 	}
            // }
        ],

        plotOptions: {
            column: {
                borderRadius: 5
            }
        },
        series: [
            {
                name: 'Non Adherence Risk',
                data: [33, 27, 24, 21,39,46],
                color: '#e9638b'
            }, 
            {
                name: 'Patient Adherence',
                data: [53, 44, 48, 43, 40,46],
                color: '#2274fa'
            }
        ]
    });
    mediadherence_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	{
		label.style.cursor = "pointer";
		label.style.fill = "blue";
	});
	for (let i = 0; i<mediadherence_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	{
		mediadherence_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
			get_drilldown_details('mediadherence_graph',i);
		}
	};
}
//Risk Stratification
hospitalization_graph_func()
function hospitalization_graph_func(){
    $('#hospitalization_graph_btn').hide();
    var hospitalization_graph_chart = Highcharts.chart('hospitalization_graph', {
        chart: {
            type: 'column'
        },
        title: {
            text: '',
            align: 'left'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']
        },
        yAxis: {
            min: 0,
            title: {
                text: ''
            },
            stackLabels: {
                enabled: true
            }
        },
        legend: {
            align: 'left',
            x: 70,
            verticalAlign: 'top',
            y: 70,
            floating: true,
            backgroundColor:
                Highcharts.defaultOptions.legend.backgroundColor || 'white',
            borderColor: '#CCC',
            borderWidth: 1,
            shadow: false
        },
        tooltip: {
            headerFormat: '<b>{point.x}</b><br/>',
            pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            column: {
                stacking: 'normal',
                dataLabels: {
                    enabled: true
                }
            }
        },
        series: [
            {
                name: 'Emergency Room Visists',
                data: [33, 27, 24, 21,39, 41],
                color: '#fa522a'
                // yAxis: 1
            },
            {
                name: 'Hospitalizations',
                data: [42, 53, 34, 49,35,46],
                color: '#6267fa'
            }
        ]
    });
    hospitalization_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	{
		label.style.cursor = "pointer";
		label.style.fill = "blue";
	});
	for (let i = 0; i<hospitalization_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	{
		hospitalization_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
			get_drilldown_details('hospitalization_graph',i);
		}
	};
}
healthcarecost_graph_func();
function healthcarecost_graph_func(){
    $('#healthcarecost_graph_btn').hide();
    var healthcarecost_graph_chart = Highcharts.chart('healthcarecost_graph', {
        chart: {
            type: 'area'
        },
        title: {
            text: '',
            align: 'left'
        },
        subtitle: {
            text: '',
            align: 'left'
        },
        xAxis: {
            categories: ['John Wyatt', 'Venkat Rajaneni', 'Peter', 'Sawyer', 'Grant'],
            accessibility: {
                description: 'Patients List'
            }
        },
        yAxis: {
            title: {
                useHTML: true,
                text: ''
            }
        },
        tooltip: {
            shared: true,
            headerFormat: '<span style="font-size:12px"><b>{point.key}</b></span><br>'
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            // series: {
            //     pointStart: 2012
            // },
            area: {
                stacking: 'normal',
                lineColor: '#666666',
                lineWidth: 1,
                marker: {
                    lineWidth: 1,
                    lineColor: '#666666'
                }
            }
        },
        series: [{
            name: 'Medication Costs',
            color: '#ef8abc',
            data: [3221, 2600, 2154, 3456, 4435]
        }, {
            name: 'Hospitalization Costs',
            color: '#98b5eb',
            data: [2101, 1564, 1254, 1800, 2612]

        }]
    });
    // healthcarecost_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	// {
	// 	label.style.cursor = "pointer";
	// 	label.style.fill = "blue";
	// });
	// for (let i = 0; i<healthcarecost_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	// {
	// 	healthcarecost_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
	// 		get_drilldown_details('healthcarecost_graph',i);
	// 	}
	// };
}
// Rising Risk and Cost Bloomers
kidneydisease_graph_func();
function kidneydisease_graph_func(){
    $('#kidneydisease_graph_btn').hide();
    var kidneydisease_graph_chart = Highcharts.chart('kidneydisease_graph', {
        chart: {
            type: 'column'
        },
        title: {
            align: 'left',
            text: ''
        },
        subtitle: {
            align: 'left',
            text: ''
        },
        accessibility: {
            announceNewData: {
                enabled: true
            }
        },
        xAxis: {
            type: 'category'
        },
        yAxis: {
            title: {
                text: 'Risk Level'
            }

        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            series: {
                borderWidth: 0,
                dataLabels: {
                    enabled: true,
                    format: '{point.y:.1f}'
                }
            }
        },

        tooltip: {
            headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
            pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>'
        },

        series: [
            {
                name: 'Chronic Kidney Disease Risk Factors and Score',
                colorByPoint: true,
                data: [
                    {
                        name: 'Rise in Blood Pressure(mmHg)',
                        color :'#ec1278',
                        y: 36,
                    },
                    {
                        name: 'Decline in eGFR(mL/min/1.73m2)',
                        color :'#47d2c7',
                        y: 44,
                    },
                    {
                        name: 'Low Adherence in HTN Medication',
                        color :'#f5e02b',
                        y: 54,
                    },
                    {
                        name: 'Pct with Limited Access to Healthy Food',
                        color :'#2bc4f5',
                        y: 46,
                    }
                ]
            }
        ]
    });
    kidneydisease_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	{
		label.style.cursor = "pointer";
		label.style.fill = "blue";
	});
	for (let i = 0; i<kidneydisease_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	{
		kidneydisease_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
			get_drilldown_details('kidneydisease_graph',i);
		}
	};
}
// Rising Risk and Cost Bloomers
potential_graph_func();
function potential_graph_func(){
    $('#potential_graph_btn').hide();
    var potential_graph_chart = Highcharts.chart('potential_graph', {
        chart: {
            type: 'column'
        },
        title: {
            align: 'left',
            text: ''
        },
        subtitle: {
            align: 'left',
            text: ''
        },
        accessibility: {
            announceNewData: {
                enabled: true
            }
        },
        xAxis: {
            type: 'category'
        },
        yAxis: {
            title: {
                text: 'Risk Level'
            }

        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            series: {
                borderWidth: 0,
                dataLabels: {
                    enabled: true,
                    format: '{point.y:.1f}'
                }
            }
        },

        tooltip: {
            headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
            pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>'
        },

        series: [
            {
                name: 'Risk of Potential avoidable Hospitalization',
                colorByPoint: true,
                data: [
                    {
                        name: 'Medicare Disability',
                        color :'#ec1278',
                        y: 36,
                    },
                    {
                        name: '# of HCCs',
                        color :'#47d2c7',
                        y: 44,
                    },
                    {
                        name: 'Days since last PCP Visit',
                        color :'#f5e02b',
                        y: 54,
                    },
                    {
                        name: 'Pct Mammography Screening',
                        color :'#2bc4f5',
                        y: 46,
                    }
                ]
            }
        ]
    });
    potential_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	{
		label.style.cursor = "pointer";
		label.style.fill = "blue";
	});
	for (let i = 0; i<potential_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	{
		potential_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
			get_drilldown_details('potential_graph',i);
		}
	};
}
riskmortality_graph_func();
function riskmortality_graph_func(){
    $('#riskmortality_graph_btn').hide();
    var riskmortality_graph_chart = Highcharts.chart('riskmortality_graph', {
        chart: {
            type: 'area'
        },
        title: {
            text: '',
            align: 'left'
        },
        subtitle: {
            text: '',
            align: 'left'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May'],
            accessibility: {
                description: 'Months of the year'
            }
        },
        yAxis: {
            title: {
                useHTML: true,
                text: 'Risk Level'
            }
        },
        tooltip: {
            shared: true,
            headerFormat: '<span style="font-size:12px"><b>{point.key}</b></span><br>'
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            // series: {
            //     pointStart: 2012
            // },
            area: {
                stacking: 'normal',
                lineColor: '#666666',
                lineWidth: 1,
                marker: {
                    lineWidth: 1,
                    lineColor: '#666666'
                }
            }
        },
        series: [{
            name: 'John Wyatt',
            color: '#a6cae7',
            data: [32, 26, 21, 34, 44]
        }, 
        {
            name: 'Venkat Rajaneni',
            color: '#ff6cb6',
            data: [21, 15, 12, 18, 26]
        },
        {
            name: 'Peter',
            color: '#ffa935',
            data: [17, 15, 12, 18, 26]

        },
        {
            name: 'Sawyer',
            color: '#6ef176',
            data: [16, 14, 16, 14, 21]

        },
        {
            name: 'Grant',
            color: '#ccbad8',
            data: [13, 20, 17, 16, 17]

        }]
    });
    // riskmortality_graph_chart.xAxis[0].labelGroup.element.childNodes.forEach(function(label)
	// {
	// 	label.style.cursor = "pointer";
	// 	label.style.fill = "blue";
	// });
	// for (let i = 0; i<riskmortality_graph_chart.xAxis[0].labelGroup.element.childNodes.length; i++)
	// {
	// 	riskmortality_graph_chart.xAxis[0].labelGroup.element.childNodes[i].onclick = function(){
	// 		get_drilldown_details('riskmortality_graph',i);
	// 	}
	// };
}

function show_hide_sections(section_type){
    if(section_type=='graph'){
        $('.graph_section').show();
        $('.table_section').hide();
    } else {
        $('.graph_section').hide();
        $('.table_section').show();
    }
}

function show_hide_indisections(section_name, section_type){
    if(section_type=='graph'){
        $('#'+section_name+'_graph').show();
        $('#'+section_name+'_table').hide();
    } else {
        $('#'+section_name+'_graph').hide();
        $('#'+section_name+'_table').show();
    }
}
</script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script type="text/javascript">
var data = {
        labels: ['Collaborative Care Management (CoCM)', 'Behavioral Health Integration (BHI)','Transitional Care Management (TCM)','Principal Care Management (PCM)','Remote Therapeutic Monitoring (RTM)','Chronic Care Management (CCM)','Remote Patient Monitoring (RPM)','Stroke Link Health (SLH)'],
        datasets: [{
            label: 'Risk Stratification Score',
            backgroundColor: 'rgba(75, 192, 192, 0.2)',
            borderColor: 'rgba(75, 192, 192, 1)',
            borderWidth: 2,
            data: [93, 95, 92, 97,94,77,87,45] // Replace this array with your actual scores
        }]
    };

    // Configuration options
    var options = {
        scale: {
            ticks: {
                beginAtZero: true,
                max: 10 // Adjust the maximum value based on your scoring system
            }
        }
    };

    // Get the context of the canvas element we want to select
    var ctx = document.getElementById('risksatisfy_graph').getContext('2d');

    // Create the radar chart
    var myRadarChart = new Chart(ctx, {
        type: 'radar',
        data: data,
        options: options
    });

    function get_drilldown_details(func_type, element_key){
        $('#'+func_type+'_btn').show();
        if(func_type=='riskdistribution_graph'){
            riskdistribution_graph_drilldown('riskdistribution_graph',element_key);
        } else if(func_type=='mediadherence_graph'){
            mediadherence_graph_drilldown('mediadherence_graph',element_key);
        } else if(func_type=='hospitalization_graph'){
            hospitalization_graph_drilldown('hospitalization_graph',element_key);
        } else if(func_type=='healthcarecost_graph'){
            healthcarecost_graph_drilldown('healthcarecost_graph',element_key);
        } else if(func_type=='kidneydisease_graph'){
            kidneydisease_graph_drilldown('kidneydisease_graph',element_key);
        } else if(func_type=='potential_graph'){
            potential_graph_drilldown('potential_graph',element_key);
        } else if(func_type=='riskmortality_graph'){
            riskmortality_graph_drilldown('riskmortality_graph',element_key);
        }
    }

    function riskdistribution_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'John Wyatt',
                            color :color_code,
                            y: 9,
                        },
                        {
                            name: 'Venkat Rajaneni',
                            color :color_code,
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :color_code,
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : color_code,
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :color_code,
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function mediadherence_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'Venkat Rajaneni',
                            color :'#e9638b',
                            y: 9,
                        },
                        {
                            name: 'John Wyatt',
                            color :'#e9638b',
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :'#2274fa',
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :'#e9638b',
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :'#2274fa',
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : '#e9638b',
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :'#2274fa',
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :'#2274fa',
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :'#e9638b',
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function hospitalization_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'John Wyatt',
                            color :'#fa522a',
                            y: 9,
                        },
                        {
                            name: 'Venkat Rajaneni',
                            color :'#6267fa',
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :'#fa522a',
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :'#fa522a',
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :'#6267fa',
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : '#6267fa',
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :'#fa522a',
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :'#6267fa',
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :'#fa522a',
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function healthcarecost_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'Venkat Rajaneni',
                            color :color_code,
                            y: 9,
                        },
                        {
                            name: 'John Wyatt',
                            color :color_code,
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :color_code,
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : color_code,
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :color_code,
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function kidneydisease_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'John Wyatt',
                            color :color_code,
                            y: 9,
                        },
                        {
                            name: 'Venkat Rajaneni',
                            color :color_code,
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :color_code,
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : color_code,
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :color_code,
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function potential_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'John Wyatt',
                            color :color_code,
                            y: 9,
                        },
                        {
                            name: 'Venkat Rajaneni',
                            color :color_code,
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :color_code,
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : color_code,
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :color_code,
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }

    function riskmortality_graph_drilldown(func_type,element_key){
        if(element_key==0){
            var color_code = '#4998f1';
        } else if(element_key==1){
            var color_code = '#fbb828';
        } else {
            var color_code = '#fc673e';
        }
        Highcharts.chart(func_type, {
            chart: {
                type: 'column'
            },
            title: {
                align: 'left',
                text: ''
            },
            subtitle: {
                align: 'left',
                text: ''
            },
            accessibility: {
                announceNewData: {
                    enabled: true
                }
            },
            xAxis: {
                type: 'category'
            },
            yAxis: {
                title: {
                    text: 'Risk Level'
                }

            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true,
                        format: '{point.y:.1f}'
                    }
                }
            },

            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.1f}</b><br/>'
            },

            series: [
                {
                    name: 'Readmission Rate Count By Age',
                    colorByPoint: true,
                    data: [
                        {
                            name: 'John Wyatt',
                            color :color_code,
                            y: 9,
                        },
                        {
                            name: 'Venkat Rajaneni',
                            color :color_code,
                            y: 4,
                        },
                        {
                            name: 'Rampal',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Henrick',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Peter',
                            color :color_code,
                            y: 2,
                        },
                        {
                            name: 'Hansie',
                            color : color_code,
                            y: 4,
                        },
                        {
                            name: 'Winter',
                            color :color_code,
                            y: 5,
                        },
                        {
                            name: 'Horn',
                            color :color_code,
                            y: 6,
                        },
                        {
                            name: 'Leonel',
                            color :color_code,
                            y: 4,
                        }
                    ]
                }
            ]
        });
    }
</script>
@endsection