Slo*_*boy 9 ruby charts ruby-on-rails chartkick
在我的ROR中,我想将Percentages添加到我的Piechart中,我正在使用chartkickgem来渲染饼图.我已经尝试了各种方法解决这个问题,但似乎没有办法.我也用Google搜索并查看堆栈溢出时的类似帖子.
这是我想出来的,但它没有显示%.
<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {legend: {labelFormat: '{name} : {y} ({percentage}%)'}} %>
我也试过这种方法,但还是运气不错
<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value-and-percentage'} %>
请更有经验的人帮助我吗？
更新OSCAR的答案
我按照奥斯卡答案提供的指示,但仍未显示%.
这是怎么<head>的 application.html.erb样子:
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= javascript_include_tag "path/to/highcharts.js", "chartkick" %>
这appplication.js是这样的:
//
//= require jquery
//= require jquery_ujs
//= require bootstrap-sprockets
//= require turbolinks
//= require_tree .
我有与此类似的问题。所以Chart.bundle不提供饼图的选项
取而代之的是，您可以使用此处文档中指定的Google图表
因此，您要做的就是//= require Chart.bundle从application.js中删除
转至application.html.erb或用于显示视图及之前的布局，<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>或用于加载js libs add的类似内容<%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %>。它看起来像这样：
<%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
还有！我也注意到您在代码中缺少“]”。修复您可以使用以下方法运行图表：
<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total], ["Baseball", @baseball_total], ["Other", @other_total ]] %>
您应该能够看到百分比而无需添加任何选项
如果要自定义图表选项，则可以在此处查看文档
编辑：您application.js应该看起来像这样
//= require jquery
//= require jquery_ujs
//= require chartkick
//= require bootstrap-sprockets
//= require turbolinks
//= require_tree .
和您的application.html.erb or the layout that you are using at your controller likethis（在不需要时最后删除highcharts.js include_tag）：
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
嘿你可以在这里找到更好的东西
根据我的意见，你可以尝试这个代码。而不是这个
<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value-and-percentage'} %>
你可以试试这个
<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value'} %>
嘿，您可以将以下代码放入标头中。
<script> https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.js</script>
<script> https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.min.js</script>
<script> https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.js</script>
<script> https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.min.js</script>
| 归档时间： |
|
| 查看次数： |
1454 次 |
| 最近记录： |