0

I have fulltime and parttime employee's data. And I get the the total numbers of both parties using select_sum. The problem is how can I display their data using highchart the total numbers of fulltime and total numbers of parttime distributed by department.

Im a newbhie and dont know how to make it dynamic. Thats why I'll try use it in static data. Thanks in advance.

DB :

_____________________________________________________________
| id | account_id  |   fulltime   |  partime  |  department  |
|____|_____________|______________|___________|______________|
| 1  |      3      |      1       |   null    |      3       |
|____|_____________|______________|___________|______________|
| 2  |      5      |     null     |     1     |      1       |
|____|_____________|______________|___________|______________|
| 3  |      6      |       1      |    null   |      2       |
|____|_____________|______________|___________|______________|

LEGEND :

department : 1 = 'COF'
           : 2 = 'CAS'
           : 3 = 'CCS'

I use the following :

JS :

$(function(){

    var full= $.getJSON('<?php echo base_url('public/employee/fulltime');?>', 
        function (data1){
            console.log(data1);
    });

    var data = [
     { y: 'COF', z0: 'Part Time' , a0: 275, z1: 'Full Time' , a1: full},
     { y: 'CAS', z0: 'Part Time' , a0: 440, z1: 'Full Time' , a1: 332},
     { y: 'CCS', z0: 'Part Time' , a0: 450, z1: 'Full Time' , a1: 425},
     { y: 'CFND', z0: 'Part Time' , a0: 462, z1: 'Full Time' , a1: 435},
     { y: 'CHMT', z0: 'Part Time' , a0: 504, z1: 'Full Time' , a1: 162},
     { y: 'CTE', z0: 'Part Time' , a0: 400, z1: 'Full Time' , a1: 162},
     { y: 'CBMA', z0: 'Part Time' , a0: 260, z1: 'Full Time' , a1: 79},
     { y: 'CCJE', z0: 'Part Time' , a0: 129, z1: 'Full Time' , a1: 42},
     { y: 'ADMIN', z0: 'Part Time' , a0: 129, z1: 'Full Time' , a1: 42}

    ]

    Morris.Bar({
      element: 'chart',
      data: data,
        xkey: 'y',
        ykeys: ['a0', 'a1'],
        labels: ['Label1', 'Label2'],
        fillOpacity: 0.6,
        hideHover: 'auto',
        behaveLikeLine: true,
        resize: true,
        stacked: true,
        pointFillColors:['#ffffff'],
        pointStrokeColors: ['black'],
        lineColors:['lime', 'blue', 'red', 'cyan', '#909090'],
        xLabelAngle: 60,
        hoverCallback: function (index, options, content, row) {
        var currentDiv = "";
        var finalContent = $("<div/>");

        $(content).each(function () {
            currentDiv = $(this);
            currentDiv.html(currentDiv.html().replace("Label1", data[index].z0).replace("Label2", data[index].z1))
            $(finalContent).append(currentDiv);
        });
        
        $(finalContent)
        return finalContent;    
      }
    });

});

CONTROLLER :

public function fulltime()
{

    $fulltime = $this->account_model->get_fulltime();
        echo json_encode($fulltime);
}

MODEL :

public function get_fulltime()
{
    $this->db->select_sum('fulltime');
    $this->db->from('list_of_employee');

    return $this->db->get()->result();
}

screenshot

1 Answer 1

0

Put the data that you get from the Ajax response as an input data to your Highcharts script
1- Make your query of data as the structure of Highcharts.
2- Make a PHP Action in your Controller to call the previous query.
3- Consume the PHP Action in Ajax Call and let the response data by the input of your Highchats.

Sign up to request clarification or add additional context in comments.

3 Comments

@Azzam can you give me a pattern for highcharts script. dont know how it works.
Yeah Sure , plz watch this video and you will get what you seek youtube.com/watch?v=e7zrTWrEcX4
also, you can have more details here Highcharts with PHP and Mysql

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.