From charlesreid1

No edit summary
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
D3 calendar chart
==Notes==


Wrapping this up, but some useful tools for the colormaps:
Outline:
* Start with original example: https://bl.ocks.org/mbostock/4063318
* How to go about implementing this ourselves?
* Basically two components:
* Format for the data
* Colormap for the calendar


webcolors: https://github.com/ubernostrum/webcolors/
Lay out these two steps, focusing on these two steps only (ignore rest of code)
* This script visualizes days of the year
* Look at the data provided - what format is it in?
* How are missing values handled - do we need one date for every day of the year? (No)
* Colormap is simple - hard-coded values
* Colormap tools - how to use colorbrewer or Python matplotlib to create custom color maps


cmocean: https://matplotlib.org/cmocean/
How the entire visualization is organized:
* Colormaps
* Canvas data are years, linked to shapes
* Write text for years
* Draw a blank tile representing day of the year (use built-in date manipulation to determine which week the date is in, which gives you x, and the day of the week, which gives you y)
* Draw outlines of months (probably the most complicated part of this visualization)
* Load the data and create colored tiles from the data


yt volume visualization: http://yt-project.org/doc/index.html
==Other==
 
text color: change fill attribute https://duckduckgo.com/?q=d3+text+color&t=ffab&ia=qa


Original example: https://bl.ocks.org/mbostock/4063318


==Flags==


[[Category:2018]]
[[Category:2018]]

Latest revision as of 00:10, 16 February 2018

Notes

Outline:

  • Start with original example: https://bl.ocks.org/mbostock/4063318
  • How to go about implementing this ourselves?
  • Basically two components:
  • Format for the data
  • Colormap for the calendar

Lay out these two steps, focusing on these two steps only (ignore rest of code)

  • This script visualizes days of the year
  • Look at the data provided - what format is it in?
  • How are missing values handled - do we need one date for every day of the year? (No)
  • Colormap is simple - hard-coded values
  • Colormap tools - how to use colorbrewer or Python matplotlib to create custom color maps

How the entire visualization is organized:

  • Colormaps
  • Canvas data are years, linked to shapes
  • Write text for years
  • Draw a blank tile representing day of the year (use built-in date manipulation to determine which week the date is in, which gives you x, and the day of the week, which gives you y)
  • Draw outlines of months (probably the most complicated part of this visualization)
  • Load the data and create colored tiles from the data

Other

Original example: https://bl.ocks.org/mbostock/4063318

Flags