与LARAVEL一起使用HighCharts

我想使用Highchart for laravel，但我不知道如何使用正确的语法将数据从控制器传递到刀片服务器。实际上，我使用的是静态数据，图形显示正确

statistiche.blade.php

<div class="row">
    <div class="col-md-12">
        <div id="container2" style="height: 400px; min-width: 310px"></div>
    </div>
</div>

<script>
// Create the chart
        Highcharts.stockChart('container2', {

            rangeSelector: {
                selected: 1
            },

            title: {
                text: 'AAPL Stock Price'
            },

            plotOptions: {
                spline: {
                    marker: {
                        enabled: true
                    }
                }
            },

            series: [{
                name: 'Richieste scadute',
                data: [
                    [Date.UTC(1970, 9, 21), 0],
                    [Date.UTC(1970, 10, 4), 0.28],
                    [Date.UTC(1970, 10, 9), 0.25],
                    [Date.UTC(1970, 10, 27), 0.2],
                    [Date.UTC(1970, 11, 2), 0.28]
                ]
            }, {
                name: 'Richieste evase',
                data: [
                    [Date.UTC(1970, 9, 29), 0],
                    [Date.UTC(1970, 10, 9), 0.4],
                    [Date.UTC(1970, 11, 1), 0.25],
                    [Date.UTC(1971, 0, 1), 1.66],
                    [Date.UTC(1971, 0, 10), 1.8]
                ]
            }, {
                name: 'Richieste in attesa',
                data: [
                    [Date.UTC(1970, 10, 25), 0],
                    [Date.UTC(1970, 11, 6), 0.25],
                    [Date.UTC(1970, 11, 20), 1.41],
                    [Date.UTC(1970, 11, 25), 1.64],
                    [Date.UTC(1971, 0, 4), 1.6]
                ]
            }]
        });

//创建图表
Highcharts.stockChart（'container2'{
范围选择器：{
选定：1
},
标题：{
文本：“AAPL股价”
},
打印选项：{
样条曲线：{
标记：{
已启用：true
}
}
},
系列：[{
名称：'Richieste scadute'，
数据：[
[UTC日期（1970年9月21日），0]，
[UTC日期（1970年10月4日），0.28]，
[UTC日期（1970年10月9日），0.25]，
[UTC日期（1970年10月27日），0.2]，
[UTC日期（1970年11月2日），0.28]
]
}, {
名称：“Richieste evase”，
数据：[
[UTC日期（1970年9月29日），0]，
[UTC日期（1970年10月9日），0.4]，
[UTC日期（1970年11月1日），0.25]，
[UTC日期（1971,0,1），1.66]，
[UTC日期（1971,0,10），1.8]
]
}, {
名称：'Richieste in attesa'，
数据：[
[UTC日期（1970年10月25日），0]，
[UTC日期（1970年11月6日），0.25]，
[UTC日期（1970年11月20日），1.41]，
[UTC日期（1970年11月25日），1.64]，
[UTC日期（1971,0,4），1.6]
]
}]
});

我想使用控制器提取数据并将其传递到刀片服务器。

---

一些建议？

嘿，伙计们，使用特殊图书馆：

只需安装和工作：

composer require muhamadrezaar/highcharts

---

有两种方法可以将数据传递到highcharts图形

1） 使用

$.getJSON

获取数据并填写序列

$.getJSON("{{ route('get-json-route') }}", function(chart){
    var hashObj = {};
    var seriesObj = {};

    var graphs = {'dd':'graph dd', 'ld' : 'graph ld title'};

    for(var nam in graphs) {
        seriesObj['visible'] = 1;
        seriesObj['color'] = '#00CC00';
        seriesObj['name'] = chart[nam]['name'] + ' stats';
        seriesObj['data'] = chart[nam]['data'];
        highcharts.addSeries(seriesObj);
    }
    highcharts.redraw();
});

2） 使用

json\u encode

将数据直接传递到刀片模板中：

seriesObj['data'] = {!! json_encode($data) !!};