테이블에서 데이터를 사용하여 highcharts를 작성하십시오

Question

테이블의 데이터를 사용하여 레일에서 높은 차트를 사용하여 막대 그래프를 작성하려고합니다. 이름이 student and attendance 인 두 개의 컬럼이 포함 된 테이블이 있습니다. y-axis.My 자바 스크립트 코드에서 x 축과 출석 쇼 학생 이름은 다음과 같습니다

내 HTML에서

$(function() { 
    // Create the chart 
    $('#student')high-charts({ 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: 'student details' 
     }, 
     x Axis: { 
     type: 'category' 
     }, 
     y Axis: { 
      title: { 
       text: 'Total attendance' 
      } 

    }, 
    legend: { 
     enabled: false 
    }, 
    plot-options: { 
     series: { 
      border-width: 0, 
      data-labels: { 
       enabled: true, 
       format: '{point.y:.1f}%' 
      } 
     } 
    }, 

    tool-tip: { 
     header-format: '<span style="font-size:11px">{series.name}</span>  <Br>', 
     point-format: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<BR/>' 
    }, 
series: [ { 
      name: 'Stu', 
      id: 'Stu', 
      data: [ 
       [<%= @students.each do |s|%> 
        '<%= s.name %>', 
        <%= s.attendance%> 
       <%end%> 

       ] 

      ] 
     } 

내가 가진 : 나는 바 graph.Please 도움말을로드 할 수 없습니다

<div class="col-md-8"> 
    <div class="x_panel"> 
     <div id="student" style="min-width: 310px; height: 400px; margin: 0 auto"> 
     </div> 
    </div> 
</div> 

Answer 1

try 이

$(function() { 
// Create the chart 

new Highcharts.Chart({ 
chart: { renderTo: 'student' }, 
    title: { 
     text: 'student details' 
    }, 
    x Axis: { 
    type: 'category' 
    }, 
    y Axis: { 
     title: { 
      text: 'Total attendance' 
     } 

}, 
legend: { 
    enabled: false 
}, 
plot-options: { 
    series: { 
     border-width: 0, 
     data-labels: { 
      enabled: true, 
      format: '{point.y:.1f}%' 
     } 
    } 
}, 

tool-tip: { 
    header-format: '<span style="font-size:11px">{series.name}</span>  < 

Br>', 
     point-format: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<BR/>' 
    }, 
series: [ { 
      name: 'Stu', 
      id: 'Stu', 
      data: [ 
       [<%= @students.each do |s|%> 
        '<%= s.name %>', 
        <%= s.attendance%> 
       <%end%> 

       ] 

      ] 
     } 

새로운 highchart을 만들고 나는 그것의 작동하지 해전 시도