\Kendo\Dataviz\UI\CircularGauge
A PHP wrapper for Kendo UI CircularGauge.
Inherits from \Kendo\UI\Widget.
Usage
To use CircularGauge 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 CircularGauge
<?php
// Create a new instance of CircularGauge and specify its id
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
// Configure it
$circularGauge->color('value')
// Output it
echo $circularGauge->render();
?>
Methods
centerTemplate
The label template. Template variables: * value - the value
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value string|\Kendo\JavaScriptFunction
Example - using string
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->centerTemplate('value');
?>
Example - using \Kendo\JavaScriptFunction
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->centerTemplate(new \Kendo\JavaScriptFunction('function() { }'));
?>
color
The color of the value pointer. Accepts a valid CSS color string, including hex and rgb.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value string
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->color('value');
?>
addColor
Adds one or more CircularGaugeColor to the CircularGauge.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value[, $value2, ...] \Kendo\Dataviz\UI\CircularGaugeColor|array
Example - using \Kendo\Dataviz\UI\CircularGaugeColor
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$color = new \Kendo\Dataviz\UI\CircularGaugeColor();
$color = 'value';
$color->color($color);
$circularGauge->addColor($color);
?>
Example - using array
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$color = 'value';
$circularGauge->addColor(array('color' => $color));
?>
Example - adding more than one CircularGaugeColor
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$first = new \Kendo\Dataviz\UI\CircularGaugeColor();
$second = new \Kendo\Dataviz\UI\CircularGaugeColor();
$circularGauge->addColor($first, $second);
?>
gaugeArea
The gauge area configuration options. This is the entire visible area of the gauge.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value \Kendo\Dataviz\UI\CircularGaugeGaugeArea|array
Example - using \Kendo\Dataviz\UI\CircularGaugeGaugeArea
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$gaugeArea = new \Kendo\Dataviz\UI\CircularGaugeGaugeArea();
$background = 'value';
$gaugeArea->background($background);
$circularGauge->gaugeArea($gaugeArea);
?>
Example - using array
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$background = 'value';
$circularGauge->gaugeArea(array('background' => $background));
?>
opacity
The opacity of the value pointer.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value float
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->opacity(1);
?>
renderAs
Sets the preferred rendering engine. If it is not supported by the browser, the Gauge 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\CircularGauge
Parameters
$value string
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->renderAs('value');
?>
scale
Configures the scale.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value \Kendo\Dataviz\UI\CircularGaugeScale|array
Example - using \Kendo\Dataviz\UI\CircularGaugeScale
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$scale = new \Kendo\Dataviz\UI\CircularGaugeScale();
$majorUnit = 1;
$scale->majorUnit($majorUnit);
$circularGauge->scale($scale);
?>
Example - using array
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$majorUnit = 1;
$circularGauge->scale(array('majorUnit' => $majorUnit));
?>
theme
The gauge theme. With versions prior to R1 2023 this can be either the respective LESS theme from the list below or "sass". When set to "sass" the gauge will read the variables from the Sass-based themes.Note: Since Q2 2024 release, the default value for the theme property is "sass" instead of "default". It is recommended to use "sass" with version Q2 2024 or later.The supported values are: "sass"; "black"; "blueopal"; "bootstrap"; "default"; "highcontrast"; "metro"; "metroblack"; "moonlight"; "silver" or "uniform".
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value string
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->theme('value');
?>
transitions
A value indicating if transition animations should be played.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value boolean
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->transitions(true);
?>
value
The gauge value.
Returns
\Kendo\Dataviz\UI\CircularGauge
Parameters
$value float
Example
<?php
$circularGauge = new \Kendo\Dataviz\UI\CircularGauge('CircularGauge');
$circularGauge->value(1);
?>