How to plot javascript array into jqplot?

Question

I have an array in javascript which i derived from json_encode in jqplot. how to plot the array in jqplot.

The following code gets the values and put in the two textboxes making a javascript array. I need to plot the newArray2JS in x-axis and newArrayJS in y-axis

<script type='text/javascript'>

function parseMe(){
    var json=document.getElementById('json_text').value;
    var obj=eval('('+json+')');
    document.createElement('u1');


    alert(obj);
    for(val in obj){
        alert(obj[val]);


        //alert(obj[val]);
        //}
        }}
        </script>
        </head>
        <body>
        <form>
        <input type='text' id='json_text1' value='<?php echo $newArrayJS; ?>' />
        <input type='text' id='json_text2' value='<?php echo $newArray2JS; ?>' />
        <input type='button' value='parse' onclick='parseMe();' />

        </form>
        <div id = 'chart1'></div>

I am new to jqplot and json.

How can i do this.

i get mysql values from php and encode it using json_encode. this code function parseMe(){ var json1=document.getElementById('json_text1').value; var bmi=eval('('+json1+')'); var json2=document.getElementById('json_text2').value; var bmiDate=eval('('+json2+')'); document.createElement('u1'); — user1974417
– user1974417, Commented Jan 14, 2013 at 10:36
that gives javascript array. i need to plot that in jqplot. how to do this? — user1974417
– user1974417, Commented Jan 14, 2013 at 10:36
Here is a working example of JQPlot : jsfiddle.net/BLfRe/24. Just put your array as input parameter. More info here : jqplot.com — sdespont
– sdespont, Commented Jan 14, 2013 at 10:40

hereandnow78 · Accepted Answer · 2013-01-14 11:12:25Z

1

first of all if you want to use jqplot, you need jquery. if you have jquery inside your page, you dont need the "document.getElement..." stuff. use jquery and the jquery-selectors there!

given that your input contains an array as a string you could json.parse that and give it to jqplot:

$(document).ready(function() {
  var yourOptions = {} // fill this with your options (see jqplot docs)
    , stringArray
    , yourArray;  // this is the array you want to be plotted, which is filled onclick
  $('input[type=button]').on('click', function() {
    // the array as a string
    stringArray = $('#json_text1').val();
    try {
      // parse your string to make it a js-array
      yourArray = JSON.parse(stringArray);
      // and now jqplot it (see more info on how to use this in the jqplot-docs: http://www.jqplot.com/docs
      $.jqplot('#chart1', yourArray, yourOptions);
    } catch (e) {
      // you should do something here if your string is not parsable
    }
  });

});

this way, you can remove your javascript-onclick-attributes from your html!

edited Jan 14, 2013 at 11:12

answered Jan 14, 2013 at 11:02

hereandnow78

14.5k8 gold badges46 silver badges49 bronze badges

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

2 Comments

user1974417 Over a year ago

my question is im not being able to fill that yourOptions with the javascript array i got.

hereandnow78 Over a year ago

yourOptions is just the jqplot-options (formatting axis and so on). the "yourArray" is the array you want to be plotted. on button.click, this is done (read the val from the input field, json parse it, and give it to jqplot

Collectives™ on Stack Overflow

How to plot javascript array into jqplot?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related