Draws a Mekko style chart which shows 3 dimensional data on a 2 dimensional graph. the $.jqplot.MekkoAxisRenderer should be used with mekko charts. The mekko renderer overrides the default legend renderer with its own $.jqplot.MekkoLegendRenderer which allows more flexibility to specify number of rows and columns in the legend.
Data is specified per bar in the chart. You can specify data as an array of y values, or as an array of [label, value] pairs. Note that labels are used only on the first series. Labels on subsequent series are ignored:
bar1 = [['shirts', 8],['hats', 14],['shoes', 6],['gloves', 16],['dolls', 12]]; bar2 = [15,6,9,13,6]; bar3 = [['grumpy',4],['sneezy',2],['happy',7],['sleepy',9],['doc',7]];
If you want to place labels for each bar under the axis, you use the barLabels option on the axes. The bar labels can be styled with the “.jqplot-mekko-barLabel” css class.
barLabels = ['Mickey Mouse', 'Donald Duck', 'Goofy']; axes:{xaxis:{barLabels:barLabels}}
$.jqplot. | Draws a Mekko style chart which shows 3 dimensional data on a 2 dimensional graph. |
Properties | |
borderColor | color of the borders between areas on the chart |
showBorders | True to draw borders lines between areas on the chart. |
Functions | |
setGridData | converts the user data values to grid coordinates and stores them in the gridData array. |
makeGridData | converts any arbitrary data values to grid coordinates and returns them. |
$.jqplot. | Legend renderer used by mekko charts with options for controlling number or rows and columns as well as placement outside of plot area. |
Properties | |
numberRows | Maximum number of rows in the legend. |
numberColumns | Maximum number of columns in the legend. |
$.jqplot.MekkoRenderer.prototype.makeGridData = function( data, plot )
converts any arbitrary data values to grid coordinates and returns them. This method exists so that plugins can use a series’ linerenderer to generate grid data points without overwriting the grid data associated with that series. Called with scope of a series.
Legend renderer used by mekko charts with options for controlling number or rows and columns as well as placement outside of plot area.
Properties | |
numberRows | Maximum number of rows in the legend. |
numberColumns | Maximum number of columns in the legend. |
color of the borders between areas on the chart
this.borderColor = null
True to draw borders lines between areas on the chart.
this.showBorders = true
converts the user data values to grid coordinates and stores them in the gridData array.
$.jqplot.MekkoRenderer.prototype.setGridData = function( plot )
converts any arbitrary data values to grid coordinates and returns them.
$.jqplot.MekkoRenderer.prototype.makeGridData = function( data, plot )
Maximum number of rows in the legend.
this.numberRows = null
Maximum number of columns in the legend.
this.numberColumns = null