001.$nowYear = date('Y');
002.$GraphYear = 2016;
003.
004.for($year=$nowYear;$year>=$GraphYear;$year--)
005.{
006. for($month=1;$month<=12;$month++)
007. {
008. $d_bar =cal_days_in_month(CAL_GREGORIAN, $month, $year);
009.
010.
011. $strBar= "SELECT COUNT (VN) as bargraph FROM DNHOSPITAL_TEST.dbo.HNOPD_MASTER WHERE VisitDate BETWEEN '".$year."-".$month."-1' AND '".$year."-".$month."-".$d_bar."' AND Cxl='0'";
012.
013. $objBar = odbc_exec($conn,$strBar) or die ("Error SQL [".$strBar."]");
014. while($objRow = odbc_fetch_object($objBar))
015. {
016. $totals[]=$objRow->bargraph;
017.
018. }
019. }
020. }
021.?>
022.<!DOCTYPE html>
023.<html lang="en">
024. <head>
025. <meta charset="utf-8">
026. <meta http-equiv="X-UA-Compatible" content="IE=edge">
027. <meta name="viewport" content="width=device-width, initial-scale=1">
028. <title>ChartJs</title>
029.
030. </head>
031.<body>
032.<!--Bar Chart-->
033.<script src="vendor/chart.js/Chart.min.js"></script>
034.<canvas id="chartjs" class="chartjs" width="770" height="385" style="display:block; width 770; height:385px;"></canvas>
035. <script>
036. var ctx = document.getElementById("chartjs");
037.
038. var myChart = new Chart(ctx, {
039. type: 'bar',
040. data: {
041. labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
042. datasets: [{
043. label: <?=json_encode($year)+3?>,
044. data: <?=json_encode($totals, JSON_NUMERIC_CHECK);?>,
045. backgroundColor:
046. [
047. 'rgba(21, 140, 131, 0.5)',
048. 'rgba(21, 140, 131, 0.5)',
049. 'rgba(21, 140, 131, 0.5)',
050. 'rgba(21, 140, 131, 0.5)',
051. 'rgba(21, 140, 131, 0.5)',
052. 'rgba(21, 140, 131, 0.5)',
053. 'rgba(21, 140, 131, 0.5)',
054. 'rgba(21, 140, 131, 0.5)',
055. 'rgba(21, 140, 131, 0.5)',
056. 'rgba(21, 140, 131, 0.5)',
057. 'rgba(21, 140, 131, 0.5)',
058. 'rgba(21, 140, 131, 0.5)',
059. ],
060. borderColor:
061. [
062. 'rgba(21, 140, 131, 1)',
063. 'rgba(21, 140, 131, 1)',
064. 'rgba(21, 140, 131, 1)',
065. 'rgba(21, 140, 131, 1)',
066. 'rgba(21, 140, 131, 1)',
067. 'rgba(21, 140, 131, 1)',
068. 'rgba(21, 140, 131, 1)',
069. 'rgba(21, 140, 131, 1)',
070. 'rgba(21, 140, 131, 1)',
071. 'rgba(21, 140, 131, 1)',
072. 'rgba(21, 140, 131, 1)',
073. 'rgba(21, 140, 131, 1)',
074. ],
075. borderWidth: 1
076. },{
077. label: <?=json_encode(($year)+2)?>,
078. data: <?=json_encode($totals, JSON_NUMERIC_CHECK);?>,
079. backgroundColor:
080. [
081. 'rgba(137, 133, 133, 0.5)',
082. 'rgba(137, 133, 133, 0.5)',
083. 'rgba(137, 133, 133, 0.5)',
084. 'rgba(137, 133, 133, 0.5)',
085. 'rgba(137, 133, 133, 0.5)',
086. 'rgba(137, 133, 133, 0.5)',
087. 'rgba(137, 133, 133, 0.5)',
088. 'rgba(137, 133, 133, 0.5)',
089. 'rgba(137, 133, 133, 0.5)',
090. 'rgba(137, 133, 133, 0.5)',
091. 'rgba(137, 133, 133, 0.5)',
092. 'rgba(137, 133, 133, 0.5)',
093. ],
094. borderColor:
095. [
096. 'rgba(137, 133, 133, 1)',
097. 'rgba(137, 133, 133, 1)',
098. 'rgba(137, 133, 133, 1)',
099. 'rgba(137, 133, 133, 1)',
100. 'rgba(137, 133, 133, 1)',
101. 'rgba(137, 133, 133, 1)',
102. 'rgba(137, 133, 133, 1)',
103. 'rgba(137, 133, 133, 1)',
104. 'rgba(137, 133, 133, 1)',
105. 'rgba(137, 133, 133, 1)',
106. 'rgba(137, 133, 133, 1)',
107. 'rgba(137, 133, 133, 1)',
108. ],
109. borderWidth: 1
110. },{
111. label: <?=json_encode(($year)+1)?>,
112. data: <?=json_encode($totals, JSON_NUMERIC_CHECK);?>,
113. backgroundColor:
114. [
115. 'rgba(0, 90, 90, 0.5)',
116. 'rgba(0, 90, 90, 0.5)',
117. 'rgba(0, 90, 90, 0.5)',
118. 'rgba(0, 90, 90, 0.5)',
119. 'rgba(0, 90, 90, 0.5)',
120. 'rgba(0, 90, 90, 0.5)',
121. 'rgba(0, 90, 90, 0.5)',
122. 'rgba(0, 90, 90, 0.5)',
123. 'rgba(0, 90, 90, 0.5)',
124. 'rgba(0, 90, 90, 0.5)',
125. 'rgba(0, 90, 90, 0.5)',
126. 'rgba(0, 90, 90, 0.5)',
127. ],
128. borderColor:
129. [
130. 'rgba(0, 90, 90, 1)',
131. 'rgba(0, 90, 90, 1)',
132. 'rgba(0, 90, 90, 1)',
133. 'rgba(0, 90, 90, 1)',
134. 'rgba(0, 90, 90, 1)',
135. 'rgba(0, 90, 90, 1)',
136. 'rgba(0, 90, 90, 1)',
137. 'rgba(0, 90, 90, 1)',
138. 'rgba(0, 90, 90, 1)',
139. 'rgba(0, 90, 90, 1)',
140. 'rgba(0, 90, 90, 1)',
141. 'rgba(0, 90, 90, 1)',
142. ],
143. borderWidth: 1
144. }]
145. },
146. options: {
147. scales: {
148. yAxes: [{
149. ticks: {
150. beginAtZero:true
151. }
152. }]
153. },
154. responsive: true,
155. title: {
156. display: true,
157. text: 'THAI STATISTICS HOSPITAL PATIENT OF OPD'
158. }
159. }
160. });
161.</script>
162.<?php
163.
164.?>
165.</body>
166.</html>
