Commits

Chris Leonello  committed b01466a

Added offsetBars option to pyramid renderer to position bars between y values instead of centered on y values.

  • Participants
  • Parent commits d4bfa5e

Comments (0)

Files changed (2)

File examples/kcp_pyramid.php

 
         // the "x" values from the data will go into the ticks array.  
         // ticks should be strings for this case where we have values like "75+"
-        var ticks = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59", "60", "61", "62", "63", "64", "65", "66", "67", "68", "69", "70", "71", "72", "73", "74", "75+"];
+        var ticks = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59", "60", "61", "62", "63", "64", "65", "66", "67", "68", "69", "70", "71", "72", "73", "74", "75+", ""];
 
         // The "y" values of the data are put into seperate series arrays.
         var male = [0.635441, 1.066868, 0.889602, 0.816883, 1.016458, 0.916705, 0.79569, 0.970443, 1.046451, 1.335686, 0.926962, 0.936646, 0.919405, 0.722027, 0.896342, 0.993397, 0.613794, 0.916921, 0.828748, 0.43487, 0.391652, 0.517303, 0.507104, 0.336168, 0.554176, 0.691826, 0.66553, 0.686232, 0.7097, 0.356915, 0.756028, 0.430155, 0.420597, 0.608589, 0.609348, 0.83607, 0.79871, 0.63388, 0.866719, 0.711042, 1.160429, 0.439268, 0.659694, 0.468406, 0.340002, 0.996662, 0.371047, 0.638918, 0.462334, 0.467053, 0.545638, 0.463275, 0.480992, 0.515747, 0.499415, 0.287639, 0.520332, 0.443779, 0.334986, 0.43161, 0.474405, 0.179186, 0.620127, 0.219074, 0.411669, 0.495684, 0.315231, 0.275056, 0.157341, 0.113926, 0.24991, 0.128113, 0.175297, 0.103093, 0.253292, 0.988836];
             seriesDefaults: {
                 renderer: $.jqplot.PyramidRenderer,
                 rendererOptions: {
-                    barPadding: 2
+                    barPadding: 2,
+                    offsetBars: true
                 },
                 yaxis: 'yaxis',
                 shadow: false

File src/plugins/jqplot.pyramidRenderer.js

         // prop: highlightColors
         // an array of colors to use when highlighting a slice.
         this.highlightColors = [];
+        // prop: offsetBars
+        // False will center bars on their y value.
+        // True will push bars up by 1/2 bar width to fill between their y values.
+        // If true, there needs to be 1 more tick than there are bars.
+        this.offsetBars = false;
         
         // if user has passed in highlightMouseDown option and not set highlightMouseOver, disable highlightMouseOver
         if (options.highlightMouseDown && options.highlightMouseOver == null) {
             var xstart = this._xaxis.series_u2p(this._xnudge);
             var ystart = this._yaxis.series_u2p(this._yaxis.min);
             var yend = this._yaxis.series_u2p(this._yaxis.max);
-            var bw2 = this.barWidth/2.0;
+            var bw = this.barWidth;
+            var bw2 = bw/2.0;
             var points = [];
+            var yadj = this.offsetBars ? bw2 : 0;
             
             for (var i=0, l=gridData.length; i<l; i++) {
                 if (this.data[i][0] == null) {
                 }
                 
                 if (this.fill) {
+
                     if (this._plotData[i][1] >= 0) {
                         // xstart = this._xaxis.series_u2p(this._xnudge);
                         w = gridData[i][0] - xstart;
                         h = this.barWidth;
-                        points = [xstart, base - bw2, w, h];
+                        points = [xstart, base - bw2 - yadj, w, h];
                     }
                     else {
                         // xstart = this._xaxis.series_u2p(0);
                         w = xstart - gridData[i][0];
                         h = this.barWidth;
-                        points = [gridData[i][0], base - bw2, w, h];
+                        points = [gridData[i][0], base - bw2 - yadj, w, h];
                     }
 
                     this._barPoints.push([[points[0], points[1] + h], [points[0], points[1]], [points[0] + w, points[1]], [points[0] + w, points[1] + h]]);
 
                 else {
                     if (i === 0) {
-                        points =[[xstart, ystart], [gridData[i][0], ystart], [gridData[i][0], gridData[i][1] - bw2]];
+                        points =[[xstart, ystart], [gridData[i][0], ystart], [gridData[i][0], gridData[i][1] - bw2 - yadj]];
                     }
 
                     else if (i < l-1) {
-                        points = points.concat([[gridData[i-1][0], gridData[i-1][1] - bw2], [gridData[i][0], gridData[i][1] + bw2], [gridData[i][0], gridData[i][1] - bw2]]);
+                        points = points.concat([[gridData[i-1][0], gridData[i-1][1] - bw2 - yadj], [gridData[i][0], gridData[i][1] + bw2 - yadj], [gridData[i][0], gridData[i][1] - bw2 - yadj]]);
                     } 
 
                     // finally, draw the line
                     else {
-                        points = points.concat([[gridData[i-1][0], gridData[i-1][1] - bw2], [gridData[i][0], gridData[i][1] + bw2], [gridData[i][0], yend], [xstart, yend]]);
+                        points = points.concat([[gridData[i-1][0], gridData[i-1][1] - bw2 - yadj], [gridData[i][0], gridData[i][1] + bw2 - yadj], [gridData[i][0], yend], [xstart, yend]]);
                     
                         if (shadow) {
                             this.renderer.shadowRenderer.draw(ctx, points);