Невозможно отобразить диаграмму Morris.JS на странице Codeigniter, используя данные JSON в качестве входных данных для диаграмм. - PullRequest
Новая
       7

Невозможно отобразить диаграмму Morris.JS на странице Codeigniter, используя данные JSON в качестве входных данных для диаграмм.

1 голос
/ 14 апреля 2019

Я использую последние Codeigniter и MorrisJS. Я создал представление для диаграмм и передаю динамические данные через JSON, но это, похоже, не работает. Я убедился, что все зависимые JS и CSS для MorrisJS отображаются в представлении. Когда я статически передаю фиктивные данные в опции Chart, он отлично генерирует диаграмму. Не работает только при передаче данных JSON. Пожалуйста, не могли бы вы помочь мне в этом, я уверен, что совершил глупую ошибку, но не могу ее понять.

My View: 

<div id="myfirstchart" style="height: 250px;"></div>
    <script>
        Morris.Bar({
            element: 'myfirstchart',
            data: <?php echo $graphData; ?>,
            xkey: 'MonthName',
            ykeys: ['totalTicket'],
            labels: ['Value']
        });
    </script>

Мой контроллер: 

    public function index(){
        $x['graphData']=json_encode($result);
        $this->load->view('common/header');
        $this->load->view('common/main_top_navbar');
        $this->load->view('reports/trends');
        $this->load->view('common/footer',$x);
    }

Моя модель: 

class Reports_model extends CI_Model{
    function display_monthOnMonth_records(){
        $this->db->select('MONTHNAME(CreatedOn) as MonthName, count(TicketID) as totalTicket');
        $this->db->from('TBL_tickets');
        $this->db->group_by('MonthName');
        $this->db->order_by('
            FIELD(
                MonthName,
                "January",
                "February",
                "March",
                "April",
                "May",
                "June",
                "July",
                "August",
                "September",
                "October",
                "November",
                "December"
            )
            ');
        $query=$this->db->get();
        return $query->result();
    }
}

Когда я запускаю это, я вижу в Браузере Chrome / странице Проверка (F12), что данные отображаются для ввода данных, но не создают Диаграмму на Странице.

Из результатов проверки браузера: 

<script>

        Morris.Bar({
            element: 'myfirstchart',
            data: {"data":[{"MonthName":"January","totalTicket":"2500"},{"MonthName":"February","totalTicket":"2200"},{"MonthName":"March","totalTicket":"2350"}]},
            xkey: 'MonthName',
            ykeys: ['totalTicket'],
            labels: ['Value']
        });

</script>

1 Ответ

0 голосов
/ 14 апреля 2019

В методе index() измените: 

    $x['graphData']=json_encode($result);

на: 

    $x['graphData']=json_encode($result->data);

Из того, что я вижу из вывода, у вас есть дополнительный data родитель.

...