程序代写代做代考 js Microsoft Word – ProgrammingAssignmentFour_Instructions.docx
Microsoft Word – ProgrammingAssignmentFour_Instructions.docx
1
Programming Assignment 4: Visualization of Hierarchical (Tree) Data
Background
Hierarchical data or tree data is one of the most popular data type in our life. Many hierarchical data
visualization designs have been developed. Often seen tree visualization techniques include dendrogram
(Figure 1a), treemap (Figure 1b), etc.
(a) (b) (c)
Figure 1: Some often seen tree visualization designs
Objective and Requirements
In this assignment, you will use two tree‐visualization tools to visualize a given data set. The two
visualization tools are dendrogram (https://bl.ocks.org/mbostock/4063570) and treemap
(https://bl.ocks.org/mbostock/4063582).
The data used for this assignment is about the sales data of a book store. The data can be found in the
tree.docx document under the folder of
\up.ist.localCoursesSpring2017IST402ProgrammingAssignmentDataSetsAssignment4_TreeVisualization
The dendrogram graph should show the types of books in a 3‐level tree: genre, sub‐genre, and topic.
The treemap graph should allow a user to choose how the size of a rectangle be decided: based on the
number of books sold, or based on revenue.
You are allowed to use the codes from these two pages for this assignment, but you need to format the
data in ways that can be processed appropriately by each tool. The dendrogram tool requires data to be
stored in a csv file, while the tree map tool requires the JSON format. Read the codes and data files
carefully.
Learning from other people’s codes is always recommended, but you need to understand what they did.
Thus, in this assignment, you need to add comments to explain what each statement in the JS codes is
about (statements are separated by empty lines).
Delivery
In the dropbox on CANVAS, submit the URL (if you put two graphs in one web page) or URLs (if you have
two different web pages for two graphs) (my.up.ist.psu.edu/…..). Pay attention two things:
2
Make sure the URL/URLs works.
Your can work on your HTML document before the submission deadline. After the deadline, DO
NOT touch the HTML document of your assignment anymore. Otherwise, the document will
have a time stamp after the deadline. Any submission with a time stamp later than the deadline
will not be treated as late submission, and will not be accepted.
Grading rubrics (10 points total)
Dendrogram graph (5 points)
• Correct visualization results (3 points)
• Adequate comments (1 point)
• Correct data format (csv) (1 point)
Treemap graph (5 points)
• Correct visualization results (2 points)
• Correct options for number and revenue
• Correct data format (JSON) (1 point)
Bonus (2 points):
1 Point: Use a drop‐down menu or a radio button on a web page so that users can decide which graph
between these two to see on the web page. Each time, only one graph should be visible.
1 Point: Modify the treemap codes so that moving the cursor over a rectangle will show the number
corresponding to the choice of the radio buttons.
