2017-09-07 12 views
8

मेरे आरओआर में मैं अपने पिकार्ट में प्रतिशत जोड़ना चाहता हूं, मैं पाई चार्ट प्रस्तुत करने के लिए chartkick मणि का उपयोग कर रहा हूं। मैंने समस्या के विभिन्न दृष्टिकोणों की कोशिश की है, लेकिन कोई भी काम नहीं करता है। मैंने स्टैक ओवरफ्लो पर भी चारों ओर गुगल किया है और इसी तरह की पोस्ट को देखा है।लाइब्रेरी विकल्प का उपयोग करते समय चार्टकिक पाई चार्ट प्रतिशत दिखा नहीं रहा है

यही वह है जो मैं आया हूं लेकिन यह% नहीं दिखा रहा है।

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

कृपया इस के साथ किसी अधिक अनुभवी मदद कर सकते हैं मुझे बाहर के साथ?

ऑस्कर के जवाब

लिए

UPADATE मैं ऑस्कर के जवाब लेकिन इसकी अभी भी दिखाई नहीं% के लिए प्रदान किए गए दिशानिर्देशों का पालन किया।

यह कैसे application.html.erb में <head> दिखता है:

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

उत्तर

3

हे आप पा सकते हैं कुछ बेहतर here

मेरी राय के अनुसार, आप इस कोड को आजमा सकते हैं। इस

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

अरे आप अपने शीर्षक में कोड नीचे Puth कर सकते हैं कर सकते हैं।

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

धन्यवाद @Ronak भट्ट लेकिन अपने समाधान के लिए कुछ भी नहीं बदल रहा है, अभी भी प्रतिशत – Slowboy

4

मैं एक ऐसी ही इस के साथ काम करने की समस्या थी। तो Chart.bundle प्रदान नहीं करता है पाइ चार्ट के लिए विकल्प

इसके बजाय कि प्रलेखन पर निर्दिष्ट के रूप में आप गूगल चार्ट का उपयोग कर सकते

here

तो तुम क्या करना है application.js

जाओ से //= require Chart.bundle हटाने है कि application.html.erb या लेआउट जिसे आप अपना दृश्य दिखाने के लिए उपयोग कर रहे हैं और <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> से पहले या जेएस libs लोड करने के लिए आपके पास कुछ ऐसा है जो <%= 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 ]] %> 

आप किसी भी विकल्प

जोड़े बिना प्रतिशत देखने के लिए आप चार्ट विकल्पों को अनुकूलित चाहते हैं तो आपको प्रलेखन देख सकते हैं सक्षम होना चाहिए here

संपादित करें: आप 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 like इस (कि hig हटाना की तरह दिखना चाहिए अंत में hcharts.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 %> 
+0

नहीं देख सकते हैं आप @Oscar Luza में, मैं धन्यवाद आपके उत्तर के अनुसार फ़ाइलों को संशोधित करने का प्रयास किया, लेकिन यह अभी भी चार्ट में% नहीं दिखा रहा है। कृपया प्रश्न में मेरा संपादन देखें। – Slowboy

+0

आप पर application.js आप इस '// = की आवश्यकता है चार्टकिक –

+0

@ स्लोबॉय केवल' // = चार्ट चार्टबंडल की आवश्यकता है, दूसरी पंक्ति नहीं है, अगर मैं 'include_tag' को हटाता हूं तो –

संबंधित मुद्दे