Wykres kołowy wykresu nie pokazuje wartości procentowych podczas korzystania z opcji biblioteki

W moim ROR Chcę dodać wartości procentowe do mojego Piechart, używam klejnotu chartkick do renderowania wykresu kołowego. Próbowałem różnych podejść do problemu, ale żaden nie wydaje się działać. Przeszukałem też inne witryny i spojrzałem na podobne posty przy przepełnieniu stosu.Wykres kołowy wykresu nie pokazuje wartości procentowych podczas korzystania z opcji biblioteki

Oto, co wymyśliłem, ale nie pokazuje%.

<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {legend: {labelFormat: '{name} : {y} ({percentage}%)'}} %>

Ja również próbowałem tej metody, ale nadal z obecnie szczęścia

<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value-and-percentage'} %>

proszę może ktoś bardziej doświadczony mi w tym pomóc?

UPADATE Oscar'S ODPOWIEDZI

I po kierunkach przewidzianych odpowiedź Oscar, ale jej jeszcze nie pokazano%.

ten sposób <head> w application.html.erb wygląda:

<%= 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" %>

i appplication.js jest tak:

// 
//= require jquery 
//= require jquery_ujs 
//= require bootstrap-sprockets 
//= require turbolinks 
//= require_tree .

Źródło

2017-09-07 Slowboy

hej można znaleźć coś lepszego here

Zgodnie moim zdaniem, może spróbować tego kodu. Zamiast tego

<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value-and-percentage'} %>

Można spróbować to

<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total, ["Baseball", @baseball_total], ["Other", @other_total ]], library: {pieSliceText: 'value'} %>

Hey można Puth poniżej kod w nagłówku.

<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>

Źródło

2017-09-07 12:22:09

Dziękuję @Ronak Bhatt ale rozwiązanie nie jest coś zmienia, nadal nie widać procent – Slowboy

Miałem podobny problem przy pracy z tym. Więc Chart.bundle nie przewiduje możliwości wykresu kołowego

Zamiast tego można użyć Google Charts, jak określono w dokumentacji here

Więc co trzeba zrobić, to usunąć //= require Chart.bundle z application.js

Go do application.html.erb lub układu, którego używasz do wyświetlania widoku i przed <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> lub coś podobnego, co masz do ładowania js libs dodaj <%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %>. Będzie wyglądać tak:

<%= javascript_include_tag "https://www.gstatic.com/charts/loader.js" %> 
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

I jest !. Zauważyłem również, że brakuje ci "]" kodu.Ustalające, które można uruchomić wykres z tym:

<%= pie_chart [["Soccer", @soccer_total], ["Basketball", @basketball_total], ["Baseball", @baseball_total], ["Other", @other_total ]] %>

Powinieneś być w stanie zobaczyć procentowe bez dodawania żadnych opcji

Jeśli chcesz dostosować opcje wykresu następnie można zobaczyć dokumentację here

EDIT: Ty application.js powinien wyglądać ten

//= require jquery 
//= require jquery_ujs 
//= require chartkick 
//= require bootstrap-sprockets 
//= require turbolinks 
//= require_tree .

i twoi application.html.erb or the layout that you are using at your controller like ten (usunięcia tego HIG hcharts.js include_tag w końcu nie trzeba go):

<%= 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 %>

Źródło

2017-09-09 21:18:20

Dziękuję @Oscar Łuża, ja próbował zmodyfikować pliki zgodnie z Twoją odpowiedzią, ale nadal nie pokazuje% na wykresie. Zobacz moją edycję pytania. – Slowboy

na ciebie application.js brakuje tego '// = wymaga wykreślacza' –

@Slowboy usuń tylko '// = wymagaj Chart.bundle', a nie drugiej linii, spójrz na edycję –

Wykres kołowy wykresu nie pokazuje wartości procentowych podczas korzystania z opcji biblioteki

Odpowiedz

Powiązane problemy