Chart Bibz

Use Chartjs with ruby. Generate your chart in one ruby line.

Usage

How to use the plugin.

# @param data [Hash] Data
# @param options [Hash] The chart type and the chartjs options
# @param html_options [Hash] The canvas html options
# @return [String] The Canvas Html
chart data, options, html_options

Example

data = {
  datasets: [{
    barPercentage: 0.5,
    barThickness: 6,
    maxBarThickness: 8,
    minBarLength: 2,
    data: [10, 20, 30, 40, 50, 60, 70]
  }]
}
options = { type: :bar, scales: { yAxes: [{ ticks: { beginAtZero: true } }] } }
html_options = { id: "my-chart", width: 100, height: 520 }

chart data
# or
chart data, options, html_options

Installation

Add this line to your application's Gemfile:

gem 'chart_bibz'

And then execute:

$ bundle
$ yarn add chart.js

Or install it yourself as:

$ gem install chart_bibz

Add this line in your js file, by example app/javascript/packs/application.js

...
document.querySelectorAll(".chart-bibz").forEach(function(canvasEl){
  let type = canvasEl.getAttribute("data-cb-type")
  let options = JSON.parse(canvasEl.getAttribute("data-cb-options"))
  let data = JSON.parse(canvasEl.getAttribute("data-cb-data"))
  let ctx  = canvasEl.getContext('2d')

  new Chart(ctx, { type: type, data: data, options: options })
})
...

That's it !

License

The gem is available as open source under the terms of the MIT License.