Creating bar chart with highcharts and meteorhacks:aggregate

Hello all,

What I’m trying to accomplish is following: I’m trying to obtain the number of registered users per month and display them in a dashboard using highcharts.

All the combinations that I have tried, doesn’t seem to work.

Can somebody at least point me in the right direction as to how to accomplish this?

Thank you in advance.

This is not too difficult - but maybe you could tell us:

  • Version of Meteor?
  • Blaze, React, Angular, …?
  • Which Atmosphere Highcharts package or NPM module?

Or even better, a repo or some code you’ve already written.

What the actual error? Where are you stuck? Here is my code for serverside user aggregation:

   pipeline  =   [
   { $group : {'_id': {  year : { $year : "$createdAt" }, month : { $month : "$createdAt" } }, count: { $sum: 1 }} },
   { $sort : { "_id" : 1 } }

 result = Meteor.users.aggregate(pipeline);

 result.forEach(function (post) {
      year: post._id.year ,
      month: post._id.month ,
      usersJoined: post.count

I do not know what format Higchart wants.

Thanks a bunch for your response. Meteor version is 1.2, I’m using Blaze. I would like to create column chart. I’m using official highcharts package.

I’ll set up a simple repo to demo this. Just off for the afternoon now, so it won’t be until tomorrow. Someone else can chip in if they’d like in the meantime :slight_smile:

I was able to aggregate data, created a method that I run on onRendered function and I get the result, as an array. What I do not understand is how to pass the result to highcharts series data.

Also with the onRendered function you take the Array and put it into the chart!

under series data and then the array!

        series: [{
            name: 'Data',
            data: arrayname1
        }, {
            name: 'Data2',
            data: arrayname2

You really need to make sure the array is in an acceptable format for highcharts. this is most likely the error.

You are right. I get the data as object array. How can I adjust it to Highcharts format?

I have stringified the objects into an JSON array. This is the response I get:

{"_id":{"month":5,"year":2016},"count":4}, {"_id":{"month":5,"year":2016},"count":4}, {"_id":{"month":3,"year":2016},"count":1}

How can I pass this data to Highcharts?

Sorry for the lateness of a reply - somewhat tied up this morning. Anyway, this code takes your sample aggregation results and fires off a Highcharts column graph.

Just a few points to make:

  1. I used highcharts:highcharts-meteor (which I think you’re using), but maazalik:highcharts is easier to use.
  2. In Meteor 1.3, the NPM highcharts module is even easier. I highly recommend updating.
  3. I haven’t added the aggregation coding - you seem to be okay with that.
  4. Your sample result has two data points with the same year, month and value - I changed one of those.
  5. I haven’t made the graph pretty.
  6. I haven’t annotated the code. If you want a deeper explanation, DM me or add to this topic.