拉威尔(Laravel)的高脚车

时间:2020-10-26 21:30:08

标签: laravel highcharts

我试图在Laravel视图中呈现图表,我在控制器中构建了图表,但除非禁用js / app.js,否则它无法正常工作,有人可以告诉我原因吗?

控制器:

$chart1 = \Chart::title([
            'text' => 'Voting',
        ])
        ->chart([
            'type'     => 'line', // pie , columnt ect
            'renderTo' => 'chart1', // render the chart into your div with id
        ])
        ->subtitle([
            'text' => 'This Subtitle',
        ])
        ->colors([
            '#0c2959'
        ])
        ->xaxis([
            'categories' => [
                'data 1',
                'data 2',
                'data 3',
                'data 4',
            ],
            'labels'     => [
                'rotation'  => 15,
                'align'     => 'top',
                'formatter' => 'startJs:function(){return this.value + " (Player)"}:endJs', 
                // use 'startJs:yourjavasscripthere:endJs'
            ],
        ])
        ->yaxis([
            'text' => 'This Y Axis',
        ])
        ->legend([
            'layout'        => 'vertikal',
            'align'         => 'right',
            'verticalAlign' => 'middle',
        ])
        ->series(
            [
                [
                    'name'  => 'Voting',
                    'data'  => [43934, 52503, 57177, 69658],
                    // 'color' => '#0c2959',
                ],
            ]
        )
        ->display();
    
        return view('devices.show', compact('readings', 'chart1'));

Laravel视图:

        <div id="chart1"></div>
                
            </div>
        </div>
    </div>
    {!! $chart1 !!}
</body>
</html>

{!! $ chart1 !!}在id = app div之外

1 个答案:

答案 0 :(得分:0)

问题是我用 VUE.js 安装了 Laravel,而 VUE 正在创建 div <div id="app">,你不能在那个 DIV 中运行任何 JavaScript,我禁用了 VUE.js 并且图表工作了