Skip to content

Commit

Permalink
completed final three charts, added filtering for other category
Browse files Browse the repository at this point in the history
  • Loading branch information
@jic13003
jic13003 committed Apr 24, 2017
1 parent f5db535 commit 7299dbf
Show file tree
Hide file tree
Showing 4 changed files with 161 additions and 14 deletions.
131 changes: 123 additions & 8 deletions WebContent/html/javascript/statistics.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,16 @@ String locString = Statistics.arrayToString(genLocations);
//device type queries
Statistics[] genTypes = StatisticsQueries.getDeviceTypes();
String typeString = Statistics.arrayToString(genTypes);
// device manufacturer queries
Statistics[] genManu = StatisticsQueries.getDeviceManu();
String manuString = Statistics.arrayToString(genManu);
%>
<script type=text/javascript
src="https://www.gstatic.com/charts/loader.js"></script>
<script>
var statistics = makeStatistics(); //initialize statistics
var deviceTypes = makeTypes(); //initialize types
var deviceManus = makeManu(); //initialize manufaturers
displayData(); //run the function
function displayData() {
Expand Down Expand Up @@ -58,6 +62,10 @@ function displayData() {
google.charts.setOnLoadCallback(drawPie);
google.charts.setOnLoadCallback(drawCol);
google.charts.setOnLoadCallback(drawTypesBar);
google.charts.setOnLoadCallback(drawManuBar);
google.charts.setOnLoadCallback(drawTypesPie);
google.charts.setOnLoadCallback(drawManuPie);
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
Expand All @@ -68,10 +76,10 @@ function displayData() {
data.addColumn('string', 'Status');
data.addColumn('number', 'Count');
for (var i = 0; i<statistics.length; i++){
data.addRow([statistics[i].status, statistics[i].count]); //fixed this to match the new database
data.addRow([statistics[i].status, statistics[i].count]); //fixed this to match the new database
}
// Set chart options
var options = {'title':'Chart of Devices',
var options = {'title':'Percentage Chart of Device Statuses',
'width':600,
'height':400,
'backgroundColor':'#E9EAEB'};
Expand Down Expand Up @@ -114,13 +122,19 @@ function displayData() {
// Create the data table.
var data = new google.visualization.DataTable();
var otherDevices = 0;
data.addColumn('string', 'Device Type');
data.addColumn('number', 'Count');
var mainTypeArray = ['Computer','Smartphone','Tablet','Camera','Storage Device'];
for (var i = 0; i<deviceTypes.length; i++){
data.addRow([deviceTypes[i].type, deviceTypes[i].count]); //fixed this to match the new database
}
if (mainTypeArray.indexOf(deviceTypes[i].type) < 0) {
otherDevices += deviceTypes[i].count;
}
else {
data.addRow([deviceTypes[i].type, deviceTypes[i].count]); //fixed this to match the new database
}
}
data.addRow(["Other",otherDevices]);
var view = new google.visualization.DataView(data);
view.setColumns([0, 1,
{ calc: "stringify",
Expand All @@ -137,19 +151,116 @@ function displayData() {
'backgroundColor':'#E9EAEB'};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.BarChart(document.getElementById('bardevicechart'));
var chart = new google.visualization.BarChart(document.getElementById('bartypechart'));
chart.draw(view, options);
}
function drawManuBar() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Manufacturer');
data.addColumn('number', 'Count');
var otherDevices = 0;
var mainManuArray = ['Apple','Amazon','Microsoft','Samsung','Intel'];
for (var i = 0; i<deviceManus.length; i++){
if (mainManuArray.indexOf(deviceManus[i].manu) < 0) {
otherDevices += deviceManus[i].count;
}
else {
data.addRow([deviceManus[i].manu, deviceManus[i].count]); //fixed this to match the new database
}
}
data.addRow(["Other",otherDevices]);
var view = new google.visualization.DataView(data);
view.setColumns([0, 1,
{ calc: "stringify",
sourceColumn: 1,
type: "string",
role: "annotation" }
]);
var options = {'title':'Devices in terms of Manufacturer',
'width':600,
'height':400,
'bar': {groupWidth: "75%"},
'legend': { position: "none" },
'backgroundColor':'#E9EAEB'};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.BarChart(document.getElementById('barmanuchart'));
chart.draw(view, options);
}
function drawTypesPie() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Hardware Type');
data.addColumn('number', 'Count');
var otherDevices = 0;
var mainTypeArray = ['Computer','Smartphone','Tablet','Camera','Storage Device'];
for (var i = 0; i<deviceTypes.length; i++){
if (mainTypeArray.indexOf(deviceTypes[i].type) < 0) {
otherDevices += deviceTypes[i].count;
}
else {
data.addRow([deviceTypes[i].type, deviceTypes[i].count]); //fixed this to match the new database
}
}
data.addRow(["Other",otherDevices]);
// Set chart options
var options = {'title':'Percentage Chart of Hardware Types',
'width':600,
'height':400,
'backgroundColor':'#E9EAEB'};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('pietypechart'));
chart.draw(data, options);
}
function drawManuPie() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Manufacturer');
data.addColumn('number', 'Count');
var otherDevices = 0;
var mainManuArray = ['Apple','Amazon','Microsoft','Samsung','Intel'];
for (var i = 0; i<deviceManus.length; i++){
if (mainManuArray.indexOf(deviceManus[i].manu) < 0) {
otherDevices += deviceManus[i].count;
}
else {
data.addRow([deviceManus[i].manu, deviceManus[i].count]); //fixed this to match the new database
}
}
data.addRow(["Other",otherDevices]);
// Set chart options
var options = {'title':'Percentage Chart of Manufacturers',
'width':600,
'height':400,
'backgroundColor':'#E9EAEB'};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('piemanuchart'));
chart.draw(data, options);
}
document.getElementById('stats').innerHTML = html;
}
}
//map
function initMap() {
var locationArray = makeLocations();
var locations=[];
for (var i = 0; i<locationArray.length; i++){
var locObject = {lat: parseInt(locationArray[i].lat),lng: parseInt(locationArray[i].lng)};
var locObject = {lat: parseFloat(locationArray[i].lat),lng: parseFloat(locationArray[i].lng)};
locations.push(locObject);
}
Expand Down Expand Up @@ -200,6 +311,10 @@ function makeTypes(){
window.json = '<%=typeString%>';
return JSON.parse(window.json);
}
function makeManu(){
window.json = '<%=manuString%>';
return JSON.parse(window.json);
}
</script>

</body>
Expand Down
8 changes: 6 additions & 2 deletions WebContent/html/webpages/statisticsPage.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,9 +75,13 @@
<div style = "display: inline-block; border-style: solid; border-width: 20px; margin: 0px 0px 0px 50px;" id="piechart"></div>
<div style = "float: right; border-style: solid; border-width: 20px; margin: 0px 50px 0px 0px;" id="colchart"></div>
<br><br>
<div style = "text-align: center;"><!-- move this back to above stats later when I think of what to place for the last chart -->
<div style = "display: inline-block; border-style: solid; border-width: 20px; margin: 0px 0px 0px 0px;" id="bardevicechart"></div>
<div style = "display: inline-block; border-style: solid; border-width: 20px; margin: 0px 0px 0px 50px;" id="bartypechart"></div>
<div style = "float: right; border-style: solid; border-width: 20px; margin: 0px 50px 0px 0px;" id="barmanuchart"></div>
<br><br>
<div style = "display: inline-block; border-style: solid; border-width: 20px; margin: 0px 0px 0px 50px;" id="pietypechart"></div>
<div style = "float: right; border-style: solid; border-width: 20px; margin: 0px 50px 0px 0px;" id="piemanuchart"></div>
<br><br>
<div style = "text-align: center;">
<div style = "" class = infoContainer id="stats"></div>
</div>
</div>
Expand Down
31 changes: 28 additions & 3 deletions src/database/StatisticsQueries.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ public static Statistics[] getStatistics() throws ClassNotFoundException, SQLExc
Statistics[] statusDevice = new Statistics[rows];
//iterate result set
while(resultSet.next()){
statusDevice[counter] = new Statistics(resultSet.getString("Status"), null, resultSet.getInt("count(*)"), null, null);
statusDevice[counter] = new Statistics(resultSet.getString("Status"), null, null, resultSet.getInt("count(*)"), null, null);
counter++;
}
stmt.close();
Expand All @@ -47,7 +47,7 @@ public static Statistics[] getLocations() throws ClassNotFoundException, SQLExce
Statistics[] locations = new Statistics[rows];
//iterate result set
while(resultSet.next()){
locations[counter] = new Statistics(null, null, 0, resultSet.getString("Latitude"), resultSet.getString("Longitude"));
locations[counter] = new Statistics(null, null, null, 0, resultSet.getString("Latitude"), resultSet.getString("Longitude"));
counter++;
}
stmt.close();
Expand All @@ -71,12 +71,37 @@ public static Statistics[] getDeviceTypes() throws ClassNotFoundException, SQLEx
Statistics[] typeDevice = new Statistics[rows];
//iterate result set
while(resultSet.next()){
typeDevice[counter] = new Statistics(null, resultSet.getString("Hardware"), resultSet.getInt("count(*)"), null, null);
typeDevice[counter] = new Statistics(null, resultSet.getString("Hardware"), null, resultSet.getInt("count(*)"), null, null);
counter++;
}
stmt.close();
connection.close();
return typeDevice;

}

public static Statistics[] getDeviceManu() throws ClassNotFoundException, SQLException {
//database connect
System.getenv("VCAP_SERVICES");
Class.forName("com.mysql.jdbc.Driver");
Connection connection = DriverManager.getConnection(database, user, password);
Statement stmt = connection.createStatement();
ResultSet resultSet = stmt.executeQuery("SELECT Manufacturer, count(*) FROM devices GROUP BY Manufacturer");
int counter = 0;

resultSet.last();
int rows = resultSet.getRow();
resultSet.beforeFirst();

Statistics[] manuType = new Statistics[rows];
//iterate result set
while(resultSet.next()){
manuType[counter] = new Statistics(null, null, resultSet.getString("Manufacturer"), resultSet.getInt("count(*)"), null, null);
counter++;
}
stmt.close();
connection.close();
return manuType;

}
}
5 changes: 4 additions & 1 deletion src/entities/Statistics.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,15 @@
public class Statistics {
private String _status;
private String _type;
private String _manu;
private int _count;
private String _latitude;
private String _longitude;

public Statistics(String status,String type, int count, String latitude, String longitude) {
public Statistics(String status,String type, String manu, int count, String latitude, String longitude) {
_status = status;
_type = type;
_manu = manu;
_count = count;
_latitude = latitude;
_longitude = longitude;
Expand All @@ -24,6 +26,7 @@ public String toString(){
String comma = ", ";
sb.append("{\"status\": \"").append(_status).append("\"").append(comma);
sb.append("\"type\": \"").append(_type).append("\"").append(comma);
sb.append("\"manu\": \"").append(_manu).append("\"").append(comma);
sb.append("\"count\": ").append(_count).append(comma);
sb.append("\"lat\": \"").append(_latitude).append("\"").append(comma);
sb.append("\"lng\": \"").append(_longitude).append("\"");
Expand Down

0 comments on commit 7299dbf

Please sign in to comment.