commit/galaxy-central: guerler: Charts: Add zoomable heatmaps, add chart type definition to charts model
1 new commit in galaxy-central: https://bitbucket.org/galaxy/galaxy-central/commits/cab2ae91c6a9/ Changeset: cab2ae91c6a9 User: guerler Date: 2014-06-05 00:57:27 Summary: Charts: Add zoomable heatmaps, add chart type definition to charts model Affected #: 19 files diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/bar_horizontal_stacked/wrapper.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/bar_horizontal_stacked/wrapper.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/bar_horizontal_stacked/wrapper.js @@ -15,7 +15,6 @@ { // finalize configuration chart.settings.set('plotoptions_series_stacking', 'normal'); - chart.settings.set('x_axis_categories', []) // draw chart var hc = new Highcharts(this.app, this.options); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/bar_stacked/wrapper.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/bar_stacked/wrapper.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/bar_stacked/wrapper.js @@ -15,7 +15,6 @@ { // finalize configuration chart.settings.set('plotoptions_series_stacking', 'normal'); - chart.settings.set('x_axis_categories', []) // draw chart var hc = new Highcharts(this.app, this.options); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/boxplot/wrapper.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/boxplot/wrapper.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/boxplot/wrapper.js @@ -11,7 +11,7 @@ }, // render - draw : function(process_id, chart, request_dictionary) + draw : function(process_id, chart, request_dictionary, callback) { // configure request var index = 0; @@ -29,7 +29,7 @@ chart.settings.set('legend_enabled', 'false') // create configuration - this.hc_config = configmaker(chart, chart.settings); + this.hc_config = configmaker(chart, callback); // request data var self = this; diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/common/highcharts-config.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/common/highcharts-config.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/common/highcharts-config.js @@ -1,10 +1,14 @@ // dependencies define([], function() { -// widget -return function(chart, settings) { - // highcharts configuration - return { +// highcharts configuration +return function(chart) { + + // get chart settings + var settings = chart.settings; + + // initialize config object + var hc_config = { chart: { type : '', zoomType : 'xy' @@ -23,7 +27,6 @@ }, xAxis: { - categories : settings.get('x_axis_categories'), title: { text : settings.get('x_axis_label') }, @@ -60,7 +63,6 @@ enabled : !(settings.get('y_axis_type') == 'hide') } }, - plotOptions: { series: { animation : false, @@ -89,44 +91,10 @@ }, series: [] - }/*, + } - // highcharts stacking - hc_stacklabels: { - enabled: true, - style: { - fontWeight: 'bold', - color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' - } - }, - - // initialize - initialize: function(settings) { - // stacking - if (settings.get('x_stacked')) { - this.hc_config.xAxis.stackLabels = this.hc_stacklabels; - this.hc_config.plotOptions.column = { - stacking : 'normal', - dataLabels : { - enabled : true, - color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white', - style: { - textShadow: '0 0 3px black, 0 0 3px black' - } - } - } - } - - // stacking - if (settings.get('y_stacked')) { - this.hc_config.yAxis.stackLabels = this.hc_stacklabels; - this.hc_config.plotOptions.column = { - stacking : 'normal' - } - } - - console.log(this.hc_config); - }*/ + // callback + return hc_config; }; }); \ No newline at end of file diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/common/wrapper.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/common/wrapper.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/common/wrapper.js @@ -22,15 +22,13 @@ // render draw : function(process_id, hc_type, chart, request_dictionary, callback) { - // create configuration - this.hc_config = configmaker(chart, chart.settings); - // request data var self = this; this.app.datasets.request(request_dictionary, function() { + // check if this chart has multiple panels if (self.options.canvas.length == 1) { // groups - if (self._drawGroups(hc_type, chart, request_dictionary.groups, self.options.canvas[0])) { + if (self._drawGroups(hc_type, chart, request_dictionary.groups, self.options.canvas[0], callback)) { // set chart state chart.state('ok', 'Chart drawn.'); } @@ -40,9 +38,9 @@ for (var group_index in request_dictionary.groups) { // get group var group = request_dictionary.groups[group_index]; - + // draw group - if (!self._drawGroups(hc_type, chart, [group], self.options.canvas[group_index])) { + if (!self._drawGroups(hc_type, chart, [group], self.options.canvas[group_index], callback)) { valid = false; break; } @@ -60,9 +58,17 @@ }, // draw all data into a single canvas - _drawGroups: function(hc_type, chart, groups, canvas) { + _drawGroups: function(hc_type, chart, groups, canvas, callback) { + // create configuration + var hc_config = configmaker(chart); + + // make custom wrapper callback + if (callback) { + callback(hc_config); + } + // reset - this.hc_config.series = []; + hc_config.series = []; // loop through data groups for (var key in groups) { @@ -92,12 +98,12 @@ }; // append series - this.hc_config.series.push(hc_series); + hc_config.series.push(hc_series); } // draw plot try { - canvas.highcharts(this.hc_config); + canvas.highcharts(hc_config); return true; } catch (err) { var regex = /\www\.highcharts\.com([^&]+)/; diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/heatmap/config.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/heatmap/config.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/heatmap/config.js @@ -3,18 +3,21 @@ return $.extend(true, {}, config, { title : 'Heatmap', category : 'Data processing (requires \'charts\' tool from Toolshed)', - execute : 'heatmap', + //execute : 'heatmap', use_panels : true, + keywords : 'default highcharts', columns: { - row_label: { + y: { title : 'Row labels', - is_label : true + is_label : true, + is_numeric : true }, - col_label: { + x: { title : 'Column labels', - is_label : true + is_label : true, + is_numeric : true }, - value: { + z: { title : 'Observations', is_numeric : true } diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/highcharts/heatmap/wrapper.js --- a/config/plugins/visualizations/charts/static/charts/highcharts/heatmap/wrapper.js +++ b/config/plugins/visualizations/charts/static/charts/highcharts/heatmap/wrapper.js @@ -1,5 +1,5 @@ // dependencies -define(['plugin/charts/highcharts/common/wrapper'], function(Highcharts) { +define(['plugin/charts/highcharts/common/wrapper'], function(HighchartsWrapper) { // widget return Backbone.View.extend( @@ -13,13 +13,14 @@ // render draw : function(process_id, chart, request_dictionary) { - // finalize configuration - chart.settings.set('plotoptions_series_stacking', 'normal'); - chart.settings.set('x_axis_categories', []) - // draw chart - var hc = new Highcharts(this.app, this.options); - hc.draw(process_id, 'heatmap', chart, request_dictionary); + var hc = new HighchartsWrapper(this.app, this.options); + hc.draw(process_id, 'heatmap', chart, request_dictionary, function(model) { + model.colorAxis = { + minColor : '#00FF99', + maxColor : '#000066' + } + }); } }); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/nvd3/common/config.js --- a/config/plugins/visualizations/charts/static/charts/nvd3/common/config.js +++ b/config/plugins/visualizations/charts/static/charts/nvd3/common/config.js @@ -198,7 +198,7 @@ show_legend : { title : 'Show legend', info : 'Would you like to add a legend?', - type : 'select', + type : 'radiobutton', init : 'true', data : [ { diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/charts/nvd3/stackedarea/logo.png Binary file config/plugins/visualizations/charts/static/charts/nvd3/stackedarea/logo.png has changed diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/library/jobs.js --- a/config/plugins/visualizations/charts/static/library/jobs.js +++ b/config/plugins/visualizations/charts/static/library/jobs.js @@ -60,7 +60,7 @@ var chart_type = chart.get('type'); // get chart settings - var chart_settings = this.app.types.get(chart_type); + var chart_definition = chart.definition; // configure tool data = { @@ -70,7 +70,7 @@ 'id' : chart.get('dataset_id'), 'src' : 'hda' }, - 'module' : chart_settings.execute, + 'module' : chart_definition.execute, 'columns' : columns_string, 'settings' : settings_string } diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/library/storage.js --- a/config/plugins/visualizations/charts/static/library/storage.js +++ b/config/plugins/visualizations/charts/static/library/storage.js @@ -114,6 +114,9 @@ // initiating chart console.debug('Storage::load() - Loading chart type ' + chart_type + '.'); + // parse chart definition + this.chart.definition = chart_definition; + // main this.chart.set(chart_dict.attributes); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/plugins/heatmap/heatmap.css --- a/config/plugins/visualizations/charts/static/plugins/heatmap/heatmap.css +++ /dev/null @@ -1,76 +0,0 @@ -<style> - /* disable text selection */ - svg *::selection { - background : transparent; - } - - svg *::-moz-selection { - background:transparent; - } - - svg *::-webkit-selection { - background:transparent; - } - rect.selection { - stroke : #333; - stroke-dasharray: 4px; - stroke-opacity : 0.5; - fill : transparent; - } - - rect.cell-border { - stroke: #eee; - stroke-width:0.3px; - } - - rect.cell-selected { - stroke: rgb(51,102,153); - stroke-width:0.5px; - } - - rect.cell-hover { - stroke: #F00; - stroke-width:0.3px; - } - - text.mono { - font-size: 9pt; - font-family: Consolas, courier; - fill: #aaa; - } - - text.text-selected { - fill: #000; - } - - text.text-highlight { - fill: #c00; - } - text.text-hover { - fill: #00C; - } - #heatmap-tooltip { - position: absolute; - width: 200px; - height: auto; - padding: 10px; - background-color: white; - -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; - -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4); - -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4); - box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4); - pointer-events: none; - } - - #heatmap-tooltip.hidden { - display: none; - } - - #heatmap-tooltip p { - margin: 0; - font-family: sans-serif; - font-size: 12px; - line-height: 20px; - } \ No newline at end of file diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/plugins/highcharts/heatmap.js --- /dev/null +++ b/config/plugins/visualizations/charts/static/plugins/highcharts/heatmap.js @@ -0,0 +1,21 @@ +/* + Highcharts JS v4.0.1 (2014-04-24) + + (c) 2011-2014 Torstein Honsi + + License: www.highcharts.com/license +*/ +(function(g){var j=g.Axis,x=g.Chart,o=g.Color,y=g.Legend,s=g.LegendSymbolMixin,t=g.Series,u=g.getOptions(),k=g.each,p=g.extend,z=g.extendClass,l=g.merge,q=g.pick,v=g.numberFormat,m=g.seriesTypes,w=g.wrap,n=function(){},r=g.ColorAxis=function(){this.isColorAxis=!0;this.init.apply(this,arguments)};p(r.prototype,j.prototype);p(r.prototype,{defaultColorAxisOptions:{lineWidth:0,gridLineWidth:1,tickPixelInterval:72,startOnTick:!0,endOnTick:!0,offset:0,marker:{animation:{duration:50},color:"gray",width:0.01}, +labels:{overflow:"justify"},minColor:"#EFEFFF",maxColor:"#003875",tickLength:5},init:function(b,a){var d=b.options.legend.layout!=="vertical",c;c=l(this.defaultColorAxisOptions,{side:d?2:1,reversed:!d},a,{isX:d,opposite:!d,showEmpty:!1,title:null,isColor:!0});j.prototype.init.call(this,b,c);a.dataClasses&&this.initDataClasses(a);this.initStops(a);this.isXAxis=!0;this.horiz=d;this.zoomEnabled=!1},tweenColors:function(b,a,d){var c=a.rgba[3]!==1||b.rgba[3]!==1;return(c?"rgba(":"rgb(")+Math.round(a.rgba[0]+ +(b.rgba[0]-a.rgba[0])*(1-d))+","+Math.round(a.rgba[1]+(b.rgba[1]-a.rgba[1])*(1-d))+","+Math.round(a.rgba[2]+(b.rgba[2]-a.rgba[2])*(1-d))+(c?","+(a.rgba[3]+(b.rgba[3]-a.rgba[3])*(1-d)):"")+")"},initDataClasses:function(b){var a=this,d=this.chart,c,e=0,h=this.options;this.dataClasses=c=[];k(b.dataClasses,function(f,i){var g,f=l(f);c.push(f);if(!f.color)h.dataClassColor==="category"?(g=d.options.colors,f.color=g[e++],e===g.length&&(e=0)):f.color=a.tweenColors(o(h.minColor),o(h.maxColor),i/(b.dataClasses.length- +1))})},initStops:function(b){this.stops=b.stops||[[0,this.options.minColor],[1,this.options.maxColor]];k(this.stops,function(a){a.color=o(a[1])})},setOptions:function(b){j.prototype.setOptions.call(this,b);this.options.crosshair=this.options.marker;this.coll="colorAxis"},setAxisSize:function(){var b=this.legendSymbol,a=this.chart,d,c,e;if(b)this.left=d=b.attr("x"),this.top=c=b.attr("y"),this.width=e=b.attr("width"),this.height=b=b.attr("height"),this.right=a.chartWidth-d-e,this.bottom=a.chartHeight- +c-b,this.len=this.horiz?e:b,this.pos=this.horiz?d:c},toColor:function(b,a){var d,c=this.stops,e,h=this.dataClasses,f,i;if(h)for(i=h.length;i--;){if(f=h[i],e=f.from,c=f.to,(e===void 0||b>=e)&&(c===void 0||b<=c)){d=f.color;if(a)a.dataClass=i;break}}else{this.isLog&&(b=this.val2lin(b));d=1-(this.max-b)/(this.max-this.min);for(i=c.length;i--;)if(d>c[i][0])break;e=c[i]||c[i+1];c=c[i+1]||e;d=1-(c[0]-d)/(c[0]-e[0]||1);d=this.tweenColors(e.color,c.color,d)}return d},getOffset:function(){var b=this.legendGroup; +if(b&&(j.prototype.getOffset.call(this),!this.axisGroup.parentGroup))this.axisGroup.add(b),this.gridGroup.add(b),this.labelGroup.add(b),this.added=!0},setLegendColor:function(){var b,a=this.options;b=this.horiz?[0,0,1,0]:[0,0,0,1];this.legendColor={linearGradient:{x1:b[0],y1:b[1],x2:b[2],y2:b[3]},stops:a.stops||[[0,a.minColor],[1,a.maxColor]]}},drawLegendSymbol:function(b,a){var d=b.padding,c=b.options,e=this.horiz,h=q(c.symbolWidth,e?200:12),f=q(c.symbolHeight,e?12:200),c=q(c.labelPadding,e?10:30); +this.setLegendColor();a.legendSymbol=this.chart.renderer.rect(0,b.baseline-11,h,f).attr({zIndex:1}).add(a.legendGroup);a.legendSymbol.getBBox();this.legendItemWidth=h+d+(e?0:c);this.legendItemHeight=f+d+(e?c:0)},setState:n,visible:!0,setVisible:n,getSeriesExtremes:function(){var b;if(this.series.length)b=this.series[0],this.dataMin=b.valueMin,this.dataMax=b.valueMax},drawCrosshair:function(b,a){var d=!this.cross,c=a&&a.plotX,e=a&&a.plotY,h,f=this.pos,i=this.len;if(a)h=this.toPixels(a.value),h<f?h= +f-2:h>f+i&&(h=f+i+2),a.plotX=h,a.plotY=this.len-h,j.prototype.drawCrosshair.call(this,b,a),a.plotX=c,a.plotY=e,!d&&this.cross&&this.cross.attr({fill:this.crosshair.color}).add(this.labelGroup)},getPlotLinePath:function(b,a,d,c,e){return e?this.horiz?["M",e-4,this.top-6,"L",e+4,this.top-6,e,this.top,"Z"]:["M",this.left,e,"L",this.left-6,e+6,this.left-6,e-6,"Z"]:j.prototype.getPlotLinePath.call(this,b,a,d,c)},update:function(b,a){k(this.series,function(a){a.isDirtyData=!0});j.prototype.update.call(this, +b,a);this.legendItem&&(this.setLegendColor(),this.chart.legend.colorizeItem(this,!0))},getDataClassLegendSymbols:function(){var b=this,a=this.chart,d=[],c=a.options.legend,e=c.valueDecimals,h=c.valueSuffix||"",f;k(this.dataClasses,function(c,g){var j=!0,l=c.from,m=c.to;f="";l===void 0?f="< ":m===void 0&&(f="> ");l!==void 0&&(f+=v(l,e)+h);l!==void 0&&m!==void 0&&(f+=" - ");m!==void 0&&(f+=v(m,e)+h);d.push(p({chart:a,name:f,options:{},drawLegendSymbol:s.drawRectangle,visible:!0,setState:n,setVisible:function(){j= +this.visible=!j;k(b.series,function(a){k(a.points,function(a){a.dataClass===g&&a.setVisible(j)})});a.legend.colorizeItem(this,j)}},c))});return d},name:""});w(x.prototype,"getAxes",function(b){var a=this.options.colorAxis;b.call(this);this.colorAxis=[];a&&new r(this,a)});w(y.prototype,"getAllItems",function(b){var a=[],d=this.chart.colorAxis[0];d&&(d.options.dataClasses?a=a.concat(d.getDataClassLegendSymbols()):a.push(d),k(d.series,function(a){a.options.showInLegend=!1}));return a.concat(b.call(this))}); +g={pointAttrToOptions:{stroke:"borderColor","stroke-width":"borderWidth",fill:"color",dashstyle:"dashStyle"},pointArrayMap:["value"],axisTypes:["xAxis","yAxis","colorAxis"],optionalAxis:"colorAxis",trackerGroups:["group","markerGroup","dataLabelsGroup"],getSymbol:n,parallelArrays:["x","y","value"],translateColors:function(){var b=this,a=this.options.nullColor,d=this.colorAxis;k(this.data,function(c){var e=c.value;if(e=e===null?a:d?d.toColor(e,c):c.color||b.color)c.color=e})}};u.plotOptions.heatmap= +l(u.plotOptions.scatter,{animation:!1,borderWidth:0,nullColor:"#F8F8F8",dataLabels:{format:"{point.value}",verticalAlign:"middle",crop:!1,overflow:!1,style:{color:"white",fontWeight:"bold",textShadow:"0 0 5px black"}},marker:null,tooltip:{pointFormat:"{point.x}, {point.y}: {point.value}<br/>"},states:{normal:{animation:!0},hover:{brightness:0.2}}});m.heatmap=z(m.scatter,l(g,{type:"heatmap",pointArrayMap:["y","value"],hasPointSpecificOptions:!0,supportsDrilldown:!0,getExtremesFromAll:!0,init:function(){m.scatter.prototype.init.apply(this, +arguments);this.pointRange=this.options.colsize||1;this.yAxis.axisPointRange=this.options.rowsize||1},translate:function(){var b=this.options,a=this.xAxis,d=this.yAxis;this.generatePoints();k(this.points,function(c){var e=(b.colsize||1)/2,h=(b.rowsize||1)/2,f=Math.round(a.len-a.translate(c.x-e,0,1,0,1)),e=Math.round(a.len-a.translate(c.x+e,0,1,0,1)),g=Math.round(d.translate(c.y-h,0,1,0,1)),h=Math.round(d.translate(c.y+h,0,1,0,1));c.plotX=(f+e)/2;c.plotY=(g+h)/2;c.shapeType="rect";c.shapeArgs={x:Math.min(f, +e),y:Math.min(g,h),width:Math.abs(e-f),height:Math.abs(h-g)}});this.translateColors()},drawPoints:m.column.prototype.drawPoints,animate:n,getBox:n,drawLegendSymbol:s.drawRectangle,getExtremes:function(){t.prototype.getExtremes.call(this,this.valueData);this.valueMin=this.dataMin;this.valueMax=this.dataMax;t.prototype.getExtremes.call(this)}}))})(Highcharts); \ No newline at end of file diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/views/editor.js --- a/config/plugins/visualizations/charts/static/views/editor.js +++ b/config/plugins/visualizations/charts/static/views/editor.js @@ -47,7 +47,7 @@ 'back' : new Ui.ButtonIcon({ icon : 'fa-caret-left', tooltip : 'Return to Viewer', - title : 'Return', + title : 'Cancel', onclick : function() { // show viewport self.app.go('viewer'); @@ -63,15 +63,27 @@ // grid with chart types // this.types = new TypesView(app, { - onchange : function(type) { + onchange : function(chart_type) { + // get chart definition + var chart_definition = self.app.types.get(chart_type); + if (!chart_definition) { + console.debug('FAILED - Editor::onchange() - Chart type not supported.'); + } + + // parse chart definition + self.chart.definition = chart_definition; + // reset type relevant chart content self.chart.settings.clear(); // update chart type - self.chart.set({type: type}); + self.chart.set({type: chart_type}); // set modified flag self.chart.set('modified', true); + + // log + console.debug('Editor::onchange() - Switched chart type.'); }, ondblclick : function(chart_id) { self._saveChart(); @@ -230,6 +242,9 @@ // update titles this._refreshGroupKey(); + + // reset + this.chart.set('modified', true); }, // remove group @@ -252,7 +267,7 @@ _resetChart: function() { // reset chart details this.chart.set('id', Utils.uuid()); - this.chart.set('type', 'nvd3_bar'); + this.chart.set('type', 'highcharts_bar'); this.chart.set('dataset_id', this.app.options.config.dataset_id); this.chart.set('title', 'New Chart'); @@ -262,18 +277,30 @@ // create chart _saveChart: function() { - // ensure that data group is available + // update chart data + this.chart.set({ + type : this.types.value(), + title : this.title.value(), + date : Utils.time() + }); + + // make sure that at least one data group is available if (this.chart.groups.length == 0) { + this.message.update({message: 'Please select data columns before drawing the chart.'}); var group = this._addGroupModel(); this.tabs.show(group.id); return; } - // very selected group columns + // make sure that all necessary columns are assigned var self = this; var valid = true; + var chart_def = this.chart.definition; this.chart.groups.each(function(group) { - for (var key in group.attributes) { + if (!valid) { + return; + } + for (var key in chart_def.columns) { if (group.attributes[key] == 'null') { self.message.update({status: 'danger', message: 'This chart type requires column types not found in your tabular file.'}); self.tabs.show(group.id); @@ -290,13 +317,6 @@ // show viewport this.app.go('viewer'); - - // update chart data - this.chart.set({ - type : this.types.value(), - title : this.title.value(), - date : Utils.time() - }); // wait until chart is ready var self = this; diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/views/group.js --- a/config/plugins/visualizations/charts/static/views/group.js +++ b/config/plugins/visualizations/charts/static/views/group.js @@ -74,16 +74,16 @@ var self = this; // configure chart type - var chart_settings = this.app.types.get(chart_type); - + var chart_definition = this.chart.definition; + // reset table this.table.delAll(); // load list for select fields var select_list = {}; - for (var id in chart_settings.columns) { + for (var id in chart_definition.columns) { // get definition - var data_def = chart_settings.columns[id]; + var data_def = chart_definition.columns[id]; if (!data_def) { console.debug('Group::_refreshTable() - Skipping column definition.'); continue; @@ -114,7 +114,7 @@ this.app.datasets.request({id : dataset_id}, function(dataset) { // update select fields for (var id in select_list) { - self._addRow(id, dataset, select_list, chart_settings.columns[id]) + self._addRow(id, dataset, select_list, chart_definition.columns[id]) } // loading @@ -126,15 +126,15 @@ }, // add row - _addRow: function(id, dataset, select_list, chart_setting) { + _addRow: function(id, dataset, select_list, column_definition) { // link this var self = this; // is a numeric number required - var is_label = chart_setting.is_label; - var is_auto = chart_setting.is_auto; - var is_numeric = chart_setting.is_numeric; - var is_unique = chart_setting.is_unique; + var is_label = column_definition.is_label; + var is_auto = column_definition.is_auto; + var is_numeric = column_definition.is_numeric; + var is_unique = column_definition.is_unique; // configure columns var columns = []; diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/views/settings.js --- a/config/plugins/visualizations/charts/static/views/settings.js +++ b/config/plugins/visualizations/charts/static/views/settings.js @@ -33,17 +33,14 @@ // update dataset _refresh: function() { - // identify datasets - var chart_type = this.chart.get('type'); + // get settings + var chart_definition = this.chart.definition; // check if dataset is available - if (!chart_type) { + if (!chart_definition) { return; } - // get settings - var chart_definition = this.app.types.get(chart_type); - // set title this.form.title(chart_definition.category + ' - ' + chart_definition.title + ':'); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/views/types.js --- a/config/plugins/visualizations/charts/static/views/types.js +++ b/config/plugins/visualizations/charts/static/views/types.js @@ -32,13 +32,13 @@ // construct chart type subset selection buttons this.library = new Ui.RadioButton({ data : [ { label: 'Default', value: 'default' }, - { label: 'NVD3 (only)', value: 'nvd3' }, - { label: 'Highcharts (only)', value: 'highcharts' }], + { label: 'Classic', value: 'nvd3' }, + { label: 'Zoomable', value: 'highcharts' }], onchange: function(value) { self._filter(value); } }); - $el.append(Utils.wrap(this.library.$el).css('text-align', 'center')); + $el.append(Utils.wrap(this.library.$el)); // set element this.setElement($el); @@ -86,7 +86,7 @@ var type = types[id]; var $el = this.$el.find('#' + id); var keywords = type.keywords || ''; - if (keywords.indexOf(value) == -1) { + if (keywords.indexOf(value) == -1 && value != 'all') { $el.hide(); } else { $el.show(); diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/static/views/viewport.js --- a/config/plugins/visualizations/charts/static/views/viewport.js +++ b/config/plugins/visualizations/charts/static/views/viewport.js @@ -136,10 +136,10 @@ var chart_type = chart.get('type'); // load chart settings - this.chart_settings = this.app.types.get(chart_type); + this.chart_definition = chart.definition; // read settings - var use_panels = this.chart_settings.use_panels; + var use_panels = this.chart_definition.use_panels; // determine number of svg/div-elements to create var n_panels = 1; @@ -148,14 +148,14 @@ } // create canvas element and add to canvas list - this._createContainer(this.chart_settings.tag, n_panels); + this._createContainer(this.chart_definition.tag, n_panels); // set chart state chart.state('wait', 'Please wait...'); // clean up data if there is any from previous jobs - if (!this.chart_settings.execute || - (this.chart_settings.execute && chart.get('modified'))) { + if (!this.chart_definition.execute || + (this.chart_definition.execute && chart.get('modified'))) { // reset jobs this.app.jobs.cleanup(chart); @@ -171,7 +171,7 @@ var view = new ChartView(self.app, {canvas : self.canvas_list}); // request data - if (self.chart_settings.execute) { + if (self.chart_definition.execute) { self.app.jobs.request(chart, self._defaultSettingsString(chart), self._defaultRequestString(chart), function() { view.draw(process_id, chart, self._defaultRequestDictionary(chart)); @@ -203,7 +203,7 @@ group_index++; // add selected columns to column string - for (var key in self.chart_settings.columns) { + for (var key in self.chart_definition.columns) { request_string += key + '_' + group_index + ':' + (parseInt(group.get(key)) + 1) + ', '; } }); @@ -236,7 +236,7 @@ }; // update request dataset id - if (this.chart_settings.execute) { + if (this.chart_definition.execute) { request_dictionary.id = chart.get('dataset_id_job'); } else { request_dictionary.id = chart.get('dataset_id'); @@ -249,9 +249,9 @@ // add columns var columns = {}; - for (var column_key in self.chart_settings.columns) { + for (var column_key in self.chart_definition.columns) { // get settings for column - var column_settings = self.chart_settings.columns[column_key]; + var column_settings = self.chart_definition.columns[column_key]; // add to columns columns[column_key] = { diff -r f70167e188f9ad42d1651ea77a1208ad2fdc9abc -r cab2ae91c6a96e133748900e1c203ce864f52052 config/plugins/visualizations/charts/templates/charts.mako --- a/config/plugins/visualizations/charts/templates/charts.mako +++ b/config/plugins/visualizations/charts/templates/charts.mako @@ -28,10 +28,8 @@ ## install highcharts module ${h.javascript_link( app_root + "plugins/highcharts/highcharts.js" )} ${h.javascript_link( app_root + "plugins/highcharts/highcharts-more.js" )} + ${h.javascript_link( app_root + "plugins/highcharts/heatmap.js" )} - ## install heat map module - ${h.stylesheet_link( app_root + "plugins/heatmap/heatmap.css" )} - ## install boxplot module ##${h.javascript_link( app_root + "plugins/box.js" )} Repository URL: https://bitbucket.org/galaxy/galaxy-central/ -- This is a commit notification from bitbucket.org. You are receiving this because you have the service enabled, addressing the recipient of this email.
participants (1)
-
commits-noreply＠bitbucket.org