Combining the legend names with the values

Share RGraph:  

« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by John C on 13th July 2017
How would one go about having the legend name and total counts in they keys? For example, instead of the key showing May, June, December for three values of the pie, it might show May: 14, June: 252, December: 102

- John C
Posted by Richard on 14th July 2017
Hi there,

You do that with a quick loop like this:

www.rgraph.net/fiddle/view.html/combining-key-with-data-values


Richard
Posted by John C on 17th July 2017
Thank you. Do you see any problems with this code? It's just displaying the key label, not label: data value, like I think it should.

- John

RGraph.AJAX.getJSON('/Home/GetGraphData?releaseType=ICP', function (json) {

         var keyPrefix = "javascript: ShowReleaseModal('ICP', '";
         var keySuffix = "')";

         var labelLinks = $.map(json.labels, function (el) {
             return keyPrefix.concat(el).concat(keySuffix);
         });

         var key = RGraph.HTML.Key('my(ICP)',
         {
             colors: colors,
             labels: json.labels,
             links: labelLinks,
             tableCss: {
                 position: 'inherit',
                 top: '50%',
                 right: '5px',
                 transform: 'translateY(-50%)'
             }
         });

         var data = json.data;

         // Add the values to the key
         for (var i = 0; i < key.length; ++i) {
             key[i] = '{1}: {2}'.format(
                 key[i],
                 data[i]
             );
         }

         var pie = new RGraph.Pie({
             id: 'Graph(ICP)',
             data: json.data,
             options: {
                 shadow: false,
                 exploded: [7],
                 colors: colors,
                 tooltips: json.labels,
                 tooltipsEvent: 'mousemove',
                 strokestyle: 'transparent',
                 highlightStyle: 'outline'
             }
         }).draw();
     });
Posted by Richard on 17th July 2017
Hi there,

Well your labels are using the json.labels variable - so whatever that contains I guess. Try logging it to the console to see whats in it. You can do that like this:

console.log(json.links);

Hold on...

I've just noticed that you appear to be doing strange things with the key. Get rid of this:

  // Add the values to the key
  for (var i = 0; i < key.length; ++i) {
      key[i] = '{1}: {2}'.format(
          key[i],
          data[i]
      );
  }

And add this above where the key is created:

  // Create the key labels
  for (var i = 0,keyLabels = []; i < json.labels.length; ++i) {
      keyLabels[i] = '{1}: {2}'.format(
          json.labels[i],
          data[i]
      );
  }

And then use the keyLabels variable in the HTML key configuration, (for the labels).



Richard
Posted by John C on 17th July 2017
That did it. Thank you very much.

- John C

Add a reply




« Back to message list