gem p5rb -- Ruby DSL for p5.js
It builds an HTML document with the JS boilerplate included.
It has some built-ins for charting.
It has some p5.js related sugar, such as:
- optional
:fillarg to set color per operation
TODO:
- cuprite test Github Action
- validate args on Ruby level
- plotting library
- move plotting from ruby to js level for using client window size
- https://en.wikipedia.org/wiki/Chart
- Scatter plot
- Bar chart
- Grouped bar chart
- Stacked bar chart
- Area chart
- https://en.wikipedia.org/wiki/Line_chart
- https://en.wikipedia.org/wiki/Heat_map
- https://en.wikipedia.org/wiki/Recurrence_plot
- https://en.wikipedia.org/wiki/List_of_graphical_methods
- https://en.wikipedia.org/wiki/Vector_field
- https://en.wikipedia.org/wiki/Radar_chart
- https://en.wikipedia.org/wiki/Data_and_information_visualization
- https://en.wikipedia.org/wiki/Streamgraph
- ...
examples
scatter plot
# all = <integer>[n][2]
(x_min, x_max), (y_min, y_max) = all.transpose.map(&:minmax)
f = ->x,y{ [
(x - x_min).fdiv(x_max - x_min) * 500,
(y_max - y).fdiv(y_max - y_min) * 500,
] }
require "p5rb"
P5 500, 500 do
setup do
all.each{ |x,y| point *f[x,y] }
end
end.tap &method(:puts)
or use the built-in P5.plot_scatter <integer>[n][2]:
$ curl https://storage.yandexcloud.net/gems.nakilon.pro/p5rb/all.tsv > all.tsv
$ ruby -rp5rb -e 'puts P5.plot_scatter $<.map{ |_| _.split.map &:to_f }, reverse_y: true' all.tsv > temp.htm
chess board FEN format renderer
$ cd examples/fen
$ bundle install
$ bundle exec ruby main.rb "r3r2k/p1n2pb1/3p3p/1ppP1qN1/4N3/P3P3/1PQ2PP1/R4K1R w - - 0 1" > temp.htm
$ open temp.htm
# ...
require "p5rb"
puts( P5(500, 500) do
setup do
textSize 65
textAlign :CENTER, :CENTER
translate 50, 50
rect 0, 0, 400, 400, fill: 240
noStroke
[*0..7].product([*0..7]) do |i, j|
rect j*50, i*50, 50, 50, fill: 180 if (i+j).odd?
end
pieces.each do |x, y, piece|
text piece, (x+0.5)*50, (y+0.5)*50, fill: 0
end
end
end )
dot strip plot
grouped bar chart
require "p5rb"
require "yaml"
puts P5.plot_bar_grouped YAML.load DATA.read
__END__
---
2022-11-12:
user82827122: 17
user31604664: 18
user824572411: 2
2022-11-13:
user31604664: 11
user82827122: 23
2022-11-14:
...
stacked bar chart
