我没有使用codeigniter得到饼图

时间:2015-08-04 18:19:42

标签: ajax json codeigniter charts pie-chart

我想要一个百分比的饼图,我的代码在下面,当我运行代码时它没有显示任何内容。请帮助。如果可能请更正代码。我真的很困惑,只有空白页面来了。

我的控制器图表

 class Chart extends CI_Controller {

    function chart() {
        parent::__construct();

        $this->load->helper(array('form', 'url'));
        $this->load->model('chart_m');
        $this->load->library('session');
    }


public function index()
{   

        $data['pie'] = json_encode($this->chart_m->selectexpenses());

        $this->load->view('home',$data);
}
}

model chart_m
<?php

if (!defined('BASEPATH'))
    exit('No direct script access allowed');

class Chart_m extends CI_Model {

    function __construct() {
        parent::__construct();

        $this->load->database();
    }


function selectexpenses()
{




$results = $this->db->query("SELECT expenses from myTable");

return $results->result_array();
}
}

我的观点页面home.php

   <html>


     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
        <head><script>

    $(document).ready(function () {

    $(function () {
        var chart;

        // Build the chart
        $('.widget-lower-left#widget').highcharts({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'expenses'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage}%</b>',
                percentageDecimals: 1
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: false
                    },
                    showInLegend: true
                }
            },
            series: [{
                type: 'pie',
                name: 'expenses',
                data: []
            }]

    });

    });


    function requestData() {
    $.ajax({
         url:'<?php echo base_url().'index.php/chart'?>',
        datatype: "json",
        success: function(data) {

            alert(data);
            console.log(data);

           var newData = [];
    for( var i = 0, len = data.length; i < len; i++ ) {
        var item = data[i];
        for(var j in item){
            newData.push([j,item[j]]);
        }
    }
    chart.series[0].setData(newData);
    </script>

        },
        cache: false
    });

    };

    });

    ////////////////////////

1 个答案:

答案 0 :(得分:0)

可能你应该试试这个..

                RewriteEngine on
            RewriteCond $1 !^(index\.php|public|images|robots\.txt)
            RewriteRule ^(.*)$ /index.php/$1 [L]  

控制器就像

<?php
            class Charts extends Controller {

                public function __construct() {
                    parent::__construct();
                    $this->load->library('FusionCharts');
                }

                public function index() {
                    $this->load->view('charts_index');
                }

                public function getData($year='2010') {

                    // Instantiate the FusionCharts object 
                    $FC = new FusionCharts(); 

                    // specify the graph parameters
                    $strParam="caption=Quarterly Sales for ".$year.";xAxisName=Quarter;yAxisName=Revenue;numberPrefix=$;decimalPrecision=0;formatNumberScale=1";
                    $FC->setChartParams($strParam);

                    // specify the data bsaed on the $year parameter
                    if ($year=='2010') {
                        $FC->addChartData("40800","name=Q1");
                        $FC->addChartData("31400","name=Q2");
                        $FC->addChartData("26700","name=Q3");
                        $FC->addChartData("54400","name=Q4");
                    } else {    
                        $FC->addChartData("800","name=Q1");
                        $FC->addChartData("400","name=Q2");
                        $FC->addChartData("700","name=Q3");
                        $FC->addChartData("200","name=Q4");
                    }
                    // output the FusionCharts XML
                    print $FC->getXML();
                }
            }
            ?>

,视图就像这样

                <html>
                <head>
                <title>Dynamic Graphs with JQuery and FusionCharts</title>
                <script language="JavaScript" src="/public/js/FusionCharts.js"></script>
                <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
                <script language="JavaScript">
                function drawChart(chartSWF, strXML, chartdiv) {
                    //Create another instance of the chart.
                    var chart = new FusionCharts(chartSWF, "chart1Id", "400", "300", "0", "0"); 
                    chart.setDataXML(strXML);
                    chart.render(chartdiv);
                }
                function updateChart() {
                    //call the CI data url
                    $.get('/charts/getData/'+$('#changeData').val(), function(data) {
                        if ($('#changeChart').val()==='3d') {
                            drawChart("/public/fscharts/FCF_Column3D.swf", data,"chart1div");
                        } else {
                            drawChart("/public/fscharts/FCF_Column2D.swf", data,"chart1div");
                        }
                    });
                }
                $(document).ready(function(){
                    //create the chart initially
                    $.get('/charts/getData/', function(data) {
                        drawChart("/public/fscharts/FCF_Column3D.swf", data, "chart1div");
                    });
                    //update the chart if the dropdown selection changes
                    $('#changeChart').change(function() {
                        updateChart();
                    });
                    $('#changeData').change(function() {
                        updateChart();
                    });

                });
                </script>
                </head>
                <body>
                <select name="changeData" id="changeData">
                    <option value="2010" selected>2010</option>
                    <option value="2009">2009</option>
                </select>
                <select name="changeChart" id="changeChart">
                    <option value="3d">3D Version</option>
                    <option value="2d">2D Version</option>
                </select><br>
                <div id="chart1div" align="left">The chart will appear within this DIV. This text will be replaced by the chart.</div>
                </body>
                </html>

希望这能帮助您更好地访问此网站...

Click ON this for More Help