\Kendo\Dataviz\UI\Chart
A PHP wrapper for Kendo UI Chart.
Inherits from \Kendo\UI\Widget.
Usage
To use Chart in a PHP page instantiate a new instance, configure it via the available
configuration methods and output it by echo-ing the result of the render method.
Using Kendo Chart
<?php
// Create a new instance of Chart and specify its id
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
// Configure it
$chart->autoBind(true)
// Output it
echo $chart->render();
?>
Methods
autoBind
If set to false the widget will not bind to the data source during initialization. In this case data binding will occur when the change event of the data source is fired. By default the widget will bind to the data source specified in the configuration.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value boolean
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->autoBind(true);
?>
axisDefaults
The default options for all chart axes. Accepts the options supported by categoryAxis, valueAxis, xAxis and yAxis.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartAxisDefaults|array
axisLabelClick
Fired when the user clicks an axis label.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the axisLabelClick event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->axisLabelClick('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onAxisLabelClick(e) {
// handle the axisLabelClick event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->axisLabelClick('onAxisLabelClick');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->axisLabelClick(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
addCategoryAxisItem
Adds one or more ChartCategoryAxisItem to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartCategoryAxisItem|array
Example - using \Kendo\Dataviz\UI\ChartCategoryAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$categoryAxisItem = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$background = 'value';
$categoryAxisItem->background($background);
$chart->addCategoryAxisItem($categoryAxisItem);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->addCategoryAxisItem(array('background' => $background));
?>
Example - adding more than one ChartCategoryAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$second = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$chart->addCategoryAxisItem($first, $second);
?>
chartArea
The chart area configuration options. Represents the entire visible area of the chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartArea|array
Example - using \Kendo\Dataviz\UI\ChartArea
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chartArea = new \Kendo\Dataviz\UI\ChartArea();
$background = 'value';
$chartArea->background($background);
$chart->chartArea($chartArea);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->chartArea(array('background' => $background));
?>
dataBound
Fired when the widget is bound to data from its data source.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the dataBound event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dataBound('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDataBound(e) {
// handle the dataBound event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dataBound('onDataBound');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dataBound(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
dataSource
Sets the data source of the widget.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Data\DataSource|array
Example - using \Kendo\Data\DataSource
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$dataSource = new \Kendo\Data\DataSource();
$chart->dataSource($dataSource);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$schema = new \Kendo\Data\DataSourceSchema();
$chart->dataSource(array('schema' => $schema));
?>
drag
Fired as long as the user is dragging the chart using the mouse or swipe gestures.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the drag event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drag('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDrag(e) {
// handle the drag event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drag('onDrag');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drag(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
dragEnd
Fired when the user stops dragging the chart.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the dragEnd event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragEnd('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDragEnd(e) {
// handle the dragEnd event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragEnd('onDragEnd');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragEnd(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
dragStart
Fired when the user starts dragging the chart.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the dragStart event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragStart('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDragStart(e) {
// handle the dragStart event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragStart('onDragStart');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->dragStart(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
drilldown
Fires when the user when the user wants to drill down on a specific point.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the drilldown event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldown('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDrilldown(e) {
// handle the drilldown event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldown('onDrilldown');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldown(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
drilldownLevelChange
Fires when the drill-down level has changed.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the drilldownLevelChange event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldownLevelChange('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onDrilldownLevelChange(e) {
// handle the drilldownLevelChange event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldownLevelChange('onDrilldownLevelChange');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->drilldownLevelChange(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
legend
The chart legend configuration options.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartLegend|array
Example - using \Kendo\Dataviz\UI\ChartLegend
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$legend = new \Kendo\Dataviz\UI\ChartLegend();
$align = 'value';
$legend->align($align);
$chart->legend($legend);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$align = 'value';
$chart->legend(array('align' => $align));
?>
legendItemClick
Fires when an legend item is clicked, before the selected series visibility is toggled. Can be cancelled. For additional information check the legendItemClick event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemClick('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onLegendItemClick(e) {
// handle the legendItemClick event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemClick('onLegendItemClick');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemClick(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
legendItemHover
Fires when an legend item is hovered. For additional information check the legendItemHover event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemHover('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onLegendItemHover(e) {
// handle the legendItemHover event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemHover('onLegendItemHover');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemHover(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
legendItemLeave
Fires when the cursor leaves a legend item. For additional information check the legendItemLeave event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemLeave('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onLegendItemLeave(e) {
// handle the legendItemLeave event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemLeave('onLegendItemLeave');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->legendItemLeave(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
noteClick
Fired when the user clicks one of the notes.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the noteClick event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Click('function(e) { }');</p></blockquote>
?>
Example - using string which defines a JavaScript name
<script>
function onNoteClick(e) {
// handle the noteClick event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Click('onNoteClick');</p></blockquote>
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Click(new \Kendo\JavaScriptFunction('function(e) { }'));</p></blockquote>
?>
noteHover
Fired when the user hovers one of the notes.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the noteHover event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Hover('function(e) { }');</p></blockquote>
?>
Example - using string which defines a JavaScript name
<script>
function onNoteHover(e) {
// handle the noteHover event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Hover('onNoteHover');</p></blockquote>
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Hover(new \Kendo\JavaScriptFunction('function(e) { }'));</p></blockquote>
?>
noteLeave
Fired when the cursor leaves a note.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the noteLeave event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Leave('function(e) { }');</p></blockquote>
?>
Example - using string which defines a JavaScript name
<script>
function onNoteLeave(e) {
// handle the noteLeave event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Leave('onNoteLeave');</p></blockquote>
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart-<blockquote class='note'><p>Leave(new \Kendo\JavaScriptFunction('function(e) { }'));</p></blockquote>
?>
paneDefaults
The default options for all panes.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartPaneDefaults|array
Example - using \Kendo\Dataviz\UI\ChartPaneDefaults
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$paneDefaults = new \Kendo\Dataviz\UI\ChartPaneDefaults();
$background = 'value';
$paneDefaults->background($background);
$chart->paneDefaults($paneDefaults);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->paneDefaults(array('background' => $background));
?>
paneRender
Fires when a pane is rendered because the chart is rendered, or the chart performs panning or zooming, or because the chart is exported with different options. The event can be used to render custom visuals in the panes. For additional information check the paneRender event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->paneRender('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onPaneRender(e) {
// handle the paneRender event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->paneRender('onPaneRender');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->paneRender(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
addPane
Adds one or more ChartPane to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartPane|array
Example - using \Kendo\Dataviz\UI\ChartPane
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$pane = new \Kendo\Dataviz\UI\ChartPane();
$background = 'value';
$pane->background($background);
$chart->addPane($pane);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->addPane(array('background' => $background));
?>
Example - adding more than one ChartPane
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartPane();
$second = new \Kendo\Dataviz\UI\ChartPane();
$chart->addPane($first, $second);
?>
pannable
Specifies if the chart can be panned.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value boolean|\Kendo\Dataviz\UI\ChartPannable|array
Example - using boolean
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->pannable(true);
?>
Example - using \Kendo\Dataviz\UI\ChartPannable
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$pannable = new \Kendo\Dataviz\UI\ChartPannable();
$key = 'value';
$pannable->key($key);
$chart->pannable($pannable);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$key = 'value';
$chart->pannable(array('key' => $key));
?>
Configures the export settings for the saveAsPDF method.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartPdf|array
Example - using \Kendo\Dataviz\UI\ChartPdf
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$pdf = new \Kendo\Dataviz\UI\ChartPdf();
$author = 'value';
$pdf->author($author);
$chart->pdf($pdf);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$author = 'value';
$chart->pdf(array('author' => $author));
?>
persistSeriesVisibility
Specifies if the series visible option should be persisted when changing the dataSource data.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value boolean
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->persistSeriesVisibility(true);
?>
plotArea
The plot area configuration options. The plot area is the area which displays the series.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartPlotArea|array
Example - using \Kendo\Dataviz\UI\ChartPlotArea
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$plotArea = new \Kendo\Dataviz\UI\ChartPlotArea();
$background = 'value';
$plotArea->background($background);
$chart->plotArea($plotArea);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->plotArea(array('background' => $background));
?>
plotAreaClick
Fired when the user clicks the plot area. For additional information check the plotAreaClick event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaClick('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onPlotAreaClick(e) {
// handle the plotAreaClick event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaClick('onPlotAreaClick');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaClick(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
plotAreaHover
Fired when the user hovers the plot area. For additional information check the plotAreaHover event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaHover('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onPlotAreaHover(e) {
// handle the plotAreaHover event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaHover('onPlotAreaHover');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaHover(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
plotAreaLeave
Fired when the cursor leaves the plotArea. For additional information check the plotAreaLeave event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaLeave('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onPlotAreaLeave(e) {
// handle the plotAreaLeave event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaLeave('onPlotAreaLeave');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->plotAreaLeave(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
renderEvent
Fired when the chart is ready to render on screen.Can be used, for example, to remove loading indicators.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the render event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->renderEvent('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onRender(e) {
// handle the render event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->renderEvent('onRender');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->renderEvent(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
renderAs
Sets the preferred rendering engine. If it is not supported by the browser, the Chart will switch to the first available mode.The supported values are: "svg" - renders the widget as inline SVG document, if available or "canvas" - renders the widget as a Canvas element, if available..
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->renderAs('value');
?>
select
Fired when the user modifies the selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the select event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->select('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSelect(e) {
// handle the select event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->select('onSelect');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->select(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
selectEnd
Fired when the user completes modifying the selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the selectEnd event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectEnd('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSelectEnd(e) {
// handle the selectEnd event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectEnd('onSelectEnd');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectEnd(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
selectStart
Fired when the user starts modifying the axis selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the selectStart event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectStart('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSelectStart(e) {
// handle the selectStart event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectStart('onSelectStart');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->selectStart(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
addSeriesItem
Adds one or more ChartSeriesItem to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartSeriesItem|array
Example - using \Kendo\Dataviz\UI\ChartSeriesItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$seriesItem = new \Kendo\Dataviz\UI\ChartSeriesItem();
$aggregate = 'value';
$seriesItem->aggregate($aggregate);
$chart->addSeriesItem($seriesItem);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$aggregate = 'value';
$chart->addSeriesItem(array('aggregate' => $aggregate));
?>
Example - adding more than one ChartSeriesItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartSeriesItem();
$second = new \Kendo\Dataviz\UI\ChartSeriesItem();
$chart->addSeriesItem($first, $second);
?>
seriesClick
Fired when the user clicks the chart series. For additional information check the seriesClick event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesClick('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSeriesClick(e) {
// handle the seriesClick event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesClick('onSeriesClick');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesClick(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
seriesColors
The default colors for the chart's series. When all colors are used, new colors are pulled from the start again.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value array
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesColors(array());
?>
seriesDefaults
The default options for all series.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartSeriesDefaults|array
Example - using \Kendo\Dataviz\UI\ChartSeriesDefaults
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$seriesDefaults = new \Kendo\Dataviz\UI\ChartSeriesDefaults();
$gap = 1;
$seriesDefaults->gap($gap);
$chart->seriesDefaults($seriesDefaults);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$gap = 1;
$chart->seriesDefaults(array('gap' => $gap));
?>
seriesHover
Fired when the user hovers the chart series.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the seriesHover event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesHover('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSeriesHover(e) {
// handle the seriesHover event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesHover('onSeriesHover');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesHover(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
seriesLeave
Fired when the cursor leaves a chart series. For additional information check the seriesLeave event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesLeave('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSeriesLeave(e) {
// handle the seriesLeave event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesLeave('onSeriesLeave');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesLeave(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
seriesOver
Fired when the cursor is over the chart series. For additional information check the seriesOver event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesOver('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onSeriesOver(e) {
// handle the seriesOver event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesOver('onSeriesOver');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->seriesOver(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
subtitle
The chart subtitle configuration options or text.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\Dataviz\UI\ChartSubtitle|array
Example - using string
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->subtitle('value');
?>
Example - using \Kendo\Dataviz\UI\ChartSubtitle
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$subtitle = new \Kendo\Dataviz\UI\ChartSubtitle();
$align = 'value';
$subtitle->align($align);
$chart->subtitle($subtitle);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$align = 'value';
$chart->subtitle(array('align' => $align));
?>
theme
The chart theme. This can be either a built-in theme or "sass". When set to "sass" the chart will read the variables from the Sass-based themes. More information on the built-in themes could be found in the Less-based themes article.The supported values are: "sass" - special value, see notes; "black"; "blueopal"; "bootstrap"; "default"; "fiori"; "flat"; "highcontrast"; "material"; "materialblack"; "metro"; "metroblack"; "moonlight"; "nova"; "office365"; "silver" or "uniform".
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->theme('value');
?>
title
The chart title configuration options or text.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\Dataviz\UI\ChartTitle|array
Example - using string
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->title('value');
?>
Example - using \Kendo\Dataviz\UI\ChartTitle
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$title = new \Kendo\Dataviz\UI\ChartTitle();
$align = 'value';
$title->align($align);
$chart->title($title);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$align = 'value';
$chart->title(array('align' => $align));
?>
tooltip
The chart series tooltip configuration options.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value \Kendo\Dataviz\UI\ChartTooltip|array
Example - using \Kendo\Dataviz\UI\ChartTooltip
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$autoHide = true;
$tooltip->autoHide($autoHide);
$chart->tooltip($tooltip);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$autoHide = true;
$chart->tooltip(array('autoHide' => $autoHide));
?>
transitions
If set to true the chart will play animations when displaying the series. By default animations are enabled.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value boolean
Example
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->transitions(true);
?>
addValueAxisItem
Adds one or more ChartValueAxisItem to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartValueAxisItem|array
Example - using \Kendo\Dataviz\UI\ChartValueAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$valueAxisItem = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$background = 'value';
$valueAxisItem->background($background);
$chart->addValueAxisItem($valueAxisItem);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->addValueAxisItem(array('background' => $background));
?>
Example - adding more than one ChartValueAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$second = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$chart->addValueAxisItem($first, $second);
?>
addXAxisItem
Adds one or more ChartXAxisItem to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartXAxisItem|array
Example - using \Kendo\Dataviz\UI\ChartXAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$xAxisItem = new \Kendo\Dataviz\UI\ChartXAxisItem();
$background = 'value';
$xAxisItem->background($background);
$chart->addXAxisItem($xAxisItem);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->addXAxisItem(array('background' => $background));
?>
Example - adding more than one ChartXAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartXAxisItem();
$second = new \Kendo\Dataviz\UI\ChartXAxisItem();
$chart->addXAxisItem($first, $second);
?>
addYAxisItem
Adds one or more ChartYAxisItem to the Chart.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\ChartYAxisItem|array
Example - using \Kendo\Dataviz\UI\ChartYAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$yAxisItem = new \Kendo\Dataviz\UI\ChartYAxisItem();
$background = 'value';
$yAxisItem->background($background);
$chart->addYAxisItem($yAxisItem);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$background = 'value';
$chart->addYAxisItem(array('background' => $background));
?>
Example - adding more than one ChartYAxisItem
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$first = new \Kendo\Dataviz\UI\ChartYAxisItem();
$second = new \Kendo\Dataviz\UI\ChartYAxisItem();
$chart->addYAxisItem($first, $second);
?>
zoom
Fired as long as the user is zooming the chart using the mousewheel.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the zoom event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoom('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onZoom(e) {
// handle the zoom event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoom('onZoom');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoom(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
zoomEnd
Fired when the user stops zooming the chart.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the zoomEnd event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomEnd('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onZoomEnd(e) {
// handle the zoomEnd event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomEnd('onZoomEnd');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomEnd(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
zoomStart
Fired when the user uses the mousewheel to zoom the chart.The event handler function context (available via the this keyword) will be set to the widget instance. For additional information check the zoomStart event documentation.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string which defines a JavaScript function
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomStart('function(e) { }');
?>
Example - using string which defines a JavaScript name
<script>
function onZoomStart(e) {
// handle the zoomStart event.
}
</script>
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomStart('onZoomStart');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomStart(new \Kendo\JavaScriptFunction('function(e) { }'));
?>
zoomable
Specifies if the chart can be zoomed.
Returns
\Kendo\Dataviz\UI\Chart
Parameters
$value boolean|\Kendo\Dataviz\UI\ChartZoomable|array
Example - using boolean
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$chart->zoomable(true);
?>
Example - using \Kendo\Dataviz\UI\ChartZoomable
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$zoomable = new \Kendo\Dataviz\UI\ChartZoomable();
$mousewheel = true;
$zoomable->mousewheel($mousewheel);
$chart->zoomable($zoomable);
?>
Example - using array
<?php
$chart = new \Kendo\Dataviz\UI\Chart('Chart');
$mousewheel = true;
$chart->zoomable(array('mousewheel' => $mousewheel));
?>