Highcharts disant pas défini n'est pas une fonction lorsque vous essayez d'ajouter un nouveau graphique

Je suis en train de mettre highcharts dans mon angulaire de l'app. Je reçois mes données à partir de Feuilles de calcul Google et le retour d'une promesse objet de l'appel à google. Je téléphone alors à l'Highcharts.Tableau() la méthode avec mon objet d'options.

Je reçois le message d'erreur ci-dessous lors de la prise de l'appel. J'ai essayé de comprendre ce qui se passe, mais je suis actuellement perdu. J'ai un prototype que je n'utilise pas angulaire et le graphique fonctionne très bien. Quand je vais ajouter la ligne nouvelle Highcharts.Tableau(options) j'ai l'erreur ci-dessous. - Je supprimer cette ligne que l'erreur disparaisse.

Toutes les pensées/aide serait super!

Erreur:

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)

Partielle:

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

Contrôleur:

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
            }]
        };
    } 

}]);
Question stupide: est-ce que la bibliothèque est chargé correctement?
Montrez votre directive. La trace de la pile indique clairement que le problème est dans js/directives/highcharts.js:14:35.
Il est possible de reproduire vous exemple que jsFiddle?
Désolé j'ai supprimé la directive. Le post original n'ont pas tenu compte que dans la trace de la pile. J'ai mis à jour la trace de la pile pour refléter la disparition de la directive. Erreur: "les données.alors.$la portée.sheetdata (/js/controllers/controlChartCtrl.js:11:17)" est la ligne suivante: "var tableau = new Highcharts.Tableau(options);"

OriginalL'auteur user3175030 | 2014-01-08

  1. 15

    J'ai résolu le problème. La solution est comme suit.

    Highcharts nécessite jQuery pour fonctionner correctement. Quand j'ai ajouté le jquery.js fichier au-dessus de la highcharts.js fichier angulaire du démarrage de l'application pour fonctionner correctement.

    Merci pour les commentaires!

    Vous pouvez également utiliser autonome-cadre jquery n'est pas nécessaire.
    Merci @SebastianBochan! Ajouter une réponse et je vais voter pour elle.
    Highcharts requires jQuery to function correctly. ce n'est pas correct.

    OriginalL'auteur user3175030

  2. 10

    Highcharts ne nécessite pas de JQuery de travail (la réponse est fausse), cependant, vous devez charger le 'cadre autonome" bibliothèque " d'abord:

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

    Voir @Sébastien jsfiddle pour une démo:
    http://jsfiddle.net/highcharts/aEuGP/

    OriginalL'auteur mikemaccana

  3. 0

    J'ai eu le même problème. J'ai aussi résolu en mettant le jquery.js fichier ci-dessus highcharts.js et/ou highstock.js

    C'est mieux qu'un commentaire, plutôt que comme une réponse.
    Je suis en désaccord. L'ordre du Javascript comprend était ce qui était la cause de mes erreurs et de Zain commentaire ici a aidé à résoudre mon problème.

    OriginalL'auteur Zain