Question

实际上我想在Ajax成功函数上重绘HighChart Bargraph，其中发送参数需要帮助。

以下是我的代码

页面加载代码（运行完美）

<script>
    var chart = $(function () {
        $('#chart').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: 'Overdue Projects'
            },
            xAxis: {
                categories: <?php print_r(isset($project) ? $project : []); ?>
            },
            yAxis: {
                title: {
                    text: 'Hours'
                }
            },
            series: <?php print_r($series); ?>

        }, function (chart) { // on complete
            if (chart.series.length < 1) { // check series is empty
                console.log('Data Empty');
                chart.renderer.text('No Data Available', 380, 120)
                        .css({
                            color: '#4572A7',
                            fontSize: '16px'
                        })
                        .add();
            }

        });
    });
</script>

关于Ajax成功函数代码（无法更新系列和类别）

<script>
    $("select[name=GraphPro]").on('change', function () {
        var proId = $(this).val();

        $.ajax({
            data: 'proId=' + proId,
            type: "post",
            url: "<?php echo base_url('admin_dashboard/drawBarChart'); ?>",
            dataType: "json",
            success: function (xyz)
            {
                var project = xyz.project;

                chart.series = xyz.series;

                var chart1 = new Highcharts.Chart(chart);

            }
        })
    })
</script>

Answer 1

如果没有看到变量中的数据与项目变量的目标相同，那么确实很难说。

也就是说，要更新图表（阅读：更改），您可以执行以下操作，假设chart是您现有图表的变量;

根据您的评论更新：

<script>
$("select[name=GraphPro]").on('change', function () {
    var proId = $(this).val();

    $.ajax({
        data: 'proId=' + proId,
        type: "post",
        url: "<?php echo base_url('admin_dashboard/drawBarChart'); ?>",
        dataType: "json",
        success:function(xyz) {
            console.log(xyz.project); //Value is ["Chat"] 
            console.log(xyz.series); // Value is [{"name":"Estimated Hours","data":[3]},{"name":"Consumed Hours","data":[12]}] 
            chart.update({ 
                xAxis:{ categories: xyz.project //print as xyz.project instead of above project value 
                }, 
                series: xyz.series // print as xyz.series instead of above series value 
                }); 
            }
    })
})
</script>

更新时的Highchart API ：http://api.highcharts.com/class-reference/Highcharts.Chart#update

点击按钮时使用更新的工作示例：http://jsfiddle.net/ewolden/crhh39v6/

要在图表中添加其他系列，您需要使用addSeries，如下所示：

<script>
$("select[name=GraphPro]").on('change', function () {
    var proId = $(this).val();

    $.ajax({
        data: 'proId=' + proId,
        type: "post",
        url: "<?php echo base_url('admin_dashboard/drawBarChart'); ?>",
        dataType: "json",
        success: function (xyz)
        {
            var project = xyz.project; //don't know what the plan with this variable is
            chart.addSeries(xyz.series);

        }
    })
})
</script>

addChart上的Highchart API ：http://api.highcharts.com/class-reference/Highcharts.Chart#addSeries

在ajax成功函数上重绘高亮度列类型图

1 个答案: