1

Original Example

Failed Example

I'm planning to use a bar chart plugin from this site. How would you push the strings from each div.get's data attribute into the array arrayOfData?

For example:

<div class="get" data-stats="10.3,'Jan','#222222'"></div>
<div class="get" data-stats="15.2,'Feb','#7D252B'"></div>

I want to push the strings from data-stats into an array like this:

arrayOfData = new Array(
 [10.3,'Jan','#222222'],
 [15.2,'Feb','#7D252B']
);

Is push the correct way of doing this? I can't pass the strings into the array at all in the failed example. Any help would be appreciated.

HTML:

<div id="exampleSimple" style="width: 400px; height: 300px; position: relative; text-align: center;"></div>

<div class="get" data-stats="10.3,'Jan','#222222'"></div>
<div class="get" data-stats="15.2,'Feb','#7D252B'"></div>
<div class="get" data-stats="13.1,'Mar','#EB9781'"></div>
<div class="get" data-stats="16.3,'Apr','#FFD2B5'"></div>
<div class="get" data-stats="14.5,'May','#4A4147'"></div>

Jquery:

$(function() {
  var arrayOfData = [];
  $('.get').each(function(get){
   var getstats = $(this).data('stats');  
      arrayOfData.push(getstats);
   });

  $('#exampleSimple').jqbargraph({
     data: arrayOfData 
  });
});

3 Answers 3

3

Split the states data by comma seprator, and you need to remove single quote from the second and third array item in order to apply color correctly

DEMO

$(function() {
    var arrayOfData = [];
    $('.get').each(function(get){
        var getstats = $(this).data('stats').split(',');

        getstats[1] = getstats[1].replace(/'/g,'');
        getstats[2] = getstats[2].replace(/'/g,'');

        arrayOfData.push(getstats);
    });

    $('#exampleSimple').jqbargraph({
        data: arrayOfData 
    });
});
Sign up to request clarification or add additional context in comments.

Comments

1

Working Demo

You need to pass an array to `arrayOfData' , you were passing just the string before.

  • 1st parameter as an integer - bar length.
  • 2nd parameter as string - Month.
  • 3rd parameter as string - color.

$(function () {
    var arrayOfData = new Array();
    $('.get').each(function () {
        var getstats = $(this).data('stats');
        getstats = getstats.split(',');
        getstats[0] = parseInt(getstats[0]);
        getstats[1] = getstats[1].replace(/\'/g, '');
        getstats[2] = getstats[2].replace(/\'/g, '');

        arrayOfData.push(getstats);
    });
    console.log(arrayOfData[1]);
    $('#exampleSimple').jqbargraph({
        data: arrayOfData
    });
});

Comments

1

It seems like you have an array of arrays so that you should try this:

arrayOfData.push(getstats.split(','));

your data('stats') is a string so you will need to extract from it. Also, remove the single quotes within the data attributes.

fiddle

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.