Overall project description
ACADEMIC INTEGRITY REMINDER
THIS PROJECT IS INDIVIDUAL WORK. YOU MAY NOT WORK WITH CLASSMATES ON
THE PROJECT, OR SEEK ASSISTANCE FROM ANY INDIVIDUALS EXCEPT COURSE
STAFF. You may discuss the general concepts underpinning the project with
classmates, but you may not directly discuss project code with them. When posting a
project-related question on Piazza, post it as a PRIVATE question. If course staff feels it
is of general interest they may, at their discretion, change the visibility of the post.
Table of Contents
Table of Contents 1
0 Overview 2
0.1 Donut chart 2
0.2 Scatter plot 2
0.3 Typos? Questions? Clarifications? 2
1 Extra files 2
1.1 Data Set 2
1.2 ajax.js 3
2 Requirements 3
2.1 main.py 4
2.2 index.html 4
2.2.1 The head element 4
2.2.2 The body element 4
126.96.36.199 The Donut chart 5
188.8.131.52 The Scatter plot 7
2.3 front_end.js 9
3 Submission Instructions 9
In this third and last part of the project you will write code to tie everything together in a
complete web application.
In this part you will write code to process visualize the data which your code in part 2 produced:
0.1 Donut chart
The donut chart will show the percentage of all service requests associated with each
department (indicated in the “SUBJECT” field), within a given range of years.
0.2 Scatter plot
The scatter plot will show the number of requests (Y axis) by duration (X axis), per department
(data series), in a given year.
0.3 Typos? Questions? Clarifications?
If you think you’ve found a typo, have questions, or would like clarifications on what is required,
post in the class Piazza forum.
1 Extra files
There are some additional files you will need to complete the project.
1.1 Data Set
Recall that your code will process data from 311 Service Requests data set available via
OpenData Buffalo . The entire data set appears to be too big to load into repl.it, so here is a
smaller dataset (though still substantial: is has ~80,000 records) that you can test your code
You can also download it as a zip file, which will be faster, but you will need to extract the
contents to get the CSV file:
You should upload the CSV file to your repl.
Note that when you submit your work you need to make sure that this file is NOT in your zip file
(TA’s will add this file during the demo), but do make sure that close to the top of your App.py
file ( but after the definition of the readCSV function ) you include:
ALL_DATA = readCSV(“311_Service_Requests_small.csv”)
You can download ajax.js ; upload this file into your repl.
If you did not complete the requirements for parts 1 and 2, do that first. For part 3 you need to
write two files (index.html and front_end.js), ensure that one file (ajax.js) is included in your repl
(and in your submission), and make one small modification to your Server.py file.
In the end you will have a small web application that will be able do display graphs like this:
Your main.py file should now be defined with the following content:
If you still have testing code you wish to run to verify the part 1 and part 2 functionality you can
comment leave that in the file and comment out the
line of code. When you are ready to try out your whole web application you should comment in
the above line, and comment out any other testing code you may have in main.py .
The contents of index.html will define user interface (UI) for your web application. A UI has
two primary functions: to present information to a user, and accept input from a user.
2.2.1 The head element
be requested using