2014-01-08 3 views
10

저는 각형 응용 프로그램에 하이 차트를 넣으려고합니다. Google 스프레드 시트에서 데이터를 가져 와서 Google에 전화 한 약속 개체를 반환합니다. 그런 다음 옵션 개체를 사용하여 Highcharts.Chart() 메서드를 호출합니다.새 차트를 추가하려고 할 때 undefined가 함수가 아니라고 말합니다.

전화를 걸 때 아래에서 오류가 발생합니다. 나는 무슨 일이 일어나고 있는지 알아 내려고 노력했지만 현재 잃어버린 것입니다. 나는 각도를 사용하지 않는 원형을 가지고 있으며 차트는 훌륭하게 작동합니다. 내가 가서 Highcharts.Chart (options) 라인을 새로 추가 할 때 아래 오류가 발생합니다. 오류가 사라지는 줄을 제거합니다.

어떤 생각이나 도움이 될 것입니다!

오류 :

TypeError: undefined is not a function 
    at Object.Chart.init (/highcharts.src.js:11014:4) 
    at Object.Chart (/highcharts.src.js:10937:12) 
    at data.then.$scope.sheetdata (/js/controllers/controlChartCtrl.js:11:17) 
    at wrappedCallback (/angularjs/1.2.6/angular.js:10905:81) 
    at /angularjs/1.2.6/angular.js:10991:26 
    at Scope.$eval (/angularjs/1.2.6/angular.js:11906:28) 
    at Scope.$digest (/angularjs/1.2.6/angular.js:11734:31) 
    at Scope.$delegate.__proto__.$digest (<anonymous>:844:31) 
    at /angularjs/1.2.6/angular.js:11945:26 
    at completeOutstandingRequest (/angularjs/1.2.6/angular.js:4098:10) 

부분 :

Features: 
<div id="feature"></div> 

컨트롤러 :

angular.module('controlChartCtrl', []). 
    controller('ControlChartCtrl', ['$scope', 'GoogleService', function($scope, GoogleService) { 
    var data = GoogleService.getData(); 
    $scope.helloworld = "hello world!"; 
    data.then(function (data) { 
     // create charts here 
     var options = getOptionsForChart('Feature', 'feature', data); 
     var chart = new Highcharts.Chart(options); 
    }, function (error) { 
     $scope.sheetdata = error; 
    }); 

    var getOptionsForChart = function (title, div, data) { 
     return { 
      chart: { 
       renderTo: div, 
       type: 'line' 
      }, 
      title: { 
       text: title + ' Control Chart' 
      }, 
      xAxis: { 
       title: { 
        text: 'End Dates' 
       }, 
       categories: data.endDates 
      }, 
      yAxis: { 
       title: { 
        text: 'Lead Time' 
       } 
      }, 
      series: [{ 
       name: 'Lead Time', 
       data: data.leadTimes 
      }] 
     }; 
    } 

}]); 
+0

바보 같은 질문 : 라이브러리가 제대로로드? – elclanrs

+0

지시문을 보여주십시오. 스택 트레이스는 문제가'js/directives/highcharts.js : 14 : 35'에 있음을 분명하게 나타냅니다. – Stewie

+0

예제를 jsFiddle로 재현 할 수 있습니까? –

답변

15

내가 문제를 해결. 해결책은 다음과 같습니다.

하이 차트를 사용하려면 jQuery가 올바르게 작동해야합니다. highcharts.js 파일 위에 jquery.js 파일을 추가하면 각 응용 프로그램이 올바르게 작동하기 시작했습니다.

의견에 감사드립니다.

+3

[standalone-framework] (http://jsfiddle.net/highcharts/aEuGP/)도 사용할 수 있습니다. jquery는 필요하지 않습니다. –

+0

감사합니다 @SebastianBochan! 답변을 추가하면 투표 할 것입니다. – mikemaccana

+1

'하이 차트에는 jQuery가 올바르게 작동해야합니다. '이것은 올바르지 않습니다. – mikemaccana

0

같은 문제가있었습니다. 또한 그러나 당신이 '독립를로드 할 필요 는 (현재의 대답은 잘못이다) 일을 JQuery와을 필요로하지 않습니다 highcharts.js 및/또는 highstock.js

+1

이것은 대답이 아닌 답으로 더 좋습니다. –

+3

나는 동의하지 않는다. Javascript의 순서는 내 오류의 원인이었고 Zain의 의견은 내 문제를 해결하는 데 도움이되었습니다. – IcedDante

10

Highcharts 위의 파일 jquery.js를 넣어 그것을 해결 첫 프레임 워크 '라이브러리 :

define([ 
    'vnd/highcharts/standalone-framework', 
    'vnd/highcharts/highcharts', 
], function(){ 
    ... 
} 

이 데모 세바스찬의 jsfiddle @ 참조 : 는 http://jsfiddle.net/highcharts/aEuGP/

관련 문제