Arhn - архитектура программирования

TypeError: Highcharts[h] не является функцией

Ссылка на мой Plnkr: http://plnkr.co/edit/S0BKjrgxz564oCPs9nCw?p=preview

введите здесь описание изображения

Есть идеи, почему я получаю эту ошибку? Не знаю, где Highcharts[h]...

Код контроллера

(function() {
    angular.module('highChartTest', ['ui.bootstrap', 'highcharts-ng'])
        .controller('MyHighChart', ['$scope', '$timeout', MyHighChart]);

    // HighCharts Column Chart
    function MyHighChart($scope, $timeout) {

        var vs             = $scope;
            ticker         = 'GOOG',
            vs.chartObject = {};
        
        var dayHolder = [];
        var count = 0;
        _.times(97, function() {
            dayHolder.push({
                'x': count++,
                'y': count++
            });
        });

        // Default data fed into navigator:
        vs.navigatorData = dayHolder;

        this.config = {
            options: {
                    ignoreHiddenSeries: false,
                    credits: { enabled: true, text: 'www.tickertags.com' },
                    legend: {
                        itemStyle: {
                            color      : "#333333",
                            cursor     : "pointer",
                            fontSize   : "10px",
                            fontWeight : "normal"
                        },
                        enabled  : true,
                        floating : true,
                        align    : 'left',
                        verticalAlign: 'top',
                        x: 60
                    },
                    chart : {
                        title    : { text: '' },
                        subtitle : { text: '' },
                        renderTo : 'chart1',
                        zoomType : 'x',
                        events: {
                            load: function () {
                                // HighChart loaded callback:
                                broadcastChartLoaded();
                                console.log('config.chart.events.load...');
                            },
                            redraw: function(event) {
                                // console.log(' chart events redraw fired');
                            }
                        }
                    },
                    scrollbar: {
                        enabled    : false,
                        liveRedraw : false
                    },
                    navigator : {
                        enabled: true,
                        adaptToUpdatedData: true,
                        // enabled: false,
                        // adaptToUpdatedData: false,
                        series : {
                            data : vs.navigatorData
                        }
                    },
                    rangeSelector: {
                        enabled: false,
                    },
                    exporting: { enabled: false }
                },
                exporting: { enabled: false },
                useHighStocks: true,
                xAxis : {
                    ordinal: false,
                    dateTimeLabelFormats : {
                        hour   : '%I %p',
                        minute : '%I:%M %p'
                    },
                    events : {
                        // afterSetExtremes : afterSetExtremes,
                        // setExtremes : setExtremes
                    },
                    minRange: 3600 * 1000 // one hour
                },
                yAxis: [{ // Primary yAxis
                    labels: {
                        format: '${value:.2f}',
                        style: {
                            color: '#4C73FF',
                        }
                    },
                    title: {
                        text: 'Price',
                        style: {
                            color: '#4C73FF',
                        }
                    }
                },
                { // Secondary yAxis
                    gridLineWidth: 0,
                    title: {
                        text: 'Mentions',
                        style: {
                            color: '#FDE18D'
                            // Pick one - "#FDE18D", "#7DD0FA", "#58A6EC"
                        }
                    },
                    opposite: false
                }],
                func: function(chart) {
                    vs.chartObject = chart;
                },

                series : [{
                    zIndex: 1000,
                    yAxis: 0,
                    showInLegend: true,
                    color: '#4C73FF',
                    data: dayHolder,
                    type: 'line',
                    name: 'SPY',
                    dataGrouping: {
                        enabled: true
                    }
                }]
        };
        
        function broadcastChartLoaded() {
          console.log('broadcastChartLoaded!!!');
        }
        
        $timeout(function() {
          console.log('inside timeout, now add 1st series');
          var quoteData = vs.navigatorData;
          vs.chartObject.addSeries({
              zIndex       : 1000,
              yAxis        : 0,
              name         : ticker,
              data         : quoteData,
              type         : 'line',
              color        : '#4C73FF',
              showInLegend : true,
              dataGrouping : {
                  enabled: true
              }
            }, true);
        }, 2000);
    }
})();

Ответы:


1

Вы использовали highcharts, а не библиотеку highstock.js, а указали highstock в конфиге.

http://plnkr.co/edit/mr4STsk3ekVOwXpZVgk0?p=preview

<script data-require="[email protected]" data-semver="4.2.3" src="//cdnjs.cloudflare.com/ajax/libs/highstock/4.2.3/highstock.js"></script>
15.02.2016
Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..