123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908 |
- if(!dojo._hasResource["dojox.widget.DataPresentation"]){
- dojo._hasResource["dojox.widget.DataPresentation"] = true;
- dojo.provide("dojox.widget.DataPresentation");
- dojo.experimental("dojox.widget.DataPresentation");
- dojo.require("dojox.grid.DataGrid");
- dojo.require("dojox.charting.Chart2D");
- dojo.require("dojox.charting.widget.Legend");
- dojo.require("dojox.charting.action2d.Tooltip");
- dojo.require("dojox.charting.action2d.Highlight");
- dojo.require("dojo.colors");
- dojo.require("dojo.data.ItemFileWriteStore");
- (function(){
-
-
- var getLabels = function(range, labelMod, charttype, domNode){
-
-
- var labels = [];
-
- labels[0] = {value: 0, text: ''};
- var nlabels = range.length;
-
- if((charttype !== "ClusteredBars") && (charttype !== "StackedBars")){
- var cwid = domNode.offsetWidth;
- var tmp = ("" + range[0]).length * range.length * 7;
-
- if(labelMod == 1){
- for(var z = 1; z < 500; ++z){
- if((tmp / z) < cwid){
- break;
- }
- ++labelMod;
- }
- }
- }
-
- for(var i = 0; i < nlabels; i++){
-
- labels.push({
- value: i + 1,
- text: (!labelMod || i % labelMod) ? "" : range[i]
- });
- }
-
-
- labels.push({value: nlabels + 1, text:''});
-
- return labels;
- };
-
-
- var getIndependentAxisArgs = function(charttype, labels){
- var args = { vertical: false, labels: labels, min: 0, max: labels.length-1, majorTickStep: 1, minorTickStep: 1 };
-
-
- if((charttype === "ClusteredBars") || (charttype === "StackedBars")){
- args.vertical = true;
- }
-
-
- if((charttype === "Lines") || (charttype === "Areas") || (charttype === "StackedAreas")){
- args.min++;
- args.max--;
- }
- return args;
- };
-
- var getDependentAxisArgs = function(charttype, axistype, minval, maxval){
-
- var args = { vertical: true, fixLower: "major", fixUpper: "major", natural: true };
-
-
- if(axistype === "secondary"){
- args.leftBottom = false;
- }
-
- if((charttype === "ClusteredBars") || (charttype === "StackedBars")){
- args.vertical = false;
- }
-
-
- if(minval == maxval){
- args.min = minval - 1;
- args.max = maxval + 1;
- }
-
- return args;
- };
-
-
- var getPlotArgs = function(charttype, axistype, animate){
-
- var args = { type: charttype, hAxis: "independent", vAxis: "dependent-" + axistype, gap: 4, lines: false, areas: false, markers: false };
-
-
- if((charttype === "ClusteredBars") || (charttype === "StackedBars")){
- args.hAxis = args.vAxis;
- args.vAxis = "independent";
- }
-
- if((charttype === "Lines") || (charttype === "Hybrid-Lines") || (charttype === "Areas") || (charttype === "StackedAreas")){
- args.lines = true;
- }
-
-
- if((charttype === "Areas") || (charttype === "StackedAreas")){
- args.areas = true;
- }
-
-
- if(charttype === "Lines"){
- args.markers = true;
- }
-
-
-
- if(charttype === "Hybrid-Lines"){
- args.shadows = {dx: 2, dy: 2, dw: 2};
- args.type = "Lines";
- }
-
-
- if(charttype === "Hybrid-ClusteredColumns"){
- args.type = "ClusteredColumns";
- }
-
-
- if(animate){
- args.animate = animate;
- }
-
- return args;
- };
-
- var setupChart = function(/*DomNode*/domNode, /*Object?*/chart, /*String*/type, /*Boolean*/reverse, /*Object*/animate, /*Integer*/labelMod, /*String*/theme, /*String*/tooltip, /*Object?*/store, /*String?*/query, /*String?*/queryOptions){
- var _chart = chart;
-
- if(!_chart){
- domNode.innerHTML = "";
- _chart = new dojox.charting.Chart2D(domNode);
- }
-
-
- if(theme){
-
-
-
-
- theme._clone = function(){
- var result = new dojox.charting.Theme({
- chart: this.chart,
- plotarea: this.plotarea,
- axis: this.axis,
- series: this.series,
- marker: this.marker,
- antiAlias: this.antiAlias,
- assignColors: this.assignColors,
- assignMarkers: this.assigneMarkers,
- colors: dojo.delegate(this.colors)
- });
-
- result.markers = this.markers;
- result._buildMarkerArray();
-
- return result;
- };
-
- _chart.setTheme(theme);
- }
- var range = store.series_data[0].slice(0);
-
-
- if(reverse){
- range.reverse();
- }
-
- var labels = getLabels(range, labelMod, type, domNode);
-
-
- var plots = {};
-
-
- var maxval = null;
- var minval = null;
-
- var seriestoremove = {};
- for(var sname in _chart.runs){
- seriestoremove[sname] = true;
- }
-
- var nseries = store.series_name.length;
- for(var i = 0; i < nseries; i++){
-
- if(store.series_chart[i] && (store.series_data[i].length > 0)){
- var charttype = type;
- var axistype = store.series_axis[i];
- if(charttype == "Hybrid"){
- if(store.series_charttype[i] == 'line'){
- charttype = "Hybrid-Lines";
- }else{
- charttype = "Hybrid-ClusteredColumns";
- }
- }
-
-
- if(!plots[axistype]){
- plots[axistype] = {};
- }
-
-
- if(!plots[axistype][charttype]){
- var axisname = axistype + "-" + charttype;
-
-
- _chart.addPlot(axisname, getPlotArgs(charttype, axistype, animate));
- var tooltipArgs = {};
- if(typeof tooltip == 'string'){
- tooltipArgs.text = function(o){
- var substitutions = [o.element, o.run.name, range[o.index], ((charttype === "ClusteredBars") || (charttype === "StackedBars")) ? o.x : o.y];
- return dojo.replace(tooltip, substitutions);
-
- }
- }else if(typeof tooltip == 'function'){
- tooltipArgs.text = tooltip;
- }
- new dojox.charting.action2d.Tooltip(_chart, axisname, tooltipArgs);
-
-
- if(charttype !== "Lines" && charttype !== "Hybrid-Lines"){
- new dojox.charting.action2d.Highlight(_chart, axisname);
- }
-
-
- plots[axistype][charttype] = true;
- }
-
-
- var xvals = [];
- var valen = store.series_data[i].length;
- for(var j = 0; j < valen; j++){
- var val = store.series_data[i][j];
- xvals.push(val);
- if(maxval === null || val > maxval){
- maxval = val;
- }
- if(minval === null || val < minval){
- minval = val;
- }
- }
-
-
- if(reverse){
- xvals.reverse();
- }
- var seriesargs = { plot: axistype + "-" + charttype };
- if(store.series_linestyle[i]){
- seriesargs.stroke = { style: store.series_linestyle[i] };
- }
- _chart.addSeries(store.series_name[i], xvals, seriesargs);
- delete seriestoremove[store.series_name[i]];
- }
- }
-
-
- for(sname in seriestoremove){
- _chart.removeSeries(sname);
- }
-
- _chart.addAxis("independent", getIndependentAxisArgs(type, labels));
- _chart.addAxis("dependent-primary", getDependentAxisArgs(type, "primary", minval, maxval));
- _chart.addAxis("dependent-secondary", getDependentAxisArgs(type, "secondary", minval, maxval));
-
- return _chart;
- };
-
- var setupLegend = function(/*DomNode*/domNode, /*Legend*/legend, /*Chart2D*/chart, /*Boolean*/horizontal){
-
- var _legend = legend;
-
- if(!_legend){
- _legend = new dojox.charting.widget.Legend({ chart: chart, horizontal: horizontal }, domNode);
- }else{
- _legend.refresh();
- }
-
- return _legend;
- };
-
-
- var setupGrid = function(/*DomNode*/domNode, /*Object?*/grid, /*Object?*/store, /*String?*/query, /*String?*/queryOptions){
- var _grid = grid || new dojox.grid.DataGrid({}, domNode);
- _grid.startup();
- _grid.setStore(store, query, queryOptions);
-
- var structure = [];
- for(var ser = 0; ser < store.series_name.length; ser++){
-
- if(store.series_grid[ser] && (store.series_data[ser].length > 0)){
- structure.push({ field: "data." + ser, name: store.series_name[ser], width: "auto", formatter: store.series_gridformatter[ser] });
- }
- }
-
- _grid.setStructure(structure);
-
- return _grid;
- };
-
-
- var setupTitle = function(/*DomNode*/domNode, /*object*/store){
- if(store.title){
- domNode.innerHTML = store.title;
- }
- };
-
-
- var setupFooter = function(/*DomNode*/domNode, /*object*/store){
- if(store.footer){
- domNode.innerHTML = store.footer;
- }
- };
-
-
-
- var getSubfield = function(/*Object*/object, /*String*/field){
- var result = object;
-
- if(field){
- var fragments = field.split(/[.\[\]]+/);
- for(var frag = 0, l = fragments.length; frag < l; frag++){
- if(result){
- result = result[fragments[frag]];
- }
- }
- }
-
- return result;
- };
-
- dojo.declare("dojox.widget.DataPresentation", null, {
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- type: "chart",
-
-
-
-
-
- chartType: "clusteredBars",
-
-
-
- reverse: false,
-
-
-
-
-
-
-
-
- animate: null,
-
-
-
-
- labelMod: 1,
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- legendHorizontal: true,
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- constructor: function(node, args){
-
-
-
-
-
-
-
-
-
- dojo.mixin(this, args);
-
- this.domNode = dojo.byId(node);
-
-
- this[this.type + "Node"] = this.domNode;
-
-
- if(typeof this.theme == 'string'){
- this.theme = dojo.getObject(this.theme);
- }
-
-
- this.chartNode = dojo.byId(this.chartNode);
- this.legendNode = dojo.byId(this.legendNode);
- this.gridNode = dojo.byId(this.gridNode);
- this.titleNode = dojo.byId(this.titleNode);
- this.footerNode = dojo.byId(this.footerNode);
-
-
-
- if(this.legendVertical){
- this.legendHorizontal = !this.legendVertical;
- }
-
- if(this.url){
- this.setURL(null, null, this.refreshInterval);
- }
- else{
- if(this.data){
- this.setData(null, this.refreshInterval);
- }
- else{
- this.setStore();
- }
- }
- },
-
- setURL: function(/*String?*/url, /*Object?*/ urlContent, /*Number?*/refreshInterval){
-
-
-
-
-
-
- if(refreshInterval){
- this.cancelRefresh();
- }
-
- this.url = url || this.url;
- this.urlContent = urlContent || this.urlContent;
- this.refreshInterval = refreshInterval || this.refreshInterval;
-
- var me = this;
-
- dojo.xhrGet({
- url: this.url,
- content: this.urlContent,
- handleAs: 'json-comment-optional',
- load: function(response, ioArgs){
- me.setData(response);
- },
- error: function(xhr, ioArgs){
- if(me.urlError && (typeof me.urlError == "function")){
- me.urlError(xhr, ioArgs);
- }
- }
- });
-
- if(refreshInterval && (this.refreshInterval > 0)){
- this.refreshIntervalPending = setInterval(function(){
- me.setURL();
- }, this.refreshInterval);
- }
- },
-
- setData: function(/*Object?*/data, /*Number?*/refreshInterval){
-
-
-
-
-
-
- if(refreshInterval){
- this.cancelRefresh();
- }
-
- this.data = data || this.data;
- this.refreshInterval = refreshInterval || this.refreshInterval;
-
-
-
-
- var _series = (typeof this.series == 'function') ? this.series(this.data) : this.series;
- var datasets = [],
- series_data = [],
- series_name = [],
- series_chart = [],
- series_charttype = [],
- series_linestyle = [],
- series_axis = [],
- series_grid = [],
- series_gridformatter = [],
- maxlen = 0;
-
-
- for(var ser = 0; ser < _series.length; ser++){
- datasets[ser] = getSubfield(this.data, _series[ser].datapoints);
- if(datasets[ser] && (datasets[ser].length > maxlen)){
- maxlen = datasets[ser].length;
- }
-
- series_data[ser] = [];
-
- series_name[ser] = _series[ser].name || (_series[ser].namefield ? getSubfield(this.data, _series[ser].namefield) : null) || ("series " + ser);
- series_chart[ser] = (_series[ser].chart !== false);
- series_charttype[ser] = _series[ser].charttype || "bar";
- series_linestyle[ser] = _series[ser].linestyle;
- series_axis[ser] = _series[ser].axis || "primary";
- series_grid[ser] = (_series[ser].grid !== false);
- series_gridformatter[ser] = _series[ser].gridformatter;
- }
-
-
-
-
-
-
-
- var point, datapoint, datavalue, fdatavalue;
- var datapoints = [];
-
- for(point = 0; point < maxlen; point++){
- datapoint = { index: point };
- for(ser = 0; ser < _series.length; ser++){
- if(datasets[ser] && (datasets[ser].length > point)){
- datavalue = getSubfield(datasets[ser][point], _series[ser].field);
-
- if(series_chart[ser]){
-
- fdatavalue = parseFloat(datavalue);
- if(!isNaN(fdatavalue)){
- datavalue = fdatavalue;
- }
- }
-
- datapoint["data." + ser] = datavalue;
- series_data[ser].push(datavalue);
- }
- }
- datapoints.push(datapoint);
- }
- if(maxlen <= 0){
- datapoints.push({index: 0});
- }
-
-
- var store = new dojo.data.ItemFileWriteStore({ data: { identifier: 'index', items: datapoints }});
- if(this.data.title){
- store.title = this.data.title;
- }
- if(this.data.footer){
- store.footer = this.data.footer;
- }
-
- store.series_data = series_data;
- store.series_name = series_name;
- store.series_chart = series_chart;
- store.series_charttype = series_charttype;
- store.series_linestyle = series_linestyle;
- store.series_axis = series_axis;
- store.series_grid = series_grid;
- store.series_gridformatter = series_gridformatter;
-
- this.setPreparedStore(store);
-
- if(refreshInterval && (this.refreshInterval > 0)){
- var me = this;
- this.refreshIntervalPending = setInterval(function(){
- me.setData();
- }, this.refreshInterval);
- }
- },
-
- refresh: function(){
-
-
-
-
-
-
- if(this.url){
- this.setURL(this.url, this.urlContent, this.refreshInterval);
- }else if(this.data){
- this.setData(this.data, this.refreshInterval);
- }
- },
-
- cancelRefresh: function(){
-
-
- if(this.refreshIntervalPending){
-
- clearInterval(this.refreshIntervalPending);
- this.refreshIntervalPending = undefined;
- }
- },
-
- setStore: function(/*Object?*/store, /*String?*/query, /*Object?*/queryOptions){
-
- this.setPreparedStore(store, query, queryOptions);
- },
-
- setPreparedStore: function(/*Object?*/store, /*String?*/query, /*Object?*/queryOptions){
-
-
-
- this.preparedstore = store || this.store;
- this.query = query || this.query;
- this.queryOptions = queryOptions || this.queryOptions;
-
- if(this.preparedstore){
- if(this.chartNode){
- this.chartWidget = setupChart(this.chartNode, this.chartWidget, this.chartType, this.reverse, this.animate, this.labelMod, this.theme, this.tooltip, this.preparedstore, this.query, this,queryOptions);
- this.renderChartWidget();
- }
- if(this.legendNode){
- this.legendWidget = setupLegend(this.legendNode, this.legendWidget, this.chartWidget, this.legendHorizontal);
- }
- if(this.gridNode){
- this.gridWidget = setupGrid(this.gridNode, this.gridWidget, this.preparedstore, this.query, this.queryOptions);
- this.renderGridWidget();
- }
- if(this.titleNode){
- setupTitle(this.titleNode, this.preparedstore);
- }
- if(this.footerNode){
- setupFooter(this.footerNode, this.preparedstore);
- }
- }
- },
-
- renderChartWidget: function(){
-
-
-
-
- if(this.chartWidget){
- this.chartWidget.render();
- }
- },
-
- renderGridWidget: function(){
-
-
-
-
- if(this.gridWidget){
- this.gridWidget.render();
- }
- },
-
- getChartWidget: function(){
-
-
-
- return this.chartWidget;
- },
-
- getGridWidget: function(){
-
-
-
- return this.gridWidget;
- },
-
- destroy: function(){
-
-
-
- this.cancelRefresh();
-
- if(this.chartWidget){
- this.chartWidget.destroy();
- delete this.chartWidget;
- }
-
- if(this.legendWidget){
-
- delete this.legendWidget;
- }
- if(this.gridWidget){
-
- delete this.gridWidget;
- }
-
- if(this.chartNode){
- this.chartNode.innerHTML = "";
- }
-
- if(this.legendNode){
- this.legendNode.innerHTML = "";
- }
-
- if(this.gridNode){
- this.gridNode.innerHTML = "";
- }
-
- if(this.titleNode){
- this.titleNode.innerHTML = "";
- }
-
- if(this.footerNode){
- this.footerNode.innerHTML = "";
- }
- }
-
- });
-
- })();
- }
|