How to create funnel chart widget using chameleon gem

I was creating funnel chart widget, but I could not find relevant resource to create using “chameleon” gem. After several search I found from one of their commit. So, I decided to post how I created step by step.

Step 1: Add “chameleon” gem in your Gemfile and run bundle install in your terminal

Step 2: Create funnel widget by typing following command in your terminal

  rails g chameleon:widget my_funnel_chart funnel 

Step 3: Open your “widget_name” from widget directory and edit as per your settings. For e.g.

  widget :my_funnel_chart do
    key "bef4c269c4274fef966aeb68ff4aa975a57b3368"
    type "funnel"
    data do
      {
        :reverse => true,
        :hide_percentage => true,
        :items => [ 
          {:value => query1, :label => "label1"}, 
          {:value => query2, :label => "label2"}, 
          {:value => query3, :label => "label3"}, 
          {:value => query4, :label => "label4"}, 
          {:value => query5, :label => "label5"}, 
          {:value => query6, :label => "label6"}
        ]
      }
    end
  end

Step 4: Go to dashboard of GeckoBoard click Add widget » Custom Charts » Funnel Chart

Step 5: Feed url data. For e.g.

  http://myapp.com/widgets/my_funnel_chart?key=<yourkey>

and add settings as per your need

*Note:

Settings for funnel chart widget

:reverse => true

“true” to reverse the colours or “false”(by default it is false, so you don’t need to add “reverse” key for false) for normal

:hide_percentage => true

“true” to hide the % or “false”(by default it is false, so you don’t need to add “hide_percentage” key for false) to show it