CODEWITHSUNDEEP
ruby-on-railsrubyactiveadminchartkick
Juan Kou
Juan Kou

Reputation: 165

Rails Active Admin + Chartkick = Not working?

I was trying to use Chartkick to generate graph that shows on rails active admin dashboard. Here is the tutorial I am using: http://www.patrickedelman.com/simple-charting-for-activeadmin/

However, the graph did not show up, instead, it shows "Loading..."

I already include javascript_include_tag "//www.google.com/jsapi", "chartkick" and gem chartkick is installed, but it still does not work.

Please help! Thank you.

Upvotes: 7

Views: 3299

Answers (4)

Alicia Paz
Alicia Paz

Reputation: 41

For Active Admin on Rails 7

I added the following lines to my active_admin.rb (I'm using Highcharts):

ActiveAdmin.setup do |config|
  config.register_javascript "http://code.highcharts.com/highcharts.js"
  config.register_javascript "chartkick.js"
end

Upvotes: 1

vicente.fava
vicente.fava

Reputation: 370

If you want to include the js in the active admin file without rendering a partial, you can do this:

text_node javascript_include_tag 'https://www.gstatic.com/charts/loader.js', skip_pipeline: true

In my case I have a custom page and I added it in the content block

content do
  text_node javascript_include_tag 'https://www.gstatic.com/charts/loader.js', skip_pipeline: true

  columns do
    column do
      xxxx
    end
  end
end

I got the idea from here https://stackoverflow.com/a/61460749/3984542

Upvotes: 0

Pedro Schmitt
Pedro Schmitt

Reputation: 150

For Active Admin on Rails 6

After add the gem "chartkick", you need to add to app/assets/javascripts/active_admin.js:

//= require chartkick
//= require Chart.bundle

Upvotes: 7

Andrey Deineko
Andrey Deineko

Reputation: 52357

Don't forget to add #= require chartkick to active_admin.js.coffee.

To render a chart in AA dashboard, go with:

div class: 'custom-class' do
  h3 'Your name for a chart'
  @metric = Model.group(:attribute).count # whatever data you pass to chart
  render partial: 'metrics/partial_name', locals: {metric: @metric}
end

This file

partial: 'metrics/partial_name'

lays under app/views/metrics/partial_name directory, and could have the following structure:

_partial_name.html.haml:

= javascript_include_tag "//www.google.com/jsapi", "chartkick"
= pie_chart metric

Having this you should be ok with using chartkick.

Upvotes: 11

Related Questions