顯示數據庫表laravel中的圖表高位數據

Question

我想在海圖中顯示我的桌子信息。

這是我的表架構：

我想在Highcharts中將EventDateTime顯示為名稱

和X，Y，Z值作為高圖的數據

這是我的代碼：

var chart = Highcharts.chart('row', {

    chart: {
              type: 'column'
           },

           title: {
                text: 'EventDateTime'
           },

           legend: {
                align: 'right',
                verticalAlign: 'middle',
                layout: 'vertical'
            },

            xAxis: {
                categories: ['X', 'Y', 'Z'],
                labels: {
                    x: -10
                }
            },

            yAxis: {
                allowDecimals: false,
                title: {
                    text: 'Values'
                }
            },

            series: [
               @foreach ($chart as $object)
               {
                  name: {!! json_encode($object->EventDateTime) !!},
                  data: [{!! json_encode($object->XValue) !!}, 
                         {!! json_encode($object->YValue) !!}, 
                         {!! json_encode($object->ZValue) !!}
                        ]
               },
               @endforeach
            ],

            responsive: {
                rules: [{
                    condition: {
                        maxWidth: 500
                    },
                    chartOptions: {
                        legend: {
                            align: 'center',
                            verticalAlign: 'bottom',
                            layout: 'horizontal'
                        },
                        yAxis: {
                            labels: {
                                align: 'left',
                                x: 0,
                                y: -5
                            },
                            title: {
                                text: null
                            }
                        },
                        subtitle: {
                            text: null
                        },
                        credits: {
                            enabled: false
                        }
                    }
                }]
            }
        });

控制器代碼：

$chart = DB::table('tbl_graph')->select('*')->get();
        return view('admin.Charts.index',compact('chart'));

名稱正在顯示。

我的問題是我沒有在圖表中填充數據。

做這個的最好方式是什么...？

Answer 1

更改您的highChart腳本，如下所示：

代替x軸保養：

xAxis: {
    //array of date print here
    categories: ['date1', 'date2', 'date3'],
    labels: {x: -10}
},

代替系列：

series: [

           {
              name: {X},
              data: [all x values here comma sepearted]
           },
           {
              name: {Y},
              data: [all y values here comma sepearted]
           },
           {
              name: {Z},
              data: [all z values here comma sepearted]
           },
        ],

您可以從這個小提琴中獲取參考：

https://jsfiddle.net/xwea5a5b/