グラフ描画HTML 5
2580 ワード
適用:http://www.highcharts.com/demo/pie-basic
いい考えですね
いい考えですね
def all_courses_select_apply_pie
@courses = CourseIntent.intent_course_ranking
stat = {
:notfull => 20, :full => 9, :over => 8, :empty => 11
}
render :json => stat
end
.chart
.page-chart.all-courses-select-apply-pie
jQuery ->
jQuery('.page-chart.all-courses-select-apply-pie').each ->
$chart = jQuery(this)
jQuery.ajax
url: '/charts/courses/all_courses_select_apply_pie'
success: (res)->
notfull = res.notfull
over = res.over
full = res.full
empty = res.empty
option =
chart:
plotBackgroundColor: null
plotBorderWidth: null
plotShadow: false
backgroundColor: null
title:
text: null
plotOptions:
pie:
allowPointSelect: false
showInLegend: true
cursor: 'pointer'
series: [
{
type: 'pie'
name: ' '
animation: false
# point:
# events:
# click: (e)->
# location.href = "/manage/courses?select_apply_status=#{this.label}"
dataLabels:
format: '<b>{point.name}</b>: {point.y}'
color: 'black'
distance: 25
style:
fontSize: '15px'
fontWeight: 'bold'
data: [
{
label: 'notfull'
name: ' '
y: notfull
color: '#FEF093'
},
{
label: 'over'
name: ' '
y: over
color: '#cc3333'
},
{
label: 'full'
name: ' '
y: full
color: '#80CC00'
},
{
label: 'empty'
name: ' '
y: empty
color: '#CDCDCD'
},
]
}
]
$chart.highcharts option