commit/galaxy-central: guerler: Charts: Heatmap add color schemes
1 new commit in galaxy-central: https://bitbucket.org/galaxy/galaxy-central/commits/56a24bfc4d15/ Changeset: 56a24bfc4d15 User: guerler Date: 2014-06-15 02:20:31 Summary: Charts: Heatmap add color schemes Affected #: 3 files diff -r 972549a5f857b22ae7acd130b915523647b05422 -r 56a24bfc4d155bb0df1875a6225cf1e71b8947b3 config/plugins/visualizations/charts/static/charts/others/heatmap/config.js --- a/config/plugins/visualizations/charts/static/charts/others/heatmap/config.js +++ b/config/plugins/visualizations/charts/static/charts/others/heatmap/config.js @@ -30,6 +30,74 @@ use_panels : { init : 'false', hide : true + }, + color_set : { + title : 'Color scheme', + info : 'Select a color scheme for your heatmap', + type : 'select', + init : 'jet', + data : [ + { + label : 'Cold-to-Hot', + value : 'hot' + }, + { + label : 'Cool', + value : 'cool' + }, + { + label : 'Copper', + value : 'copper' + }, + { + label : 'Gray scale', + value : 'gray' + }, + { + label : 'Jet', + value : 'jet' + }, + { + label : 'No-Green', + value : 'no_green' + }, + { + label : 'Ocean', + value : 'ocean' + }, + { + label : 'Polar', + value : 'polar' + }, + { + label : 'Red-to-Green', + value : 'redgreen' + }, + { + label : 'Red-to-green (saturated)', + value : 'red2green' + }, + { + label : 'Relief', + value : 'relief' + }, + { + label : 'Seismograph', + value : 'seis' + }, + { + label : 'Sealand', + value : 'sealand' + }, + { + label : 'Split', + value : 'split' + }, + { + label : 'Wysiwyg', + value : 'wysiwyg' + } + ] } } }); diff -r 972549a5f857b22ae7acd130b915523647b05422 -r 56a24bfc4d155bb0df1875a6225cf1e71b8947b3 config/plugins/visualizations/charts/static/charts/others/heatmap/heatmap-parameters.js --- /dev/null +++ b/config/plugins/visualizations/charts/static/charts/others/heatmap/heatmap-parameters.js @@ -0,0 +1,42 @@ +// dependencies +define([], function() { + +// color palettes +var colorSets = { + seis: ['#AA0000', '#D00000', '#F70000', '#FF1D00', '#FF4400', '#FF6A00', '#FF9000', '#FFB700', '#FFDD00', '#FFFF00', '#FFFF00', '#FFFF00', '#BDFF0C', '#73FF1A', '#3FFA36', '#16F45A', '#00D08B', '#0087CD', '#0048FA', '#0024E3'].reverse(), + + sealand: ['#8C66FF', '#6A66FF', '#6684FF', '#66A7FF', '#66CAFF', '#66ECFF', '#66FFF0', '#66FFCE', '#66FFAB', '#66FF88', '#66FF66', '#88FF66', '#ABFF66', '#CEFF66', '#FFEEA6', '#FFD3A6', '#FFB8A6', '#FFAAB0', '#FFB5CB', '#FFC0E1'].reverse(), + + redgreen: ['#005824', '#1A693B', '#347B53', '#4F8D6B', '#699F83', '#83B09B', '#9EC2B3', '#B8D4CB', '#D2E6E3', '#EDF8FB', '#FFFFFF', '#F1EEF6', '#E6D3E1','#DBB9CD', '#D19EB9', '#C684A4', '#BB6990', '#B14F7C', '#A63467', '#9B1A53', '#91003F'], + + ocean: ['#000000', '#000209', '#000413', '#00061E', '#000728', '#000932', '#002650', '#00426E', '#005E8C', '#007AAA', '#0096C8', '#22A9C2', '#45BCBB', '#67CFB5', '#8AE2AE', '#ACF6A8', '#BCF8B9', '#CBF9CA', '#DBFBDC', '#EBFDED'].reverse(), + + cool: ['#00FFFF', '#0DF2FF', '#19E6FF', '#26D9FF', '#33CCFF', '#3FBFFF', '#4CB3FF', '#59A6FF', '#6699FF', '#738CFF', '#7F7FFF', '#8C73FF', '#9966FF', '#A659FF', '#B24DFF', '#BF3FFF', '#CC33FF', '#D926FF', '#E619FF', '#F20DFF'], + + copper: ['#000000', '#100906', '#1F130D', '#301E13', '#40281A', '#50321F', '#603C26', '#70462D', '#805033', '#905A3A', '#A06440', '#B06E46', '#C0784D', '#D08253', '#E08C5A', '#F09660', '#FFA066', '#FFAA6D', '#FFB473', '#FFBE7A'].reverse(), + + gray: ['#000000', '#0D0D0D', '#191919', '#262626', '#333333', '#3F3F3F', '#4C4C4C', '#595959', '#666666', '#737373', '#7F7F7F', '#8C8C8C', '#999999', '#A6A6A6', '#B2B2B2', '#BFBFBF', '#CCCCCC', '#D9D9D9', '#E6E6E6', '#F2F2F2'].reverse(), + + hot: ['#000000', '#220000', '#440000', '#660000', '#880000', '#AA0000', '#CC0000', '#EE0000', '#FF1100', '#FF3300', '#FF5500', '#FF7700', '#FF9900', '#FFBB00', '#FFDD00', '#FFFF00', '#FFFF33', '#FFFF66', '#FFFF99', '#FFFFCC'].reverse(), + + jet: ['#00007F', '#0000B2', '#0000E5', '#0019FF', '#004DFF', '#007FFF', '#00B2FF', '#00E5FF', '#FFFFF2', '#FFFFD9', '#FFFFBF', '#FFFFA5', '#FFFF8C', '#FFE500', '#FFB300', '#FF7F00', '#FF4C00', '#FF1900', '#E50000', '#B20000'], + + no_green: ['#1F60FF', '#1F60FF', '#1F9FFF', '#1FBFFF', '#00CFFF', '#2AFFFF', '#2AFFFF', '#55FFFF', '#7FFFFF', '#AAFFFF', '#FFFF54', '#FFFF54', '#FFF000', '#FFBF00', '#FFA800', '#FF8A00', '#FF8A00', '#FF7000', '#FF4D00', '#FF0000'], + + polar: ['#0000FF', '#1919FF', '#3333FF', '#4C4CFF', '#6666FF', '#7F7FFF', '#9999FF', '#B2B2FF', '#CCCCFF', '#E6E6FF', '#FFFFFF', '#FFE5E5', '#FFCCCC', '#FFB2B2', '#FF9999', '#FF7F7F', '#FF6666', '#FF4C4C', '#FF3333', '#FF1A1A'], + + red2green: ['#FF0000', '#FF1919', '#FF3333', '#FF4C4C', '#FF6666', '#FF7F7F', '#FF9999', '#FFB2B2', '#FFCCCC', '#FFE6E6', '#FFFFFF', '#E5FFE5', '#CCFFCC', '#B2FFB2', '#99FF99', '#7FFF7F', '#66FF66', '#4CFF4C', '#33FF33', '#1AFF1A'].reverse(), + + relief: ['#000000', '#000413', '#000728', '#002650', '#005E8C', '#0096C8', '#45BCBB', '#8AE2AE', '#BCF8B9', '#DBFBDC', '#467832', '#887438', '#B19D48', '#DBC758', '#FAE769', '#FAEB7E', '#FCED93', '#FCF1A7', '#FCF6C1', '#FDFAE0'].reverse(), + + split: ['#7F7FFF', '#6666E6', '#4D4DCC', '#3333B3', '#1A1A99', '#00007F', '#000066', '#00004D', '#000033', '#00001A', '#000000', '#1A0000', '#330000', '#4D0000', '#660000', '#7F0000', '#991A1A', '#B33333', '#CC4D4D', '#E66666'], + + wysiwyg: ['#3F003F', '#3F003F', '#3F00BF', '#003FFF', '#00A0FF', '#3FBFFF', '#3FBFFF', '#40E0FF', '#3FFFBF', '#3FFF3F', '#7FFF3F', '#BFFF3F', '#BFFF3F', '#FFE040', '#FFE040', '#FF6040', '#FF1F40', '#FF60C0', '#FFA0FF', '#FFA0FF'].reverse() +} + +// return +return { + colorSets: colorSets +} + +}); \ No newline at end of file diff -r 972549a5f857b22ae7acd130b915523647b05422 -r 56a24bfc4d155bb0df1875a6225cf1e71b8947b3 config/plugins/visualizations/charts/static/charts/others/heatmap/heatmap-plugin.js --- a/config/plugins/visualizations/charts/static/charts/others/heatmap/heatmap-plugin.js +++ b/config/plugins/visualizations/charts/static/charts/others/heatmap/heatmap-plugin.js @@ -1,5 +1,5 @@ // dependencies -define(['plugin/charts/tools', 'utils/utils'], function(Tools, Utils) { +define(['plugin/charts/tools', 'utils/utils', 'plugin/charts/others/heatmap/heatmap-parameters'], function(Tools, Utils, HeatmapParameters) { // widget return Backbone.View.extend({ @@ -15,7 +15,7 @@ style: { 'font-weight' : 'normal', 'font-family' : 'Verdana', - 'font-size' : '12' + 'font-size' : 12 }, legend: { width : 15, @@ -23,13 +23,12 @@ style : { 'font-weight' : 'normal', 'font-family' : 'Verdana', - 'font-size' : '11' + 'font-size' : 11 }, limit : 7 }, background_color : '#FFFFF8', - debug_color : '#FFFFFF', - color_set : ['#ffffd9','#edf8b1','#ffffd9','#edf8b1','#c7e9b4','#7fcdbb','#41b6c4','#1d91c0','#225ea8','#253494','#081d58','#ffffd9','#edf8b1','#c7e9b4','#7fcdbb','#41b6c4','#1d91c0','#225ea8','#253494','#081d58'] + debug_color : '#FFFFFF' }, // initialize @@ -41,6 +40,9 @@ // render render : function(canvas_id, groups) { + // get color set + this.color_set = HeatmapParameters.colorSets[this.chart.settings.get('color_set')]; + // categories this.categories = Tools.makeUniqueCategories(groups); @@ -57,7 +59,7 @@ // color scale this.zMin = d3.min(this.data, function(d) { return d.z; }); this.zMax = d3.max(this.data, function(d) { return d.z; }); - this.zScale = d3.scale.quantize().domain([this.zMin, this.zMax]).range(this.options.color_set); + this.zScale = d3.scale.quantize().domain([this.zMin, this.zMax]).range(this.color_set); // create axis this.xAxis = d3.svg.axis().scale(this.xScale).orient('bottom'); @@ -285,7 +287,6 @@ .style('stroke-width', 1) .call(this.yAxis); - // fix text var yFontSize = Math.min(boxHeight, font_size); this.gyAxis.selectAll('text') @@ -329,11 +330,11 @@ var legendWidth = this.options.legend.width; var legendElements = this.zScale.range().length; var legendElementHeight = legendSize * height / legendElements; - var legendHeight = legendElements * legendElementHeight; + var legendHeight = legendElements * legendElementHeight / 2; // create legend elements var legend = this.svg.selectAll('.legend') - .data(d3.range(this.zMin, this.zMax, (this.zMax-this.zMin) / legendElements).reverse()) + .data(d3.range(this.zMin, this.zMax, 2 * (this.zMax-this.zMin) / legendElements).reverse()) .enter().append('g') .attr('class', 'legend') .attr('transform', function(d, i) { @@ -363,6 +364,16 @@ return str; } }); + + this.svg.append('text') + .style(this.options.legend.style) + .style({'font-size' : 9, 'font-weight': 'bold'}) + .text('Legend') + .attr('transform', function(d, i) { + var x = width + (margin.right - this.getBBox().width) / 2; + var y = ((height - legendHeight) / 2) - 10; + return 'translate(' + x + ',' + y + ')'; + }); }, // create axes formatting 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