$.jqplot.MekkoRenderer

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 it’s 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}}

Summary

$.jqplot.MekkoRenderer | 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.MekkoLegendRenderer | 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.

### Properties

### borderColor

> this.borderColor = null

color of the borders between areas on the chart

### showBorders

> this.showBorders = true

True to draw borders lines between areas on the chart. False will draw borders lines with the same color as the area.

### Functions

### setGridData

> $.jqplot.MekkoRenderer.prototype.setGridData = function( | plot | )

converts the user data values to grid coordinates and stores them in the gridData array. Will convert user data into appropriate rectangles. Called with scope of a series.

### makeGridData

> $.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.

## $.jqplot.MekkoLegendRenderer

Legend renderer used by mekko charts with options for controlling number or rows and columns as well as placement outside of plot area.

Summary

Properties |
numberRows | Maximum number of rows in the legend.
numberColumns | Maximum number of columns in the legend.

### Properties

### numberRows

> this.numberRows = null

Maximum number of rows in the legend. 0 or null for unlimited.

### numberColumns

> this.numberColumns = null

Maximum number of columns in the legend. 0 or null for unlimited.

> this.borderColor = null

color of the borders between areas on the chart

> this.showBorders = true

True to draw borders lines between areas on the chart.

> $.jqplot.MekkoRenderer.prototype.setGridData = function( | plot | )

converts the user data values to grid coordinates and stores them in the gridData array.

> $.jqplot.MekkoRenderer.prototype.makeGridData = function( | data,
> | plot | )

converts any arbitrary data values to grid coordinates and returns them.

> this.numberRows = null

Maximum number of rows in the legend.

> this.numberColumns = null

Maximum number of columns in the legend.
An axis renderer for a Mekko chart.
Close