Membuat tampilan Highchart pada YII Framework

     Pada kesempatan kali ini ane akan membuat tutorial bagaimana caranya supaya ekstensi chart bisa mempercantik tampilan aplikasi YII Framework anda.
     Alat tempur pertama yang pastinya kita baca-baca dulu mengenai highchart . Ane ambil langsung dari web resmi YII nya yaitu di http://www.yiiframework.com/extension/highcharts/
     Dari sana kita disarankan untuk mendownload link repositorinya. Link mengarah pada github dan kita clone folder nya
alamat githubnya : https://github.com/miloschuman/yii-highcharts. Sebenernya untuk yang belum punya akun github bisa langsung download aja file zip nya.
Setelah didownload kita simpan dalam folder namaapp/protected/extensions
Kemudian buka file main.php pada /protected/config/main.php
masukkan baris kode ini
'import'
'import'=>array(
'application.models.*',
'application.components.*',
'ext.yii-highcharts.*',
),
Lalu kita masukkan kode baris widget highchart pada file view kita
<?php $this->Widget('ext.yii-highcharts.highcharts.HighchartsWidget', array(   'options'=>array(
      'title' => array('text' => 'Fruit Consumption'),
      'xAxis' => array(
         'categories' => array('Apples', 'Bananas', 'Oranges')
      ),
      'yAxis' => array(
         'title' => array('text' => 'Fruit eaten')
      ),
      'series' => array(
         array('name' => 'Jane', 'data' => array(1, 0, 4)),
         array('name' => 'John', 'data' => array(5, 7, 3))
      )
   )
)); ?>
Jangan lupa pada baris kode ini awalnya seperti ini
$this->Widget('ext.highcharts.HighchartsWidget'
Kita ubah menjadi
$this->Widget('ext.yii-highcharts.highcharts.HighchartsWidget'
Dan hasilnya kita lihat

Posting Komentar

0 Komentar