하이 차트 그래프가 JSP로 렌더링되지 않습니다.

Question

그래프를 함수를 호출하여 렌더링하려고합니다. 차트는 JSP 페이지에서 렌더링되지 않지만 JSFiddle에서 똑같은 코드를 테스트하면 작동합니다.

나는 또한 다음과 같은 라이브러리가 :

<script> 
    function drawChart(xAxis, yAxis, title, type) { 
    $('#container').highcharts({ 
     chart: { 
      type: type 
     }, 
     title: { 
      text: title 
     }, 
     xAxis: { 
      title: { 
       text: xAxis 
      }, 

      type: 'category', 
     }, 
     yAxis:{ 
      title: { 
       text: yAxis, 
      }, 
     }, 

     series: [{ 
      data: [{ 
      x: 100, 
      y: 50 
     }], 
     }] 
    }) 
} 
</script> 

이

나는 또한이 함수를 호출하는 별도의 div 태그가 :

이

<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="https://code.highcharts.com/highcharts-more.js"></script> 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 

다음 스크립트 태그는 차트를 생성하는 기능을 포함 예 :

,

<div id="container" style="width:80%; height:400px; width: 300px;"> </div> 

다음은 내 차트 내가 전달 값으로 렌더링을 보여줍니다 JSFiddle 링크입니다

JSFiddle :. http://jsfiddle.net/LLExL/6645/

내가 잘못 가고 어디 모르겠어요. 아무것도 분명하지 않습니다. 시간 내 주셔서 감사합니다.

EDIT : 내 스크립트 태그가 head 태그 내에 있음을 언급 할 가치가 있습니다.

편집 : x 및 y 값을 표시하도록 JSFiddle을 업데이트했습니다. 내 문제는 내 JSP에서 렌더링되는 것이 아니며 이유를 알지 못합니다.

편집 : 이제 수정되었습니다.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 

이 밝혀 그것을 잘이 일 때문에 JSFiddle는 jQuery 라이브러리를 참조 할 필요가 없습니다 : 라이브러리가 jQuery 라이브러리에 따라 달라 highcharts은 그래서 나는하여 highcharts 라이브러리 위에 다음을 추가했습니다. 잘못된 방법으로

Answer 1

JSFiddle에서 JSP로 작업 중이 었는데 내 JSP에 jchartry 라이브러리가 없으므로 highcharts 라이브러리가 의존합니다. JSFiddle은 jquery 라이브러리를 의존성으로 참조 할 필요가 없다는 것이 밝혀졌습니다.

Answer 2

당신이 쓴 시리즈는 코드 위

series: [{ 
      name: 'Population', 
      data: [ 
       ['Shanghai', 23.7], 
       ['Lagos', 16.1], 
       ['Istanbul', 14.2], 
       ['Karachi', 14.0], 
       ['Mumbai', 12.5], 
       ['Moscow', 12.1], 
       ['São Paulo', 11.8], 
       ['Beijing', 11.7], 
       ['Guangzhou', 11.1], 
       ['Delhi', 11.1], 
       ['Shenzhen', 10.5], 
       ['Seoul', 10.4], 
       ['Jakarta', 10.0], 
       ['Kinshasa', 9.3], 
       ['Tianjin', 9.3], 
       ['Tokyo', 9.0], 
       ['Cairo', 8.9], 
       ['Dhaka', 8.9], 
       ['Mexico City', 8.9], 
       ['Lima', 8.9] 
      ], 
      dataLabels: { 
       enabled: true, 
       rotation: -90, 
       color: '#FFFFFF', 
       align: 'right', 
       format: '{point.y:.1f}', // one decimal 
       y: 10, // 10 pixels down from the top 
       style: { 
        fontSize: '13px', 
        fontFamily: 'Verdana, sans-serif' 
       } 
      } 
     }] 

당신에게

Answer 3

변경 일련의 매개 변수를 도움이 방법

function drawChart(xAxis, yAxis, title, type) { 
$('#container').highcharts({ 
    chart: { 
     type: 'column' 
    }, 
    title: { 
     text: title 
    }, 
    xAxis: { 
     title: { 
      text: xAxis 
     }, 

     type: 'category', 
    }, 
    yAxis:{ 
     title: { 
      text: yAxis, 
     }, 
    }, 

    series: [{ 
     data:[ 
    ['x', 100], 
     ['y', 50] 
    ] 
    }], 

}) 

}

을 시도 배열에 넣을 수 있습니다 drawChart ("test1", "test2", "test3", "column");