company logo

Plot Resources

Plot requires the ONLG Plot Hints user control to be installed. It is required to provide Jqplot from http://www.jqplot.com with the default plugins and load the configuration JavaScript.

$(document).ready(function(){

  if ( window.wkc ){

    wkc.setControlData.connect(wkc,wkcj.setControlData);

    wkc.infoException.connect(wkc,wkcj.infoException);

  }

});

function setPlotData(plot_data){

    dbg.m("plotting data...");

    // set the plot height based on the amount of series

    $('#plot_area').css({'height':  plot_data.labels.instances.length*30 + 100 });

    plot_area = $.jqplot('plot_area',plot_data.series,plot_data.config);

    dbg.reset();

}

function populatePlot(input_data){

    return {

      series: input_data.series

    , config: {

          stackSeries: true

        , showMarker: false

        , title: input_data.labels.title

        , seriesDefaults: {

              renderer: $.jqplot.BarRenderer

            , fill: true

            , rendererOptions: {

                  groups: input_data.series[0].length/5                  // extra margin between count/groups

                , barDirection: 'horizontal'

                }

          }

        , legend: {

              show:true

            , location: 'ne'

            , placement: 'inside'

            , labels: input_data.labels.series

            }

        , axes: {

              yaxis: {

                  renderer: $.jqplot.CategoryAxisRenderer

                , ticks: input_data.labels.instances

                }

          }

        }

    };

}

(function(){

  wkcj = {

      self:null

    , init:function(){

        wkjc.self = this;

      }

    , setControlData: function(data){

        dbg.m('processing data (' + data.length + 'bytes)....');

        dbg.obj('json', data);

        var obj = JSON.parse(data);//'{"name":"1"}');

        setPlotData(populatePlot(obj));

      }

    , infoException: function(message){

        dbg.m('exception: ' + message );

        }

    };

})();