Visokio website     Downloads     Video tutorials     KnowledgeBase  
Scripting: Storing Data in 2-Dimensional Array? - Visokio Forums
Scripting: Storing Data in 2-Dimensional Array?
  •     acdewinter September 18, 2013 11:00AM
    Hi,

    Edit: I've managed to figure out how to construct the dataTable to read data in from a for loop for 2 different array's of data and then plot it out on the scatter plot. The next step will be to link the Omniscope data into the arrays and see if it still works. Being able to do this will greatly increase the flexibility of what can be done on the front-end of the data explorer.

    I've posted below the updated code that just demonstrates reading in a simple amount of data via a for-loop.:

    function drawChart() {
    var EventArray = [1000,1500];
    var EventValueArray = [2000,2500];
    var data = new google.visualization.DataTable();
    data.addColumn('number','Test1');
    data.addColumn('number','Test2');
    for (var i=0;i<2;i++) {<br />data.addRows([[EventValueArray[i],EventArray[i]]]);
    }
    var options = {
    title: 'Age vs. Weight comparison',
    hAxis: {title: 'Age', minValue: 0, maxValue: 6000},
    vAxis: {title: 'Weight', minValue: 0, maxValue: 6000},
    legend: 'none'
    };

    var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
    chart.draw(data, options);
    }

    ------------------

    I will be playing around a bit more and then posting an update if I figure out where in the code to link up the Omniscope scripting calculations into the chart DataTable.
  • 5 Comments
  •     steve September 19, 2013 5:01AM
    Adrian,

    Great post. Here's a working solution, attached.

    API docs taken from here:
    http://forums.visokio.com/discussion/1731/content-view-native-browser-javascript-api-2.8-

    Debugging done by opening in external browser and using Chrome, plus console.log() statements (not available in content view). But each time you edit, you need to re-open the page, as the URL changes.

    Here's the source code:

    <html>
    <head>
    <# insertNativeBrowserApiScriptTag() #>
    <script type="text/javascript" src="" target="_blank" rel="nofollow">https://www.google.com/jsapi"></script>
    <script type="text/javascript">
    google.load("visualization", "1", {packages:["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
    var chartDiv = document.getElementById('chart_div');
    var headers = ["Coupon", "Market Yield"];
    var cells = vo.cells(headers, 0/*firstRow*/, null/*numberOfRows*/, function(data) {
    var rowCount = data[0].length;
    if (rowCount > 50) {
    chartDiv.innerHTML = "Too much data - "+rowCount+" records. Please filter down to 50 or fewer.";
    return;
    }

    // this is like this: [[1,3,4],[0.1,0.2,0.3]]; we need it like this: [[Title1, Title2], [1,0.1], [2,0.2], [3,0.3]].
    var flipped = [headers];
    for (var y = 0; y<rowCount; y++) {
    flipped[y+1] = [];
    for (var x = 0; x<data.length; x++) {
    flipped[y+1][x] = data[x][y];
    }

    var options = {
    title: 'Coupon vs Market Yield',
    hAxis: {title: headers[0]},//, minValue: 0, maxValue: 15},
    vAxis: {title: headers[1]},//, minValue: 0, maxValue: 15},
    legend: 'none'
    };
    var chart = new google.visualization.ScatterChart(chartDiv);
    chart.draw(google.visualization.arrayToDataTable(flipped), options);
    }
    });
    }
    </script>
    </head>
    <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
    </body>
    </html>


    Unfortunately, this doesn't scale well beyond 50 markers. I think this is inherent in the google viz API rather than Omniscope. So I put in a limit.
    Attachments
    JS view example.iok 62K
  •        daniel September 19, 2013 10:18AM
    The example crashes upon loading on b447, is htere any particular options that need to be enabled on Omniscope to run this?
  •     steve September 20, 2013 7:07AM
    There's a bug with the native browser JS API in 2.9 which will be fixed in the next build. Use 2.8 meanwhile.
  •     acdewinter September 20, 2013 10:00AM
    Hi Steve,

    Thanks very much for the above code, where I am a little confused is where you set the data (I'm assuming in the following line):

    var cells = vo.cells(headers, 0/*firstRow*/, null/*numberOfRows*/, function(data)

    How does the vo.cells work? And what is it for?
  •     steve September 20, 2013 11:30AM
    Search for "vo.cells" on this page:
    http://forums.visokio.com/discussion/1731/content-view-native-browser-javascript-api-2.8-

    (NB. 2.9 b463 now available online with the fix)

Welcome!

It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In Apply for Membership