2014-04-27 4 views
5

내 MVC 웹 응용 프로그램에서 Highcharts를 사용하려고합니다. Highcharts를 만들기 위해 모든 전제 조건을로드했습니다. 그러나 명백하게, "highchart"는 아직도 페이지에 의해 인식되지 않는다. 나는 Google 개발자 도구에 의해 렌더링 된 페이지를 확인 중이며 모든 JQuery 및 Highchart 자바 스크립트 파일이 제대로로드되었다고 말합니다. 어떤 도움이 필요합니까?Uncaught TypeError : undefined is not function - Highcharts - MVC

이 내 .cshtml 코드입니다 (! 가지 이상한)

@using System.Web.Optimization 

<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div> 



@section Scripts { 

@Scripts.Render("~/bundles/jqueryval") 
@Scripts.Render("~/Scripts/Highcharts-4.0.1/js/highcharts.js") 
@Scripts.Render("~/Scripts/Highcharts-4.0.1/js/modules/exporting.js") 


<script type="text/javascript"> 
    $(function() { 
     var chart; 
     debugger; 
     $(document).ready(function() { 
      debugger; 

      // Build the chart 
      $('#container').highcharts({ 
       chart: { 
        plotBackgroundColor: null, 
        plotBorderWidth: null, 
        plotShadow: false 
       }, 
       title: { 
        text: 'Browser market shares at a specific website, 2014' 
       }, 
       tooltip: { 
        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' 
       }, 
       plotOptions: { 
        pie: { 
         allowPointSelect: true, 
         cursor: 'pointer', 
         dataLabels: { 
          enabled: true, 
          format: '<b>{point.name}</b>: {point.percentage:.1f} %', 
          style: { 
           color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black' 
          } 
         } 
        } 
       }, 
       series: [{ 
        type: 'pie', 
        name: 'Browser share', 
        data: [ 
         ['Firefox', 45.0], 
         ['IE', 26.8], 
         { 
          name: 'Chrome', 
          y: 12.8, 
          sliced: true, 
          selected: true 
         }, 
         ['Safari', 8.5], 
         ['Opera', 6.2], 
         ['Others', 0.7] 
        ] 
       }] 
      }); 
     }); 
    }); 
</script> 
} 
+0

제게 도움이되는 내용을 사용했습니다. 제 튜토리얼이 도움이 될 수 있습니다. http : //developmentpassion.blogspot.com/2013/09/bar-charts-and- graph-in-aspnet-mvc.html –

+0

@EhsanSajjad 고마워요! 그것은 효과가 있었다. 하지만 그것은 이상한 일입니다! Highcarts 웹 사이트의 원본 샘플에서 "$ ("# container ") .highcharts (....)와 같이 사용하고 있으며 간단한 HTML 페이지에서 작업하고 있지만 MVC 응용 프로그램에서는 작동하지 않습니다. . 귀하의 페이지에있는이 하나가 잘 작동합니다! – Moji

+0

네, 그런데도 이드가 일했던 것처럼 이슈를 겪었습니다. –

답변

7

그래서이 트릭을 수행합니다

$('#container').highcharts({ 
      chart: { 
       plotBackgroundColor: null, 
       plotBorderWidth: null, 
       plotShadow: false 
      }, 

:

내가이 줄을 변경해야 이 행의 목적 :

chart = new Highcharts.Chart({ 
       chart: { 
        plotBackgroundColor: null, 
        plotBorderWidth: null, 
        plotShadow: false, 
        renderTo: 'container' 
       }, 

이것은 다음을 통해 나를 도운 링크입니다 : http://developmentpassion.blogspot.com/2013/09/bar-charts-and-graphs-in-aspnet-mvc.html

+0

그래서 작동 여부 –

+0

@SebastianBochan 작동하지만 여전히 내 자신의 답변을 올바른 것으로 표시 할 수 없습니다. 2 일이 지나야합니다. – Moji

관련 문제