Search code examples
javascriptzingchart

Zingchart: can't get it working? Reference error: zingchart is not defined

I am trying to make some charts with Zingchart but I can't seem to get it working. I installed it using the bower install. On the website they say you need to verify your directory, and I do see that mine is diffrent from what they show.

Theirs:

 bower_components
 -- zingchart
    -- zingchart.min.js
    -- modules
       -- ...
    -- custom
       -- ...

Mine:

 bower_compentents
 -- zingchart
    -- client
       -- zingchart.min.js
       -- modules
          -- ...

The error I get when I want to build a standard chart is the following:

ReferenceError: zingchart is not defined

It points to the part in the code where the chart is renderd:

 zingchart.render({ 
        id:'chartDiv',
        data:chartData,
        height:400,
        width:600
    });

I am using javascript and angular. What am I doing wrong?

Solution

    1. Are you including the script in your html file?

    2. Are you direct injecting the zingchart module into your app? e.g. var app = angular.module('myapp', [ 'zingchart-angularjs' ]);

    3. Are your scripts in the correct order in your .html ( must be loaded in order ) angular > zingchart > your zingchart render code.