CODEWITHSUNDEEP
javascriptarraysjsongraphjqplot
user1974417
user1974417

Reputation: 11

How to plot javascript array into jqplot?

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.

Upvotes: 0

Views: 1012

Answers (1)

hereandnow78
hereandnow78

Reputation: 14434

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!

Upvotes: 1

Related Questions