OWL ITS + 탐지시스템(인터넷 진흥원)
이민희
2021-12-02 6a72a3edec87cca9996c7ab3be3fd48479881945
src/main/webapp/views/api/apiMonitor.html
@@ -1,45 +1,5 @@
<script type="text/javascript">
    google.charts.load('current', {'packages':['line']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('number', '날짜');
        data.addColumn('number', '홈페이지 변조 탐지');
        data.addColumn('number', '경유지 탐지');
        data.addColumn('number', '일감 조회');
        data.addRows([
            [1,  37.8, 80.8, 41.8],
            [2,  30.9, 69.5, 32.4],
            [3,  25.4,   57, 25.7],
            [4,  11.7, 18.8, 10.5],
            [5,  11.9, 17.6, 10.4],
            [6,   8.8, 13.6,  7.7],
            [7,   7.6, 12.3,  9.6],
            [8,  12.3, 29.2, 10.6],
            [9,  16.9, 42.9, 14.8],
            [10, 12.8, 30.9, 11.6],
            [11,  5.3,  7.9,  4.7],
            [12,  6.6,  8.4,  5.2],
            [13,  4.8,  6.3,  3.6],
            [14,  4.2,  6.2,  3.4]
        ]);
        var options = {
            chart: {
                title: '일감 유형별 API 사용 현황',
                subtitle: '최근 15일'
            },
            width: 900,
            height: 500
        };
        var chart = new google.charts.Line(document.getElementById('linechart_material'));
        chart.draw(data, google.charts.Line.convertOptions(options));
    }
</script>
<div class="row">
@@ -52,7 +12,23 @@
            </h6>
            <div class="element-box">
                <div id="linechart_material"></div>
                <select class="form-control form-control-sm rounded width-30 d-inline-block mb-10" ng-model="vm.search.searchPeriod" ng-change="fn.changeSearchPeriod()">
                    <option value="LAST_SEVEN_DAYS" translate="common.last7Days">최근 7일</option>
                    <option value="THIS_WEEK" translate="common.thisWeek">이번 주</option>
                    <option value="LAST_WEEK" translate="common.lastWeek">지난 주</option>
                    <option value="THIS_MONTH" translate="common.thisMonth">이번 달</option>
                    <option value="LAST_MONTH" translate="common.lastMonth">지난 달(1일~말일)</option>
                    <option value="LAST_THIRTY_DAYS" translate="common.last30Days">최근 30일</option>
                    <option value="CUSTOM_INPUT" translate="common.directInput">직접입력</option>
                </select>
                <google-chart
                              columns="vm.chartData.columns"
                              rows="vm.chartData.rows"
                              options="vm.chartData.options">
                </google-chart>
            </div>
        </div>
    </div>