全文链接:tecdat.cn/?p=29684
Introduction
D3.js是Javascript中的一个利用Html5的SVG的图形库,主要用于数据可视化。用他画出来的网页的确是狂拽炫酷吊炸天,但是如果浏览器很差的话,或者计算机性能很差,或者数据计算量很大的话,会卡到死。 D3总体来说还是不错的,内置了jQuery语法,熟悉选择器的话,这个库上手很快。 但是,这个库要求有很好的HTML5基础,特别是SVG标签的用法。
Requirement
这个编程作业就一个字:累。需要实现的东西非常多,而且杂,互相之间也没有什么关系。
Part 1: Visualizing Data using D3
Q1
Create a scatter plot visualization with the provided data in the file Data.csv. According to the examples for scatter plot. Attributes / features of the data:
- Speed of wind in km/h.
- Month of the year.
- The forest burnt area.
Any appropriate range for scale is allowed, and any appropriate size for squares is allowed. Submit Q1.pdf with a screenshot of this page.
Q2
According to data provided in the file Q2.csv, a bar chart visualization should be drawn. Your task requires to visualize the number of students in Q2.csv. Transfer the data in Q2.csv to Q2_transfer.csv, you can use a Python script or Java program to archive this goal.
Q3
Now you knows a lot of features in D3 for graph visualization. This time you need to use D3 to draw a graph.
- Using labels for each node.
- All nodes can be pinned.
- Draw links with different color.
- Use tooltips when mouse over.
Part 2: Visualizing Statistics of Refugees in Europe
Q4
After Part1, this time you need to work on real data, and try to find out the appropriate data visualization technology.
- Your should transfer Q4.csv to Q4_transfer.csv, you can use a Python script or Java program to do this job.
- Use a table to show the relationship inside this dataset, you can draw any graph you like.
- Use D3 to visualize your data, you should use d3.slider library.
Part 3: Visualizing College Scorecard data
Q5
After Part2, this time you should find a real dataset, and use your data visualization technology to show it, good luck!
Summary
非常花时间的一次作业,csv数据集非常恶心,从一开始的给定数据,到复杂数据,最后自己找数据,整整花了两天吧。得分点很多,也很细,不过万幸的是Bonus很简单。