[Extension] HighchartsWidget Wrapper widget for Highcharts Javascript library
#41
Posted 21 March 2012 - 03:06 PM
great extension!
My problem is: I would like to use the json key-value pair pointStart: Date.UTC(2009,9,6,0,0,0)
in a php array.
But it does not work.
I tried:
'pointStart'=>'Date.UTC(2009,9,6,0,0,0)'
'pointStart'=>'js:Date.UTC(2009,9,6,0,0,0)'
Any idea?
Thanks Laszlo from Hungary
#42
Posted 29 March 2012 - 05:22 PM
Awesome extension! Has made using Highcharts a breeze in Yii.
2 questions:
1. When setting tooltip formats such as:
'tooltip'=>array( 'crosshairs'=>true, 'shared'=>true, 'valuePrefix'=>'$', 'valueDecimals'=>2, ),
It seems default formatting is preserved. I've looked through the highcharts api docs and I believe this to be the correct format and datatypes that are getting passed into the tooltip/options variable. What am I missing?
2. When needing to attach a javascript function to the chart variable that is generated by the core highchartswidget - where/how do you pass this javascript function?
Take for instance this code:
http://jsfiddle.net/hfrntt/QMXe8/
and the function that is being attached to the chart variable for displaying a tooltip on hover of the legend.
#43
Posted 14 April 2012 - 01:04 PM
Q:
I'm trying to show the time on x axis (coming from DB) in local time.
According to HighCharts forum, HC displays the time in UTC by default and this the way to override it:
Highcharts.setOptions({ global: { useUTC: false } });
But I don't seem to be able to make it work...
$this->Widget('ext.highcharts.HighchartsWidget', array( 'options'=>array( 'global' => array('useUTC' => 'false'), ...
Not working for me.
Any ideas?
#44
Posted 08 May 2012 - 12:15 PM
I've seen in the extension comments that the values from the dataprovider have to be integers. Is there no way to make it accept doubles or floats?
I manually created an array with doubles and it works. What doesn't work is directly loading the values from my db that I've stored as decimal(5,2).

#45
Posted 17 May 2012 - 03:29 PM
if(isset($statements)) { foreach($statements as $key => $value) { $statement_totals[] = (float)$value; } }
Once you do this, the tooltip option should let you change the way your data is displayed to having x number of decimals
'tooltip'=> array( 'valueDecimals'=>2, 'valuePrefix'=>'$', ),
...but it doesn't. I can't seem to make the tooltip array work and that is what I came here needing assistance for. Anyone have any idea?
EDIT: Using yii 1.1.10 you need to update the highcharts.js and highcharts.src.js files from the highcharts website, then tooltips will work as I described here.
#46
Posted 24 May 2012 - 05:10 AM
When I generate a pdf that include a chart, the chart don't appears in the pdf, but an SVG image are included into a pdf. well I want to know how is possible generate the SVG using widget code.
sorry for my english
thanks
#47
Posted 01 June 2012 - 02:49 AM

i use this extension for my application, but i find a problem, how to change the default font size? such as for title, xAxis label etc.. how should i do?
thanks
#48
Posted 17 September 2012 - 12:45 PM
$this->Widget('ext.highcharts.HighchartsWidget', array( 'options' => array( 'chart'=>array('events'=>array('load'=>'function(event) { alert ("Chart loaded");')), ));
can you please help me with this? is urgent
#50
Posted 15 November 2012 - 09:16 AM
#51
Posted 28 November 2012 - 07:13 PM
BigZ, on 14 April 2012 - 01:04 PM, said:
Q:
I'm trying to show the time on x axis (coming from DB) in local time.
According to HighCharts forum, HC displays the time in UTC by default and this the way to override it:
Highcharts.setOptions({ global: { useUTC: false } });
But I don't seem to be able to make it work...
$this->Widget('ext.highcharts.HighchartsWidget', array( 'options'=>array( 'global' => array('useUTC' => 'false'), ...
Not working for me.
Any ideas?
Hi, I'm new in Yii and I had this problem too, but I solved it by adding the code from Hihgcharts examples to disable UTC:
'series' => array( array( 'name' => 'Temperatura', 'data' => "js:(function(){ Highcharts.setOptions({ global: { useUTC: false } }); . . . })()
I put that code when I'm loading the series values, but you can add it in whereever you load a javascript, it could be in an event like this:
'events' => array( 'load' => 'js:function(){ Highcharts.setOptions({ global: { useUTC: false } }); }' ),
Good luck, sorry for my english

#52
Posted 28 November 2012 - 07:16 PM
dominus, on 17 September 2012 - 12:45 PM, said:
$this->Widget('ext.highcharts.HighchartsWidget', array( 'options' => array( 'chart'=>array('events'=>array('load'=>'function(event) { alert ("Chart loaded");')), ));
can you please help me with this? is urgent
Try
js:function(){
hope it work...

#53
Posted 05 March 2013 - 08:44 AM
It's possible use multiple series dynamic (live) in this extension?
Give me an exemple please.
#54
Posted 19 April 2013 - 05:12 AM
$this->Widget('ext.highcharts.HighchartsWidget', array( 'options'=>array( 'chart' => array('type' =>'bar'), 'title' => array('text' => 'Historic World Population by Region'), 'subtitle' => array('text' => 'Wikipedia.org'), 'xAxis' => array( 'categories' => array('Africa', 'America', 'Asia', 'Europe', 'Oceania'), 'title' => array('text' =>'null'), ), 'yAxis' => array( 'min' => '0', 'title' => array( 'text' => 'Population (millions)', 'align' => 'high', ), 'labels' => array('overflow' => 'justify'), ), 'tooltip' => array('valueSuffix' => 'millions'), 'plotOptions' => array('bar' => array('dataLabels' => array('enabled' => true))), 'legend' => array( 'layout' => 'vertical', 'align' => 'right', 'verticalAlign' => 'top', 'x' => -100, 'y' => 100, 'floating' => true, 'borderWidth' => 1, 'backgroundColor' => '#FFFFFF', 'shadow' => true, ), 'credits' => array('enabled' => 'false'), 'series' => array(array( 'name' => 'Year 1800', 'data' => array( array(107), array(31), array(635), array(203), array(2) ), ), array( 'name' => 'Year 1900', 'data' => array( array(133), array(156), array(947), array(408), array(6) ), ), array( 'name' => 'Year 1900', 'data' => array( array(973), array(914), array(4054), array(732), array(34) ), ), ) ) ));
Any ideas?
#55
Posted 26 April 2013 - 08:59 AM
The modal appears empty. How to use the "redraw ()" in this case?
#56
Posted 04 June 2013 - 04:16 AM
When enter the form, i set a graph with datas corresponding of the actual year, but i want that the user choose another period if he wants.
I dont see what exactly how i can refresh the chart.
Here is my code
<h3>Fréquentation</h3> <br> <h4>Choix de la période: <?php // sélection mois Yii::app()->user->setState('mois',$model->mois); echo CHtml::DropDownList('mois', Yii::app()->user->getState('mois') , array('00' => 'Toute l\'année','01'=>'Janvier', '02'=>'Février', '03'=>'Mars', '04'=>'Avril', '05'=>'Mai', '06'=>'Juin', '07'=>'Juillet', '08'=>'Août', '09'=>'Septembre', '10'=>'Octobre', '11'=>'Novembre', '12'=>'Décembre'), array( 'ajax'=>array( 'type' => 'POST', 'url' => Yii::app()->createUrl('activities/majMois'), 'data'=>"js:{mois: $(this).val()}", ) ) ); // sélection année $listAnnee = CHtml::listData(Activities::model()->findAllBySql('SELECT generate_series as annee FROM generate_series(2008,' . $model->annee .')'),'annee','annee'); Yii::app()->user->setState('annee',$model->annee); echo CHtml::DropDownList('annee', Yii::app()->user->getState('annee') , $listAnnee, array( 'ajax'=>array( 'type' => 'POST', 'url' => Yii::app()->createUrl('activities/majAnnee'), 'data'=>"js:{annee: $(this).val()}", ) )); // ajaxlink pour rafraichir le graphique echo CHtml::ajaxLink("Rafraîchir le graphique", $this->createUrl('rafraichirFrequentation'), array( "type" => "post", // POST donc. 'update' => '#container3', 'success' => "js:function() { .... ///////////////// HERE IS WHAT I MISS ///////////////// .... }" )); // affichage FREQUENTATION $this->widget('ext.highcharts.HighchartsWidget',array( 'options' => array( 'chart' => array( 'renderTo'=>'container3', 'defaultSeriesType' => 'column', 'style' => array( 'fontFamily' => 'Verdana, Arial, Helvetica, sans-serif', ), ), 'title' => array('text'=>($model->mois == '00')? 'Fréquentation année ' . $model->annee : 'Fréquentation année ' . $model->annee . ' mois ' . $model->mois), 'credits' => array('enabled' => false), 'xAxis' => array( 'categories' => ($model->mois == '00')? $listeDesMois : $listeDesJours, 'dateTimeLabelFormats' => array( 'day'=> '%e. %b', 'month'=> '%b \'%y', 'year' => '%Y' ) ), 'yAxis' => array( 'tittle' => 'Nombre de visites', ), 'plotOptions' => array( 'series' => array( 'dataLabels' => array( 'enabled' => true, 'formatter' => 'js:function() { return this.y; }' ), ), 'column' => array( 'pointPadding' => 0.2, 'borderWidth' => 0 ), ), 'series' => array( array( 'type' => 'column', 'data' => $frequentation, 'showInLegend' => false, // la légende n'a d'intérêt que si on a plusieurs séries dans le même graphique ), ) ) )); echo '<div id="container3"></div>'; ?>
In the controller, i just update the 3 vars i used in the chart ($listeDesMois, $listeDesJours and frequentation).
Thanks for helping me.
#57
Posted 18 June 2013 - 02:32 AM
how to add action JS function for gauge chart usint $htmlOptions param.
thanx
#58
Posted 29 June 2013 - 02:40 AM
#59
Posted 12 August 2013 - 09:47 AM
www.highcharts.com/errors/16
I'm loading a chart via ajax into a partial load popup window. The first chart loads fine, but if I click a different link, subsequent charts are blank and I get the error above.
Note that this error didn't occur in versions below 3.0. It looks like the revised script is trying to load the HighCharts library more than once.
Any ideas on how to fix this?
#60
Posted 30 August 2013 - 01:53 PM
canreo, on 12 August 2013 - 09:47 AM, said:
www.highcharts.com/errors/16
I'm loading a chart via ajax into a partial load popup window. The first chart loads fine, but if I click a different link, subsequent charts are blank and I get the error above.
Note that this error didn't occur in versions below 3.0. It looks like the revised script is trying to load the HighCharts library more than once.
Any ideas on how to fix this?
I'm currently facing the same issue. Were you able to resolve it? If so, how?