pmbrull

A Visualization Makeover

Mini Project from Udacity's Data Visualization and D3.js

The aim of this project is finding a graphic that does not fit into visualization's best practices, which can either make the viewer get mistaken information from it or difficult the information ingestion process. Therefore, we will get a graphic which we think can be improved, discuss the aspects that we feel were treated poorly and propose a better solution.

The chosen visualization is trying to help the reader compare how much time different countries guarantee of paternity leave. It was extracted from WTF Visualizations:

pmbrull

Lie with Pie Charts

Mostly the same logic from this other Gist - Visualization Makeover, can be applied in this example from Steve Jobs, where he was trying to make Apple look in a better than it actually was holding:

We can create a better and closer to reality graphic like this:

pmbrull

Exploring the Narrative

In this brief exercise of Udacity's visualization course, we focus on discussing the narrative structure and the flow of the story of an article. I chose Rating a Health Law's Success not only for the important message it sends, but for how well structured it is and its sober and simple, yet powerful style.

What is the narrative structure

Is is based on an author driven visualization, as it follows a predefined path where you can interact but not explore.

How does the visualization lead you through the data

You can scroll down to discover a series of statements and graphics that support them.

What is the story being told

pmbrull

class ApplicationServer(val port: Int) {
  val server = new Server()
  val connector = new ServerConnector(server)
  connector.setPort(port)
  server.addConnector(connector)

  val context = new ServletContextHandler(ServletContextHandler.SESSIONS)

  context.setBaseResource(Resource.newResource("frontend/target/UdashStatics/WebContent"))
  context.setContextPath("/")

pmbrull

Scala FP Notes

All of this has been extracted from https://typelevel.org/cats and https://www.scalawithcats.com/

Type Classes

Type classes are tools for polymorphism. We can use definitions of what we call type classes in order to define functions that are valid for a wider range of types A.

Here we can create different structures that hold some required properties that might not be present if we just played around types / subtypes.

pmbrull

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300&display=swap');

* {
    text-decoration: none !important;
    outline: none !important;
}

:root {
    --transition: all .4s cubic-bezier(0.8,0.04,0.4,1) !important;
    --font-serif: 'Cormorant Garamond', serif !important;

pmbrull

from pydantic import BaseModel


class Address(BaseModel):
    """
    Cat API Address definition
    """
    city: str
    zip_code: str
    number: int

pmbrull

my_json = {
    "name": "Lévy",
    "age": 3,
    "address": {
        "city": "Wonderland",
        "zip_code": "ABCDE",
        "number": 123
    }
}

pmbrull

from pydantic import ValidationError

bad_data = {
    "name": "Lévy",
    "age": "am I an age?",  # Note the type change here
    "address": {
        "city": "Wonderland",
        "zip_code": "ABCDE",
        "number": 123
    }

pmbrull

unnecessary_data = {
    "name": "Lévy",
    "age": 3,
    "key": "value",  # unnecessary
    "key2": "value2",  # unnecessary x2
    "address": {
        "city": "Wonderland",
        "zip_code": "ABCDE",
        "number": 123
    }