Bar and Pie chart using Highchart in Yii 2

0
262
views
  1. Install highchart js to your yii. We can use the cdn / code file from highchart, but this is not recommended, and you can save to your /web/js folder. Place the js in end of your body. In example, I also create /polls-answer/index.js to initialize the highchart.

     
  2. Try to initialize the div to become the highchart. In this case, we use “bar_chart”, “pie_chart” and add dummy / sample data.


     
  3. We need to change the data and get them from ajax. So we add new route / url polls-answer/index-ajax-bar-chart, polls-answer/index-ajax-pie-chart.

    In this example, we select and count then group by id, and return the data as json.
  4. We also place the url in attribute div.

     
  5. Comment out the dummy data, and add ajax to get the data.

     

The result become this.

Reference:
https://gitlab.com/redzjovi/dprp17
https://gitlab.com/redzjovi/dprp17/commit/f14968656a285026304a0b2851679c6f10011c7f [Highchart] add div, js.
https://gitlab.com/redzjovi/dprp17/commit/1802171f4aae1599b18ab0f5f0fecd7d1e64f9be [Highchart] data bar, pie chart from ajax.

Thanks to:
– dprp17

LEAVE A REPLY

Please enter your name here
Please enter your comment!