简体   繁体   中英

HighCharts donut chart drilldown

I am having trouble creating a HighChart donut chart with two layers in Yii Framework. This is the code I am using for getting a one layer chart:

<?php 
$this->widget('bootstrap.widgets.TbHighCharts', array(

   // .. 'options', 'chart', 'legend', .. 

   'series' => array(
   array(
      'type' => 'pie',
      'name' => 'Series of Browsers',
      'data' => array(array('MSIE', 55), array('Firefox',10), array('Chrome',15), array('Safari', 20)),
   ),

   // ..
?>

But on the highchart website I can find only java examples on how to implement the 'drilldown'. Do you have a solution for implementing the same in php in Yii?

Thanks in advance for your help!

-- Edit --

In java I would have to do something like this:

drilldown: {
   name: 'MSIE',
   categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0'],
   data: [10.85, 7.35, 33.06, 2.81]
}

but what is the equivalent operation when using the widget in Yii?

Found out on my own after all. Hope this answer can help also other people.

<?php 
  $this->widget('bootstrap.widgets.TbHighCharts', array(

    'chart' => array(
      'borderColor'=>'#e5e5e5',
      'type' => 'pie',
    ),

    // .. 'options', 'legend', .. 

    'series' => array(
      // --------- inner layer of the pie
      array(
        'size' => '40%',
        'data' => array(
          array(
            'name' => //name
            'y' => //value
          ),
          array(
            'name' => //name
            'y' => //value
          ),
        ),
     ),
     // -------- second layer from the inside
     array(
        'size' => '60%',
        'innerSize' => '40%',
        'data' => array(
          array(
            'name' => //name
            'y' => //value
          ),
          array(
            'name' => //name
            'y' => //value
          ),
        ),
     ),
     // ----- add as manny layers as you need to
    ),
    // ..
  );
?>

Pay attention because layers are not directly linked one to the other. This means that you have to wisely set the values 'y's in order to make so that the bounds matches between the layers.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM