title: Chartkick Pie chart not showing percentages when using library options
body: <p>In my ROR I want to add Percentages to my Piechart, I'm using the <code>chartkick</code> gem to render the Pie chart. I've tried various approaches to the problem, but none seems to work. I've also googled around and look at similar posts at stack overflow. </p>
  
  <p>This is what I've come up with but it's not showing the %.</p>
  
  <pre><code> &lt;%= pie_chart [["Soccer", @soccer_total], ["Basketball",  @basketball_total, ["Baseball",  @baseball_total], ["Other", @other_total ]], library: {legend: {labelFormat: '{name} : {y} ({percentage}%)'}} %&gt;
  </code></pre>
  
  <p>I've also tried this approach, but still with out a luck</p>
  
  <pre><code>&lt;%= pie_chart [["Soccer", @soccer_total], ["Basketball",  @basketball_total, ["Baseball",  @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value-and-percentage'} %&gt;
  </code></pre>
  
  <p>Please can someone more experienced help me with this?</p>
  
  <p><strong>UPADATE FOR OSCAR'S ANSWER</strong></p>
  
  <p>I followed the directions provided for Oscar's answer but its still not showing %.</p>
  
  <p>This how the <code>&lt;head&gt;</code>in  <code>application.html.erb</code> looks:</p>
  
  <pre><code>  &lt;%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' =&gt; true %&gt;
    &lt;%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %&gt;
    &lt;%= javascript_include_tag 'application', 'data-turbolinks-track' =&gt; true %&gt;
    &lt;%= javascript_include_tag "path/to/highcharts.js", "chartkick" %&gt;
  </code></pre>
  
  <p>and the <code>appplication.js</code> is like this:</p>
  
  <pre><code>//
  //= require jquery
  //= require jquery_ujs
  //= require bootstrap-sprockets
  //= require turbolinks
  //= require_tree .
  </code></pre>