codeigniter
  1. codeigniter-dynamic-highcharts-in-codeigniter3

Dynamic Highcharts in CodeIgniter 3

Dynamic Highcharts in CodeIgniter 3 is a powerful combination that allows developers to create dynamic charts that can be updated in real time. With Highcharts, you can create interactive and customizable charts that display data in a meaningful way. In this tutorial, we will learn how to create dynamic Highcharts in CodeIgniter 3.

Syntax

The syntax for creating dynamic Highcharts in CodeIgniter 3 is as follows:

<?php echo json_encode($data); ?>

Example

Consider the following example where we want to display the number of tickets sold for each movie in a cinema:

<?php
// Controller function that retrieves data from the model and passes it to the view
public function index() {
  $data['tickets'] = $this->Ticket_model->get_tickets_data();
  $this->load->view('dynamic_highcharts', $data);
}
?>
<!-- View file that contains the Highcharts chart -->
<script type="text/javascript">
  Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Tickets Sold by Movie'
    },
    xAxis: {
        categories: <?php echo json_encode($tickets['movies']); ?>,
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Number of Tickets'
        }
    },
    series: [{
      name: 'Tickets Sold',
      data: <?php echo json_encode($tickets['numbers']); ?>
    }]
  });
</script>

Explanation

In the example above, we retrieve data from the Ticket_model in the controller function index(). We then pass this data to the view file dynamic_highcharts.php. In the view file, we use the json_encode() function to encode the data into a JavaScript object that can be used by Highcharts.

We then use the encoded data to create a Highcharts chart in the view file. We set the chart type to column and provide a title. We define the x-axis categories based on the movie titles and set the y-axis title to Number of Tickets. We then define the series data to be the number of tickets sold for each movie.

Use

Dynamic Highcharts in CodeIgniter 3 can be used to create dynamic charts that can be updated in real time. This is useful for displaying data in a meaningful way and for providing insights into trends and patterns. Highcharts is highly customizable and provides a wide range of chart options.

Important Points

  • Highcharts has a variety of chart types including line, bar, pie, and more.
  • Highcharts is highly customizable with a wide range of configuration options.
  • Dynamic Highcharts can be updated in real-time based on user actions or changes in underlying data.

Summary

Dynamic Highcharts in CodeIgniter 3 is a powerful combination that allows developers to create dynamic charts that provide insights into data. Highcharts is highly customizable and can be used to create a wide range of chart types. Dynamic Highcharts can be updated in real time based on user actions or changes in underlying data.

Published on: