add chart using highcharts to angular via highcharts-ng directive

Question

I want to add a chart to my angular application. I decided to use the highchart-ng directive. here is the controller:

discoutControllers.controller('TestController', function($scope/*, $location,$route,TableUtility, TestService*/) {  

    $scope.options = {
            type: 'line'
        }

        $scope.swapChartType = function () {
            if (this.highchartsNG.options.chart.type === 'line') {
                this.highchartsNG.options.chart.type = 'column'
            } else {
                this.highchartsNG.options.chart.type = 'line'
            }
        }

        $scope.highchartsNG = {
            options: {
                chart: {
                    type: 'column'
                }
            },
            series: [{
                data: [10, 15, 12, 8, 7]
            }],
            title: {
                text: 'Hello'
            },
            loading: false
        }


});

and here is the view:

<div ng-controller='TestController' id="container" style="min-width: 310px; height: 400px; margin: 0 auto">
                <highchart id="chart1" config="highchartsNG"></highchart>
            </div>

the problem is that nothing is rendered when I view my page and I don't know what happened.

regards,

Is there anything coming up in the console? As well make sure you are including the highchartsng module in your app as a dependancy. — Alex Boisselle, Aug 20 '15 at 17:36

score 3 · Accepted Answer · answered Aug 20 '15 at 18:18

https://github.com/pablojim/highcharts-ng

Here you see the section:

Add Highcharts to your Angular app config:

var myapp = angular.module('myapp', ["highcharts-ng"]);

It seems that since there is no error being thrown that the directive is not actually instantiated in angular. This should help!

It is also possible that you are not including the library properly either. All should be explained on that git page.

add chart using highcharts to angular via highcharts-ng directive

1 Answers1