Plume 0.1.0 · announcements · Zulip Chat Archive

Stream: announcements

Topic: Plume 0.1.0

Luke Boswell (Jan 02 2025 at 21:38):

Announcing Plume v0.1.0 ... like a feather pen for drawing, but for charts

Plume is a roc package that is based on plotly.js with partial support for

Bar Charts
Scatter Charts
Sankey Charts
Fonts
Colors
Layouts

You can build graphs using any roc platform... though the examples all use basic-cli so they are easy to run.

I only started on this a couple of days ago, but thought I'd share what I have so far in case others are interested and would like to contribute or extend it. It's basically at a proof of concept stage, but so far it's been good fun to explore different API design ideas.

Here is a taste from the simple.roc example

title_font = Title.font [
    Font.family "Ringbearer",
    Font.size? 24,
    Font.style Italic,
]

axis_font = Title.font [
    Font.family "Courier New, monospace",
    Font.size? 18,
]

data : List (Str, F64)
data = [
    ("Apples", 2.1),
    ("Oranges", 3),
    ("Bananas", 4),
]

scatter =
    Scatter.new data
    |> Scatter.with_name "Fruit"
    |> Scatter.with_mode? "lines+markers"
    |> Scatter.with_marker [
        Marker.size 15.0,
        Marker.symbol? "diamond",
        Marker.color (rgba 124 56 245 255),
    ]
    |> Scatter.with_line [
        Line.width 2.0,
        Line.color (rgba 124 56 245 150),
        Line.dash? "dash",
    ]

chart =
    Chart.empty
    |> Chart.add_scatter_chart scatter
    |> Chart.with_layout [
        Layout.title [
            Title.text "Fruit Sales",
            title_font,
        ],
        Layout.y_axis [
            Title.text "Qty",
            axis_font,
        ],
    ]

File.write_utf8!? (Chart.to_html chart) "out.html"

simple.png

The motivation for making this is that my partner and I like to make a high-level personal budget using a "flow-analysis" occasionly. We find it helps us make financial decisions, and has been very helpful tool over the years.

We typically do this on a piece of paper, but I figured I'd give it a go using Roc to make a diagram instead this time around... it turned out really well!!

I've included a simple model and budget example in Plume in case others would like to see. It currently supports a json input like this, and generates a Sankey diagram.

{
  "scenario": "Baseline",
  "links": [
    { "source": "John", "target": "Income", "monthly": 1000 },
    { "source": "Mary", "target": "Income", "monthly": 1000 },
    { "source": "Income", "target": "House", "monthly": 1500 },
    { "source": "Income", "target": "Bills", "monthly": 500 },
    { "source": "Bills", "target": "Subscriptions", "monthly": 100 },
    { "source": "Bills", "target": "Water & Electricity", "monthly": 300 },
    { "source": "Bills", "target": "Internet", "monthly": 100 },
    { "source": "House", "target": "Rent", "monthly": 1000 },
    { "source": "House", "target": "Insurance", "monthly": 500 }
  ]
}