Skip to content

Instantly share code, notes, and snippets.

View Jennyandhuang's full-sized avatar

Chi Jennyandhuang

1 follower · 0 following
View GitHub Profile
@Jennyandhuang
Jennyandhuang / index.html
Last active January 8, 2021 21:24
Text Transition with D3
<!doctype html>
<html>
<head>
<!-- Load d3 source scripts -->
<script src="https://d3js.org/d3.v4.min.js" type="text/JavaScript"></script>
<!-- style section-->
<style>
.axis path{
@Jennyandhuang
Jennyandhuang / index.html
Last active January 8, 2021 17:27
Text Transitions
<!doctype html>
<html>
<head>
<!-- Load d3 source scripts -->
<script src="https://d3js.org/d3.v4.min.js" type="text/JavaScript"></script>
<!-- style section-->
<style>
.axis path{
@Jennyandhuang
Jennyandhuang / MultipleLinesChart-D3-Part5.js
Last active December 21, 2020 15:09
//append legends
var legend = d3.select("svg")
.selectAll('g.legend')
.data(sumstat)
.enter()
.append("g")
.attr("class", "legend");
legend.append("circle")
.attr("cx", 1000)
@Jennyandhuang
Jennyandhuang / MultipleLinesChart-D3-Part4.js
Last active February 18, 2021 20:55
//use .nest()function to group data so the line can be computed for each group
var sumstat = d3.nest()
.key(d => d.media)
.entries(data);
console.log(sumstat)
//set color pallete for different vairables
var mediaName = sumstat.map(d => d.key)
var color = d3.scaleOrdinal().domain(mediaName).range(colorbrewer.Set2[6])
@Jennyandhuang
Jennyandhuang / MultipleLinesChart-D3-Part3.js
Created December 14, 2020 04:01
//draw xAxis and xAxis label
xAxis = d3.axisBottom()
.scale(xScale)
d3.select("svg")
.append("g")
.attr("class", "axis")
.attr("transform", "translate(0,620)")
.call(xAxis)
.append("text")
@Jennyandhuang
Jennyandhuang / MultipleLinesChart-D3-Part2.js
Last active December 14, 2020 15:26
function lineChart(data) {
//DataSource: eMarketer, March 2018
var data = [
{ year: 2016, media: "Digital", spending: 72.2 },
{ year: 2017, media: "Digital", spending: 90.39 },
{ year: 2018, media: "Digital", spending: 107.3 },
{ year: 2019, media: "Digital", spending: 125.75 },
{ year: 2020, media: "Digital", spending: 142.23 },
{ year: 2021, media: "Digital", spending: 156.43 },
@Jennyandhuang
Jennyandhuang / index.html
Last active January 5, 2021 10:35
MultipleLinesChart D3
<!doctype html>
<html>
<head>
<!-- Load d3 source scripts -->
<script src="https://d3js.org/d3.v4.min.js" type="text/JavaScript"></script>
<script src="https://d3js.org/colorbrewer.v1.min.js"></script>
<!-- style section-->
<style>
@Jennyandhuang
Jennyandhuang / MultipleLinesChart-D3-Part1.html
Last active December 21, 2020 15:09
<head>
<!-- Load d3 source scripts -->
<script src="https://d3js.org/d3.v4.min.js" type="text/JavaScript"></script>
<script src="https://d3js.org/colorbrewer.v1.min.js"></script>
<!-- style section-->
<style>
.axis path{
stroke:black;
@Jennyandhuang
Jennyandhuang / TreeChart_D3.html
Created December 14, 2020 01:28
<!doctype html>
<html>
<head>
<script src="https://d3js.org/d3.v4.min.js" type="text/JavaScript"></script>
<style>
.rect {
fill: rgb(131, 192, 224);
stroke: white;
@Jennyandhuang
Jennyandhuang / read_zipfile.py
Last active March 28, 2024 08:14
Read a zip file directly in Python
#import packages
import pandas as pd
import os
import zipfile
#change directory
os.chdir('/Users/ChiHuang/Documents/python/python_files')
os.listdir()
#read zip file