Create thermometer using rgraph

5 followers

This wiki article has not been tagged with a corresponding Yii version yet.
Help us improve the wiki by updating the version information.

Hi friends,

First I would like to thanks robregonm for it's very nice extension developing

By using this extension we will create a thermometer like on this demo http://www.rgraph.net/examples/thermometer.html

You can downloaded the Rgraph extesion using this link www.yiiframework.com/extension/rgraph/ and create the RGraphThermometer.php on Regraph folder...

<?php
/**
 * RGraph Bars class
 * @author Ankit Modi
 * @date 24/07/2013 09:25 AM
 */
require_once('RGraphWidget.php');
class RGraphThermometer extends RGraphWidget
{
    public function init()
    {
        parent::init();
        $this->registerScriptFile('RGraph.thermometer.js');
        $this->registerScriptFile('RGraph.common.dynamic.js');
        $this->registerScriptFile('RGraph.common.tooltips.js');
    }
 
    public function run()
    {
        parent::run();
        $id = 'Thermometer' . $this->getId();
 
        $data = CJSON::encode($this->data);
 
 
        $script = "var $id = new RGraph.Thermometer('{$this->getId()}',{$this->data});";
        $script .= $this->getEncodedOptions($id);
        $script .= "{$id}.{$this->drawFunction};";
 
        $cs = Yii::app()->getClientScript();
        $cs->registerScript($id, $script);
    }
}

and call the extension using rgraph method..

<div style="text-align: center">
<?php
$str = ',00,100,28,';
$str = implode(',', array_filter(explode(',', $str))); // 280,253,279
//p($str,0);
 
 
$this->widget('application.widgets.rgraph.RGraphThermometer', array(
    'data'=>$str,
    'id'=>'thermo1',
    'options' => array(
        'chart' => array(
            'colors' => array('red'),
            'title.side' => 'This servers target load',
            'scale.visible'=>true,
            'scale.decimals'=>2,
 
            'gutter' => array(
                'right' => 25,
            ),
            'labels.count'=>5,
            //'tooltips'=>array("It's getting <b style='color: red'>hot</b> in her1!"),
            'tooltips.highlight'=>true,
        ),
    ),
    'htmlOptions'=>array(
        'height'=>'400',
        'width'=>'100',
    )
));
?>
</div>
<style>
#therometer{text-align: center}
</style>

Hope it's of some help.

Total 2 comments

#16474 report it
Ankit Modi at 2014/02/26 10:41pm
Thanks

Thanks robregonm... It's really great extension.

#16469 report it
robregonm at 2014/02/26 10:42am
I will merge this to graph extension

Hi Ankit, This wiki looks great, I will merge it to my rgraph extension. That way you have no need to add anything manually.

Thanks for your contribution.

Regards.

Leave a comment

Please to leave your comment.

Write new article