在highchart中动态添加绘图带

时间:2016-07-25 14:51:46

标签: php jquery codeigniter highcharts

我是highchart的新手,我想动态添加plotband,我想从php发送plotedband json并在jquery方法中访问,就像我从php访问xAxis和yAxis数据

 **jQuery code**

 $(function () {

     var plotband ='';

        var options = {
            chart: {
                renderTo: 'containerline',
                type: 'line',
                plotShadow: false,
                //marginRight: 130,
                marginBottom: 55
            },
            title: {
                text: 'Portfolio UW vs Current CapEx',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            xAxis: {
                categories: [],
                plotBands: plotband,
                 labels: {
                    rotation: 270

                 },
                },
            yAxis: {
               // title: {
               //     text: 'Amount'
               // }, 
                labels: {
                    format: '{value:,.0f}'

                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                enabled: false,
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            lang: {
                thousandsSep: ','
            },
            series: [],
            exporting: {
                enabled: false
            },
            credits: {
                  enabled: false
            },
        }
        var hidden_portfolio_ids=$('#hidden_portfolio_id').val();
        $.getJSON('<?php echo base_url(); ?>controller/data_linechart/'+hidden_portfolio_ids+'', function(json) {
            options.xAxis.categories = json[0]['data'];
            options.series[0] = json[1];
            options.series[1] = json[2];
            options.plotband= json[3];
            chart = new Highcharts.Chart(options);
        });
});

    **PHP Code**



public function data_linechart($id)
{

    $data = $this->model->get_linechart_data($id);

    $category = array();
    $category['name'] = 'Category';

    $series1 = array();
    $series1['name'] = 'UW';

    $series2 = array();
    $series2['name'] = 'Proj';

    $series3 = array();
    $series3['name'] = 'Today';

    foreach ($data as $row)
    {
        $datepaid = new DateTime($row->pcs_linchartdrawdate); 
        $newdate= $datepaid->format('M-d'); 

        $category['data'][] = $newdate;
        $series1['data'][] = $row->pcs_uw;     
        $series2['data'][] = $row->pcs_projected;
        //$series3['data'][] = $row->pcs_today;

    }
    $plotband= "[{
        color: 'orange',
        from:1,
        to: 1.01
    }]";

    $result = array();
    array_push($result,$category);
    array_push($result,$series1);
    array_push($result,$series2);
    array_push($result,$plotband);

    print json_encode($result, JSON_NUMERIC_CHECK);
}

我的所有数据都是正确的,xAxis和yAx正确绘图,但如何用php绘制绘图带,

1 个答案:

答案 0 :(得分:1)

您的$plodBand是一个字符串而不是JSON。使用类似的东西:

$plotband = array[];

$plotband[0] = array(
        color => 'orange',
        from => 1,
        to= > 1.01
);

然后在图表配置中从JSON中提取该对象。