nim-plotly: simple plots in nim

This is a functioning plotting library. It supports, line (with fill below), scatter (with errors), bar , histogram, heatmap, candlestick and combinations of those plot types. More standard types can be added on request.

This is not specifically for the javascript nim target (but the javascript target is supported!).

Internally, it serializes typed nim datastructures to JSON that matches what plotly expects.

Examples

See a collection of real-world examples in the wiki

Simple Scatter plot

import plotly
import chroma

var colors = @[Color(r:0.9, g:0.4, b:0.0, a: 1.0),
               Color(r:0.9, g:0.4, b:0.2, a: 1.0),
               Color(r:0.2, g:0.9, b:0.2, a: 1.0),
               Color(r:0.1, g:0.7, b:0.1, a: 1.0),
               Color(r:0.0, g:0.5, b:0.1, a: 1.0)]
var d = Trace[int](mode: PlotMode.LinesMarkers, `type`: PlotType.Scatter)
var size = @[16.int]
d.marker =Marker[int](size:size, color: colors)
d.xs = @[1, 2, 3, 4, 5]
d.ys = @[1, 2, 1, 9, 5]
d.text = @["hello", "data-point", "third", "highest", "<b>bold</b>"]

var layout = Layout(title: "testing", width: 1200, height: 400,
                    xaxis: Axis(title:"my x-axis"),
                    yaxis:Axis(title: "y-axis too"), autosize:false)
var p = Plot[int](layout:layout, traces: @[d])
p.show()

The show call opens a browser pointing to a plot like above, but the actual plot will be interactive.

Scatter with custom colors and sizes

source

Multiple plot types

source

Stacked Histogram

source

Other examples

in examples

Note about C & JS targets / interactive plots

The library supports both the C as well as Javascript targets of Nim. In case of the C target, the data and layout is statically parsed and inserted into a template Html file, which is stored in /tmp/x.html. A call to the default browser is made, which loads said file. The file is deleted thereafter.

This static nature has the implication that it is not possible to update the data in the plots. However, thanks to Nim's ability to compile to Javascript, this can still be achieved if needed. When compiling to the JS target the native plotly functions are available, including react and restyle, which allow to change the data and / or layout of a plot defined in a div container. See the fig8_js_interactive.nim for such an example.

Note about plotly under Windows Subsystem for Linux (WSL)

Starting from version v0.3.0 of plotly, WSL is supported. This requires the user to define the BROWSER environment variable and assumes the user wishes to use a normal Windows browser.

When setting the BROWSER variable, make sure to handle the possible spaces (e.g. if browser installed in Program Files) by either escaping spaces and parenthesis with a backslash or just putting the whole path into quotation marks. E.g:

export BROWSER="/mnt/c/Program Files (x86)/MyBrowserCompany/Browser.exe"

to set the variable for the local session.

TODO

• add .show() method to plot which looks for and opens a browser (similar to python webbrowser module)
• support multiple axes (2 y-axes supported).
• experiment with syntax for multiple plots (https://plot.ly/javascript/subplots/ or use separate divs.)
• better side-stepping of nim-lang/Nim#7794
• convert % procs into macros so I don't have to re-write the same code over and over.
• more of plotly API
• ergonomics / plotting DSL
• custom interactivity.