Skip to content

Instantly share code, notes, and snippets.

@sunnyuxuan
sunnyuxuan / Beef.csv
Last active March 14, 2016 19:32
week8 problems
Location IndiaICATOR SUBJECT MEASURE FREQUENCY Year number
Australia MEATCONSUMP BEEF KG_CAP A 1983 29.5792547
Australia MEATCONSUMP BEEF KG_CAP A 1984 31.10452816
Australia MEATCONSUMP BEEF KG_CAP A 1985 28.69243026
Australia MEATCONSUMP BEEF KG_CAP A 1986 29.30333555
Australia MEATCONSUMP BEEF KG_CAP A 1987 28.19191012
Australia MEATCONSUMP BEEF KG_CAP A 1988 28.92143335
Australia MEATCONSUMP BEEF KG_CAP A 1989 30.2827978
Australia MEATCONSUMP BEEF KG_CAP A 1990 28.22040625
Australia MEATCONSUMP BEEF KG_CAP A 1991 27.64857294
@sunnyuxuan
sunnyuxuan / Beef.csv
Last active February 29, 2016 19:00
Week7 homework
Australia MEATCONSUMP BEEF KG_CAP A 1983 29.5792547
Australia MEATCONSUMP BEEF KG_CAP A 1984 31.10452816
Australia MEATCONSUMP BEEF KG_CAP A 1985 28.69243026
Australia MEATCONSUMP BEEF KG_CAP A 1986 29.30333555
Australia MEATCONSUMP BEEF KG_CAP A 1987 28.19191012
Australia MEATCONSUMP BEEF KG_CAP A 1988 28.92143335
Australia MEATCONSUMP BEEF KG_CAP A 1989 30.2827978
Australia MEATCONSUMP BEEF KG_CAP A 1990 28.22040625
Australia MEATCONSUMP BEEF KG_CAP A 1991 27.64857294
@sunnyuxuan
sunnyuxuan / Week6 homework.readme
Last active February 29, 2016 01:33
week6 homework
Give the lines mouseovers so that they look different (bolder, thicker, color change?) when the mouse is over them, using classes and d3.classed(). Use a mouseover function.
Give them d3 tooltips that identify what each line is, using the code I showed this week(not a plugin from the internet).
Label the outlier lines in the right margin (the highest or lowest, ones that are different) using the techniques in "Labeling Lines Directly." Identify what those lines are with short text.
Put a short description and identify the source above your chart.
scattor plot
Using the bar chart you made already, add a margin (using a margin object) to fix up your bar chart. Use an ordinal axis on the Y axis. Add an X axis label, and special color rule for your barchart (change one of the bars, or bars below or above mean/median to a different color). Also, label the end points of your bars with their actual values (see the SVG Text section of the notes above for tips). Add a hover rule to your CSS, so when the mouse is over the bar, it changes color a little.
@sunnyuxuan
sunnyuxuan / Week5 in class.readme
Last active February 10, 2016 03:50
Week5 In Class
better life data scatter plot
@sunnyuxuan
sunnyuxuan / Week4 homework3.readme
Last active February 8, 2016 21:04
week4 homework3
Using the model in d3_dynamic_domain.html, make your own barchart for your own data. Pick one of your numeric columns, and resize the SVG container to fit it. You can adjust range etc. as you like. Add text to the page saying what it is showing.
@sunnyuxuan
sunnyuxuan / index.html
Created February 8, 2016 05:34
Week4 homework2
<html lang="en">
<head>
<meta charset="utf-8">
<title>SVG Shapes</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
@sunnyuxuan
sunnyuxuan / Week4 homework.readme
Created February 8, 2016 05:27
Week4 homework1
Make a table like the one in d3_table_heatmap.html for your data. You can modify your existing table if you want. It should be sortable using stupidtable.js. Make a color scale for one of your numeric columns. You can use the scale on a font or the background.
THis is a sortable table