Data Visualization and D3.js Newsletter Issue 146

DashingD3js.com Weekly Data Visualization and D3.js Newsletter

Hi Friends -


Welcome to issue 146 of the DashingD3js.com Weekly Newsletter.
 

Onwards to this week's links...
 

Featured
 

  • Rendering Big Geodata On The Fly With GeoJSON-VT
    Despite the amazing advancements of computing technologies in recent years, processing and displaying large amounts of data dynamically is still a daunting, complex task. However, a smart approach with a good algorithmic foundation can enable things that were considered impossible before...Let’s see if Mapbox GL JS can handle loading a 106 MB GeoJSON dataset of US ZIP code areas with 33,000+ features shaped by 5.4+ million points directly in the browser (without server support)...
  • Lyric Typing - Type The Words In Time With Music!
    Hearing lyrics while typing them creates an interesting synesthesia like effect, recontextualizing familiar music...This version uses YouTube for the music and I've baked in the lyrics for just 5 songs...[code on github]...
 

Data Visualization Reading and Videos
 

  • Introduction To Cycle Plots [PDF]
    A cycle plot (Cleveland, Dunn, and Terpenning, 1978) shows both the cycle or trend and the day-of-the-week or the month-of-the-year effect. Thus the cycle plot retains the strengths of both more common plots illustrated above without either of their weaknesses. This article introduces the cycle plot and offers before and after examples to compare presentations using line charts with separate lines for each period and cycle plots...
  • People-Powered Data Visualization
    Through crowdsourcing and citizen science projects, the general public is making profound contributions to research. Can data visualization help make sense of this wealth of new information?...
  • Canvas Animations On Maps
    Earlier this month, I discussed techniques for animation with canvas, sketching out how you can simulate motion and produce graphics, videos, and GIFs. You can draw anything with Canvas's primitives - lines, polygons, images, text - but I didn't explain how to do maps. Maps are just glorified charts, but you'll need the right tools and concepts to create them in Canvas. Let's see how...
  • 3D Maps Of Every London UK Underground Station
    TfL has released another batch of documents which show every underground station in glorious 3D format...They are technically axonometric diagrams, which is 3D-like, but not to scale, which becomes obvious when you see some of the vertiginous descents offered on some stairs and escalators...In total, some 120 stations are represented in this motherlode of tube and map geekery. I’ve removed the redacted black blobs that are scatted over the originals, and generally cleaned them up a bit...
  • MoMA On GitHub: A Visual Exploration Of MoMA's Collection Data
    The Museum of Modern Art has followed in the footsteps of Tate and Cooper Hewitt and published their collections data on GitHub...As I’m currently in the final phase of my PhD, I have to dedicate more time to writing and less to doing. Even so I can’t let MoMA’s datasets go by unnoticed...
 

D3.js Reading and Videos
 

  • Embedding D3 In An IPython Notebook
    ...With all this taken care of, there isn’t really much else to do! We now have interactive visualizations! After this, it’s up to you to write whatever you want in D3. This sort of embedding might be useful if you want to pass around analysis and visualization source code all-in-one, so that a collaborator can immediately reproduce a given result and help tweak your visualizations. If you’re giving a talk, it’s very useful for instructive purposes!...
  • React <-> D3 Resources
    This is a incomplete list of resources on how to link react & d3. To my experience, there are as many approaches as there are (enter something numerous here). These approaches mostly differ as to 'who' has control over the dom and does the transitions etc. That distinction either requires the user to know more about react or d3, vice versa. Some of the approaches (like react-d3 or react-d3-components) include prebuilt charts, other just provide frameworks to place your charts in...
  • k-means++ Silhouettes
    This post is an explanation of the k-means++ method and how to interpret results using silhouettes. I’ve wanted to write about this topic since the inception of this website because of its simplicity and elegance. Devised in 2007 by Arthur and Vassilvitskii, k-means++ solves the NP-hard problem of how to choose centroids in the naive k-means clustering problem and provides an answer that is provably close to the optimum clustering solution...
  • D3 MapRenderer
    A python QGIS plugin to export of polygons, polylines and point vector layers from shapefiles to topojson for display within a web page using the d3.js JavaScript library, with additional options of popup information based on d3-tip, charts from c3.js and a legend...

Hope that you had a great past week and that next week is even better!

Wishing you the best, 
Sebastian Gutierrez
@DashingD3js
www.dashingd3js.com

Want to better understand this topic?
Check out these super-useful D3.js Screencast Videos (1 in 3 are free...)
=> D3 Screencasts Videos