report/onlychart.php at master · catdingding/report · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!DOCTYPE html>
<html lang="zh-Hant-TW">
    <head>
        <meta charset="UTF-8"/>
        <title>
            圖表產生器
        </title>
        <link rel="stylesheet" href="bootstrap.min.css"/>
        <link rel="stylesheet" href="style.css">
        <style>
            header, header+div, #condition, .sample, .send, #disqus_thread, footer, #area_chart, #map_table {
                display: none;
            }

            div.chart {
                background-color: #fff;
                max-height: 100vh !important;
                margin-top: 0px !important;
                width: 100% !important;
                margin: 0 !important;
            }
        </style>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        <script src="main.js"></script>
        <script src="https://www.gstatic.com/charts/loader.js"></script>
        <script src="select.js"></script>
        <script>
            if (filename==='onlychart.php' || filename==='imgchart.php') {
                var css = document.createElement('link');
                css.setAttribute("rel","stylesheet");
                css.setAttribute("type","text/css");
                css.setAttribute("href",'clearchart.css');
                document.getElementsByTagName("head")[0].appendChild(css);
            }

            google.charts.load('current', {packages: ["line","corechart","geochart","table"]});
            google.charts.setOnLoadCallback(ready);

            function ready() {
                googlechart=1;
            }

			$(document).ready(function () {
                $("input").change(function(){
                    if ($('input:radio:checked[name="kind"]').val()!=undefined && $('input:radio:checked[name="search"]').val()!=undefined) {
                        $(".send").attr('disabled', false);
                    };
                });
	        });

            function makechart () {
	            var kind = eval($('input:radio:checked[name="kind"]').val());
	            $(".chart").remove();
	            $("#diychart").append('<div class="chart" id="'+kind.name+'_chart"><div class="loading"></div></div>');
	            if (kind.name=="area") {
	            	$("#diychart").append('<div class="chart" id="map"><div class="loading"></div></div>');
	            	$("#diychart").append('<div class="chart" id="map_table"><div class="loading"></div></div>');
	            };
	            $("html,body").animate({
		            scrollTop: 600
		        }, 500);
                condition.obj={};
                chart(kind);
            }
        </script>
    </head>
    <body>
    <div id="condition">
        <?php
          require 'form_condition.php';
        ?>
        <form class="form-inline">
            <h3>
                圖表選擇
            </h3>
            <input class="form-control" type="radio" id="area_chart_type" name="kind" value="area"/>
            <label for="area_chart_type">
                地區分布
            </label>

            <input class="form-control" type="radio" id="day_chart_type" name="kind" value="day"/>
            <label for="day_chart_type">
                出國日長分布
            </label>

            <input class="form-control" type="radio" id="office_chart_type" name="kind" value="office"/>
            <label for="office_chart_type">
                主辦機關分布
            </label>

            <input class="form-control" type="radio" id="topic_cat_chart_type" name="kind" value="topic_cat"/>
            <label for="topic_cat_chart_type">
                主題分布
            </label>

            <input class="form-control" type="radio" id="year_chart_type" name="kind" value="year"/>
            <label for="year_chart_type">
                年份分布
            </label>

            <input class="form-control" type="radio" id="month_chart_type" name="kind" value="month"/>
            <label for="month_chart_type">
                月份分布
            </label>

            <input class="form-control" type="radio" id="gov_chart_type" name="kind" value="gov"/>
            <label for="gov_chart_type">
                政府分布
            </label>

            <h3>
                搜尋要求
            </h3>
            <input class="form-control" type="radio" id="equal" name="search" checked="checked" value="equal"/>
            <label for="equal">
                完全符合
            </label>

            <input class="form-control" type="radio" id="similar" name="search" value="similar"/>
            <label for="similar">
                部分符合
            </label>
        </form>

    </div>
        <div id="diychart"></div>
    </body>
</html>