integral424 / elm-pivot-table / PivotTable

This package provides a pivot table view function with which you can analyze and visualize your data by grouping various fields.

Definition


type Table row

In this package, a table is defined as a list of rows.

In the most naive case, a table may be represented by a list of records like:

type alias Person =
    { name : String
    , age : Int
    , gender : Gender
    }

type Gender
    = Male
    | Female

type alias MyTable =
    Table Person

Note: Notice that rows can be any type.


type alias Field row a =
row -> a

In this package, a field is defined as a function from row to something.

Table operations

makeTable : List row -> Table row

A function to create a table.

Since the Table is an opaque type, all user of this package must use this function to create a Table value.

getField : Field row a -> Table row -> List a

A function to get values from a table.

With the example appeared in the Table doc, each field can be accessed like:

nameField = .name
ageField = .age
genderField = .gender

myTable : MyTable
myTable = makeTable
    [ { name = "Alice",   age = 17, gender = Female }
    , { name = "Bob",     age = 8,  gender = Male   }
    , { name = "Charlie", age = 35, gender = Male   }
    ]

getField nameField myTable   -- ["Alice", "Bob", "Charlie"]
getField ageField myTable    -- [17, 8, 35]
getField genderField myTable -- [Female, Male, Male]

Note: Notice that a field does not have to be a record element. This is a valid code:

nameInitialLetterField = .name >> String.left 1

getField nameInitialLetterField myTable -- ["A", "B", "C"]

Pivot table

In this package, a pivot table is a table to show values grouped by some fields.

Example 1

genderToString : Gender -> String
genderToString gender =
    case gender of
        Male   -> "Male"
        Female -> "Female"

pivotTable
    { rowGroupFields = []
    , colGroupFields = [ genderField ]
    , aggregator = List.length
    , viewRow = always Element.none
    , viewCol = Element.text
    , viewAgg = String.fromInt >> Element.text
    }
    myTable

The code above produces a table:

|Male |Female |
|-----|-------|
|2    |1      |


type alias Aggregator row agg =
List row -> agg

The pivot table groups table rows. After that, the Aggregator aggregates the list of rows into a single value (of any type).

pivotTable : { rowGroupFields : List (Field row comparable1), colGroupFields : List (Field row comparable2), aggregator : Aggregator row agg, viewRow : comparable1 -> Element msg, viewCol : comparable2 -> Element msg, viewAgg : agg -> Element msg } -> Table row -> Element msg

Draws a pivot table.

pivotTableHtml : { rowGroupFields : List (Field row comparable1), colGroupFields : List (Field row comparable2), aggregator : Aggregator row agg, viewRow : comparable1 -> Html msg, viewCol : comparable2 -> Html msg, viewAgg : agg -> Html msg } -> Table row -> Html msg

Draws a pivot table of Html type.

This view makes use of grid attributes of html table. Use this view function when you want to avoid using elm-ui.