0
jqplot에서 원형 차트를 만들려고합니다. 여기에 아무 것도 없다면 차트가 전혀 렌더링되지 않습니다.원형 차트를 렌더링하지 않는 레일을 사용하는 jqplot
다음은 레일에 dashboard_controller 내 행동의 한 방법 :
여기def index
@trans = Transaction.joins(:category).group("categories.name").sum(:amount)
respond_to do |format|
format.html # index.html.erb
format.json { render json: @trans }
end
end
내가 액션 메소드를 실행 한 후받은 JSON 데이터입니다. 여기
{"Bills & Utilities":1019.11,"Uncategorized":196.57,"Home":30.29,"Entertainment":300.0,"Food & Dining":465.45,"Personal Care":63.92,"Auto & Transport":571.44}
내 HTML과 자바 스크립트
<script type="text/javascript" src="/assets/jqplot/jqplot.js"></script>
<script type="text/javascript" src="/assets/jqplot/plugins/jqplot.pieRenderer.min.js"></script>
<script type="text/javascript" src="/assets/jqplot/plugins/jqplot.ciParser.js"></script>
<script type="text/javascript" src="/assets/jqplot/plugins/jqplot.json2.js"></script>
<link rel="stylesheet" type="text/css" href="/assets/jqplot/jqplot.css" />
<div id="chart10" style="margin-top:20px; margin-left:20px; width:460px; height:300px;"></div>
<script class="code" type="text/javascript">
$(document).ready(function() {
$.getJSON('/dashboard/index.json', function(data){
//var data = [['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14]];
plot = jQuery.jqplot('chart10', data, {
title: ' ',
//dataRenderer: $.jqplot.ciParser,
seriesDefaults: {
shadow: true,
renderer: $.jqplot.PieRenderer,
rendererOptions: {
fill: false,
sliceMargin: 4,
showDataLabels: true
}
},
legend: { show:true }
});
});
}); // document.ready
</script>
모든 아이디어를 어떻게 잘못 될 수 있는가?
Mark, 위의 코드에서 주석 처리 한 "dataRenderer : $ .jqplot.ciParser"를 사용했습니다. 레일즈 애플리케이션에서 반환 된 JSON을 jqplot에서 지원하는 형식으로 포맷하는 것이 아닌가요? – uxrob
ciParser가/무엇인지 잘 모릅니다 (저는 더 이상 레일 사용자가 아닙니다). 그러나 데이터 변환은 매우 단순합니다. 편집을 참조하십시오. – Mark