From 50f229a01be09d9f41aab59136ef2ddc6cbe866d Mon Sep 17 00:00:00 2001 From: Jim Vallandingham Date: Thu, 27 Feb 2020 16:37:12 -0800 Subject: [PATCH] update main page look. --- .gitignore | 3 +- Gemfile.lock | 62 ++--- ...-09-26-recreating_old_vis_with_new_tech.md | 2 +- ...011-10-20-visualizing_the_racial_divide.md | 2 +- ...5-kansas_city_streets_map_with_tilemill.md | 2 +- _posts/2013-10-18-mapping_seattle_streets.md | 2 +- _posts/2014-01-27-visualizing_bird_songs.md | 2 +- _posts/2014-03-18-experiments_repo.md | 2 +- _posts/2015-04-29-vintage_bump_chart.md | 2 +- _posts/2015-08-29-stereotropes.md | 2 +- css/style.css | 30 ++- index.html | 54 ++--- vis/index.html | 213 ++++++------------ 13 files changed, 169 insertions(+), 209 deletions(-) diff --git a/.gitignore b/.gitignore index e8a760d..6805513 100644 --- a/.gitignore +++ b/.gitignore @@ -2,4 +2,5 @@ */.DS_Store _site/* *~ -**/*~ \ No newline at end of file +**/*~ +.jekyll-cache \ No newline at end of file diff --git a/Gemfile.lock b/Gemfile.lock index de28e75..9a01602 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,57 +1,59 @@ GEM remote: http://rubygems.org/ specs: - addressable (2.5.2) - public_suffix (>= 2.0.2, < 4.0) + addressable (2.7.0) + public_suffix (>= 2.0.2, < 5.0) colorator (1.1.0) - concurrent-ruby (1.1.4) + concurrent-ruby (1.1.6) em-websocket (0.5.1) eventmachine (>= 0.12.9) http_parser.rb (~> 0.6.0) eventmachine (1.2.7) - ffi (1.10.0) + ffi (1.12.2) forwardable-extended (2.6.0) http_parser.rb (0.6.0) - i18n (0.9.5) + i18n (1.8.2) concurrent-ruby (~> 1.0) - jekyll (3.8.5) + jekyll (4.0.0) addressable (~> 2.4) colorator (~> 1.0) em-websocket (~> 0.5) - i18n (~> 0.7) - jekyll-sass-converter (~> 1.0) + i18n (>= 0.9.5, < 2) + jekyll-sass-converter (~> 2.0) jekyll-watch (~> 2.0) - kramdown (~> 1.14) + kramdown (~> 2.1) + kramdown-parser-gfm (~> 1.0) liquid (~> 4.0) mercenary (~> 0.3.3) pathutil (~> 0.9) - rouge (>= 1.7, < 4) + rouge (~> 3.0) safe_yaml (~> 1.0) - jekyll-sass-converter (1.5.2) - sass (~> 3.4) - jekyll-watch (2.1.2) + terminal-table (~> 1.8) + jekyll-sass-converter (2.1.0) + sassc (> 2.0.1, < 3.0) + jekyll-watch (2.2.1) listen (~> 3.0) - kramdown (1.17.0) - liquid (4.0.1) - listen (3.1.5) - rb-fsevent (~> 0.9, >= 0.9.4) - rb-inotify (~> 0.9, >= 0.9.7) - ruby_dep (~> 1.2) + kramdown (2.1.0) + kramdown-parser-gfm (1.1.0) + kramdown (~> 2.0) + liquid (4.0.3) + listen (3.2.1) + rb-fsevent (~> 0.10, >= 0.10.3) + rb-inotify (~> 0.9, >= 0.9.10) mercenary (0.3.6) pathutil (0.16.2) forwardable-extended (~> 2.6) - public_suffix (3.0.3) + public_suffix (4.0.3) rb-fsevent (0.10.3) - rb-inotify (0.10.0) + rb-inotify (0.10.1) ffi (~> 1.0) - rouge (3.3.0) - ruby_dep (1.5.0) - safe_yaml (1.0.4) - sass (3.7.3) - sass-listen (~> 4.0.0) - sass-listen (4.0.0) - rb-fsevent (~> 0.9, >= 0.9.4) - rb-inotify (~> 0.9, >= 0.9.7) + rouge (3.16.0) + safe_yaml (1.0.5) + sassc (2.2.1) + ffi (~> 1.9) + terminal-table (1.8.0) + unicode-display_width (~> 1.1, >= 1.1.1) + unicode-display_width (1.6.1) PLATFORMS ruby @@ -60,4 +62,4 @@ DEPENDENCIES jekyll BUNDLED WITH - 1.16.2 + 2.1.2 diff --git a/_posts/2011-09-26-recreating_old_vis_with_new_tech.md b/_posts/2011-09-26-recreating_old_vis_with_new_tech.md index 5a2fe09..9b82d84 100644 --- a/_posts/2011-09-26-recreating_old_vis_with_new_tech.md +++ b/_posts/2011-09-26-recreating_old_vis_with_new_tech.md @@ -2,7 +2,7 @@ layout: post title: Recreating Old Visualizations with New Technology categories: - - vis + - tutorial --- ### Using d3 and coffeescript to reproduce old charts diff --git a/_posts/2011-10-20-visualizing_the_racial_divide.md b/_posts/2011-10-20-visualizing_the_racial_divide.md index 1f059a4..88b91d5 100644 --- a/_posts/2011-10-20-visualizing_the_racial_divide.md +++ b/_posts/2011-10-20-visualizing_the_racial_divide.md @@ -2,7 +2,7 @@ layout: post title: Visualizing the Racial Divide categories: - - vis + - tutorial --- ### Using d3 and force-directed maps to see the impact of segregation in cities diff --git a/_posts/2012-04-05-kansas_city_streets_map_with_tilemill.md b/_posts/2012-04-05-kansas_city_streets_map_with_tilemill.md index ae46ef2..c3d700e 100644 --- a/_posts/2012-04-05-kansas_city_streets_map_with_tilemill.md +++ b/_posts/2012-04-05-kansas_city_streets_map_with_tilemill.md @@ -2,7 +2,7 @@ layout: post title: Kansas City Streets Visualized categories: - - vis + - tutorial --- ### Using Tilemill and OpenStreetMaps for Printable Map-Art diff --git a/_posts/2013-10-18-mapping_seattle_streets.md b/_posts/2013-10-18-mapping_seattle_streets.md index e3b166f..c945f35 100644 --- a/_posts/2013-10-18-mapping_seattle_streets.md +++ b/_posts/2013-10-18-mapping_seattle_streets.md @@ -2,7 +2,7 @@ layout: post title: Mapping Seattle - Streets categories: - - vis + - tutorial --- Recently, I’ve up-rooted my family and transplanted from Kansas City, MO to Seattle, WA. This represents the first major venture out of the Midwest for my wife, dauther, and myself. Its exciting and scary and fun and difficult. diff --git a/_posts/2014-01-27-visualizing_bird_songs.md b/_posts/2014-01-27-visualizing_bird_songs.md index 7bf7442..6f45938 100644 --- a/_posts/2014-01-27-visualizing_bird_songs.md +++ b/_posts/2014-01-27-visualizing_bird_songs.md @@ -4,7 +4,7 @@ title: Visualizing Bird Songs with Web Audio css: spectrogram.css source: https://github.com/vlandham/spectrogramJS categories: - - vis + - tutorial --- diff --git a/_posts/2014-03-18-experiments_repo.md b/_posts/2014-03-18-experiments_repo.md index 113375e..43db562 100644 --- a/_posts/2014-03-18-experiments_repo.md +++ b/_posts/2014-03-18-experiments_repo.md @@ -2,7 +2,7 @@ layout: post title: Experiments! categories: - - vis + - tutorial --- Want some more data visualization attempts, studies, and undertakings? Check out my new [Experiments Section](http://vallandingham.me/experiments/) diff --git a/_posts/2015-04-29-vintage_bump_chart.md b/_posts/2015-04-29-vintage_bump_chart.md index 2245686..0953d4d 100644 --- a/_posts/2015-04-29-vintage_bump_chart.md +++ b/_posts/2015-04-29-vintage_bump_chart.md @@ -6,7 +6,7 @@ twitter_type: summary description: img: categories: - - vis + - tutorial --- A quick shoutout for another vintage visualization I implemented in code: diff --git a/_posts/2015-08-29-stereotropes.md b/_posts/2015-08-29-stereotropes.md index ee8e20f..06c43c9 100644 --- a/_posts/2015-08-29-stereotropes.md +++ b/_posts/2015-08-29-stereotropes.md @@ -6,7 +6,7 @@ twitter_type: summary description: img: categories: - - vis + - tutorial ---
diff --git a/css/style.css b/css/style.css index dab8219..0a5aebf 100644 --- a/css/style.css +++ b/css/style.css @@ -1,5 +1,5 @@ a { - color: #6e6e6e; + color: #333; text-decoration: underline; } @@ -12,9 +12,27 @@ a img { border: 0; } -/*.banner { - max-width: 800px; -}*/ +.posts a { + text-decoration: none; +} + +.posts a:hover { + text-decoration: underline; +} + +.posts { + white-space: nowrap; +} + +#menu a:hover { + text-decoration: underline; +} + +@media only screen and (max-width: 750px) { + .post-date { + display: none; + } +} .heading-anchor { color: #ccc; @@ -174,6 +192,10 @@ a img { margin-bottom: 0.5rem; } +.main-body h2 { + padding-top: 20px; +} + .post { font-size: 1.8rem; line-height: 1.7; diff --git a/index.html b/index.html index bce37ac..49775e5 100644 --- a/index.html +++ b/index.html @@ -7,35 +7,35 @@ description: Visualizations by Jim Vallandingham. img: http://vallandingham.me/images/vis/vis_card.png --- -
-

Tutorials & Posts

-
    - {% for post in site.categories.tutorial %} -
  • {{ post.title }}
    • - {% endfor %} -
-

Visualizations

- +
+

Writing

+ {% for post in site.categories.tutorial %} +
+
+ {{ post.title }} +
+
+ {{ post.date | date: "%Y-%m-%d"}} +
+
+ {% endfor %} -

Talks & Workshops

- +

Talks

+ {% for post in site.categories.talk %} +
+
{{ post.title }}
+
+ {% endfor %} -

Random Collections

- -
+ diff --git a/vis/index.html b/vis/index.html index 3ef86bc..e2f097e 100644 --- a/vis/index.html +++ b/vis/index.html @@ -32,26 +32,23 @@

for both the individuals being governed, and good in the amount of wealth produced.

- -

- Good Governments Help People Succeed -

-

- R Notebook Analysis -

-

- Source Code -

+

@@ -74,7 +71,7 @@

- How Long Does it Take to (Quick) Draw a Dog?

@@ -105,9 +102,7 @@

cancer cell types.

- HMS Cancer Browser + HMS Cancer Browser

@@ -131,9 +126,7 @@

- A Data Driven Exploration of Kung Fu Films

@@ -160,19 +153,17 @@

The end result is an interactive tool that can be used by consumers and researchers to explore, discover, and research Internet help problems.

- -

- Measurement Lab Vis -

-

- Our Bocoup.com Writeup on this Project -

+ @@ -192,7 +183,7 @@

NP Legends

dozen times in your life. NP Legends serves to begin to provide an answer on this very important topic.

-

NPLegends

+

NPLegends

@@ -213,9 +204,7 @@

from OpenVis Conf speakers is most popular?

- OpenVis Conf Tweets + OpenVis Conf Tweets

@@ -236,9 +225,7 @@

of speakers!

- Web of Speakers + Web of Speakers

@@ -261,9 +248,7 @@

Check it out here!.

- TextArc in D3 + TextArc in D3

@@ -288,10 +273,7 @@

on our case study.

- Buoyant Prototype Case Study

@@ -315,9 +297,7 @@

Who knows, you might find something you like.

- Experiments! + Experiments!

@@ -337,9 +317,7 @@

An interactive exploration of a set of stocks in a hypothetical portfolio

- Stock Display + Stock Display

@@ -365,9 +343,7 @@

came to be.

- Stereotropes + Stereotropes

@@ -395,16 +371,7 @@

>.

- Vintage Bump Chart -

-

- Lessons Learned Implementing + Vintage Bump Chart

@@ -430,18 +397,16 @@

are an interesting way to visualize audio over time - and this project let's you create spectrograms on the fly - in the browser!

-

- Bird Song Spectrograms -

-

- SpectrogramJS -

+ @@ -467,9 +432,7 @@

sources.

- Seattle Atlas + Seattle Atlas

@@ -499,7 +462,7 @@

- Automatic Sentence Drawings

@@ -526,9 +489,7 @@

- Interactive Small Multiples

@@ -547,29 +508,21 @@

/>

An experiment that allows users to explore their most-listened to songs, - and the tags associated with these songs. -

-

- User names are faked - but the rest of the data is real. User-song play - counts come from the + and the tags associated with these songs. User names are faked - but the + rest of the data is real. User-song play counts come from the Million Song Dataset. Tag data comes from - Last.fm + Last.fm.

Visualization includes a force-directed layout with tag nodes suspended in - a circular orientation. -

-

- Song nodes are drawn towards the tags they are associated with. Also enjoy - the dot plot and interactive slopegraph! + a circular orientation. Song nodes are drawn towards the tags they are + associated with. Also enjoy the dot plot and interactive slopegraph!

- Track Tag Love + Track Tag Love

@@ -598,14 +551,10 @@

Remix this and enjoy!

- Everything is a Remix + Everything is a Remix

- Remix Github Repo + Remix Github Repo

@@ -638,14 +587,12 @@

Compare Neighborhoods

Find Your Ideal Neighborhood @@ -684,7 +631,6 @@

How to Animate Transitions Between Multiple Charts @@ -722,7 +668,6 @@

How to Make an Interactive Network Visualization @@ -759,9 +704,7 @@

- Small Multiples with Details on Demand

@@ -797,7 +740,7 @@

goes over the details of the implementation.

- Word Frequency Bubble Clouds

@@ -837,7 +780,7 @@

- Animated Bubble Chart of Gates Educational Donations

@@ -874,7 +817,7 @@

- Stowers Group Collaboration Network

@@ -912,9 +855,7 @@

- GSA-Leased Opportunity Dashboard

@@ -942,9 +883,7 @@

- Feltronifier + Feltronifier

@@ -972,7 +911,7 @@

>. Works best in Google Chrome

- We're In The Money: How Much Do The Movies We Love Make?

@@ -1009,7 +948,7 @@

Google Chrome.

- Visualizing The Racial Divide

@@ -1039,9 +978,7 @@

- Earworms vs Humdrums + Earworms vs Humdrums

@@ -1086,17 +1023,17 @@