Chartist.js Array with data

Question

I am creating a chart with Chartist.js. I'm getting json data with the Google embed API. I have a problem with this one. The array works with the values I give. But it does not work for data from json.

my code :

var TotalBrowser = [];
var BrowserSeries = [];

var oxyn = {
    queryAnalytics: function() {
        var id = '164690638';
        var expressions = [{
            expression: 'ga:hits'
        }];
        var dimension = [{
            name: 'ga:browser'
        }];

        oxyn.getReportQuery(id, '7daysago', 'today', expressions, dimension).then(function(response) {
            var formattedJson = JSON.stringify(response.result, null, 2);
            var data = JSON.parse(formattedJson);
            var i = 0;
            BrowserTotal = data.reports[0].data.totals[0].values[0];
            jQuery(data.reports[0].data.rows).each(function() {
                if (i <= 3) {
                    jQuery('#Browsers').append(browsericon[i] + this.dimensions[0]);
                    var percent = (parseInt(this.metrics[0].values[0]) / parseInt(BrowserTotal)) * 100;
                    BrowserSeries.push(Math.round(percent));
                    TotalBrowser.push(Math.round(percent) + '%');
                    i++;
                }
            });
            demo.initChartist();

        });
    }
}

var demo = {
    initChartist: function() {

        var dataPreferences = {
            series: [
                [BrowserSeries.join()]
            ]
        };

        var optionsPreferences = {
            donut: true,
            donutWidth: 40,
            startAngle: 0,
            total: 100,
            showLabel: false,
            axisX: {
                showGrid: false
            }
        };

        Chartist.Pie('#chartPreferences', dataPreferences, optionsPreferences);


        Chartist.Pie('#chartPreferences', {
            labels: [TotalBrowser.join()],
            series: [BrowserSeries.join()]
        });

        console.log(BrowserSeries.join());
    }
};

it does not work that way. But if I write the code like this, it works.

Chartist.Pie('#chartPreferences', {
   labels: [TotalBrowser.join()],
   series: [30, 70]
 });

and this is working.

Chartist.Pie('#chartPreferences', {
   labels: [TotalBrowser[0], TotalBrowser[1]],
   series: [BrowserSeries[0], BrowserSeries[1]]
});

console output

console.log(BrowserSeries.join());

30,70

JSON Source

It's a very silly problem.

Can you put here the result of the console.log of your data fetched from api? — edkeveked
– edkeveked, Commented Nov 18, 2017 at 21:03
jsonblob.com/f1d54c73-cca4-11e7-8281-b7ca4ea5fd51 here json code. — Özgür Can Karagöz
– Özgür Can Karagöz, Commented Nov 18, 2017 at 21:08
BrowserSeries.join () function returns correct result, but does not execute code. — Özgür Can Karagöz
– Özgür Can Karagöz, Commented Nov 18, 2017 at 21:26

Özgür Can Karagöz · Accepted Answer · 2017-11-19 00:13:14Z

1

yes I finally solved it. I write for those who have the same problem.

Chartist.Pie('#chartPreferences', {
   labels: TotalBrowser,
   series: BrowserSeries
});

We need to remove [ ] characters. We must also send the data directly to the array.

Also : https://github.com/gionkunz/chartist-js/issues/738

answered Nov 19, 2017 at 0:13

Özgür Can Karagöz

1,0461 gold badge14 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Chartist.js Array with data

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related