TableChart

Builds a new TableChart with the given label, datatable and options.

Get the value of a set option via magic method.

Gets the Options object for the JsonConfig

Shortcut method to set the value of an option and return $this.

In order to maintain backwards compatibility, ConfigObjects will be unwrapped.

Parses the config array by passing the values through each method to check validity against if the option exists.

Custom serialization of the JsonConfig object.

Returns the chart type.

Checks if any events have been assigned to the chart.

Retrieves the events if any have been assigned to the chart.

Returns the chart label.

Register javascript callbacks for specific events.

Set with an associative array where the keys are events and the values are the javascript callback functions.

Valid events are: [ animationfinish | error | onmouseover | onmouseout | ready | select | statechange ]

Assigns a datatable to use for the Chart.

Sets any configuration option, with no checks for type / validity

This is method was added in 2.5 as a bandaid to remove the handcuffs from users who want to add options that Google has added, that I have not. I didn't intend to restrict the user to only select options, as the goal was to type check and validate. This method can be used to set any option, just pass in arrays with key value pairs for any setting.

If the setting is an object, per the google docs, then use multi-dimensional arrays and they will be converted upon rendering.

Returns the DataTable

Returns a JSON string representation of the datatable.

Outputs the chart javascript into the page.

Pass in a string of the html elementID that you want the chart to be rendered into.

Set the animation options for a chart.

The background color for the main area of the chart.

Can be a simple HTML color string, or hex code, for example: 'red' or '#00cc00'

An object with members to configure the placement and size of the chart area (where the chart itself is drawn, excluding axis and legends).

Two formats are supported: a number, or a number followed by %. A simple number is a value in pixels; a number followed by % is a percentage.

The colors to use for the chart elements.

An array of strings, where each element is an HTML color string for example:['red','#004411']

The default font size, in pixels, of all text in the chart.

You can override this using properties for specific chart elements.

The default font face for all text in the chart.

You can override this using properties for specific chart elements.

Height of the chart, in pixels.

An object with members to configure various aspects of the legend.

To specify properties of this object, pass in an array of valid options.

Text to display above the chart.

Where to place the chart title, compared to the chart area.

Supported values: 'in' - Draw the title inside the chart area. 'out' - Draw the title outside the chart area. 'none' - Omit the title.

An array of options for defining the title text style.

An object with members to configure various tooltip elements.

Width of the chart, in pixels.

If set to true the GoogleChart will render html tags sorted as values.

If set to true the GoogleChart will alternate the role styles.

An object in which each property name describes a table element, and the property value is a string, defining a class to assign to that table element.

Use this property to assign custom CSS to specific elements of your table. To use this property, assign an object, where the property name specifies the table element, and the property value is a string, specifying a class name to assign to that element. You must then define a CSS style for that class on your page. The following property names are supported: headerRow - Assigns a class name to the table header row ( element). tableRow - Assigns a class name to the non-header rows ( elements). oddTableRow - Assigns a class name to odd table rows ( elements). Note: the alternatingRowStyle option must be set to true. selectedTableRow - Assigns a class name to the selected table row ( element). hoverTableRow - Assigns a class name to the hovered table row ( element). headerCell - Assigns a class name to all cells in the header row ( element). tableCell - Assigns a class name to all non-header table cells ( element). rowNumberCell - Assigns a class name to the cells in the row number column ( element). Note: the showRowNumber option must be set to true.

Example: var cssClassNames = {headerRow: 'bigAndBoldClass', hoverTableRow: 'highlightClass'};

The row number for the first row in the dataTable. Used only if showRowNumber is true.

The number of columns from the left that will be frozen.

These columns will remain in place when scrolling the remaining columns horizontally. If showRowNumber is false, setting frozenColumns to 0 will appear the same as if set to null, but if showRowNumber is set to true, the row number column will be frozen.

If and how to enable paging through the data.

Choose one of the following string values: 'enable' - The table will include page-forward and page-back buttons. Clicking on these buttons will perform the paging operation and change the displayed page. You might want to also set the pageSize option. 'event' - The table will include page-forward and page-back buttons, but clicking them will trigger a 'page' event and will not change the displayed page. This option should be used when the code implements its own page turning logic. See the TableQueryWrapper example for an example of how to handle paging events manually. 'disable' - [Default] Paging is not supported.

The number of rows in each page, when paging is enabled with the page option.

Sets a specified option for the paging buttons. The options are as follows: both - enable prev and next buttons prev - only prev button is enabled next - only next button is enabled auto - the buttons are enabled according to the current page. On the first page only next is shown. On the last page only prev is shown. Otherwise both are enabled.

number - the number of paging buttons to show. This explicit number will override computed number from pageSize.

Adds basic support for right-to-left languages (such as Arabic or Hebrew) by reversing the column order of the table, so that column zero is the rightmost column, and the last column is the leftmost column. This does not affect the column index in the underlying data, only the order of display. Full bi-directional (BiDi) language display is not supported by the table visualization even with this option. This option will be ignored if you enable paging (using the page option), or if the table has scroll bars because you have specified height and width options smaller than the required table size.

Sets the horizontal scrolling position, in pixels, if the table has horizontal scroll bars because you have set the width property. The table will open scrolled that many pixels past the leftmost column.

If set to true, shows the row number as the first column of the table.

If and how to sort columns when the user clicks a column heading. If sorting is enabled, consider setting the sortAscending and sortColumn properties as well. Choose one of the following string values: 'enable' - [Default] Users can click on column headers to sort by the clicked column. When users click on the column header, the rows will be automatically sorted, and a 'sort' event will be triggered.

'event' - When users click on the column header, a 'sort' event will be triggered, but the rows will not be automatically sorted. This option should be used when the page implements its own sort. See the TableQueryWrapper example for an example of how to handle sorting events manually. 'disable' - Clicking a column header has no effect.

The order in which the initial sort column is sorted. True for ascending, false for descending. Ignored if sortColumn is not specified.

An index of a column in the data table, by which the table is initially sorted.

The column will be marked with a small arrow indicating the sort order.

The first table page to display. Used only if page is in mode enable/event.