时间戳

首页 > 解决方案 > laravel-chartjs 不显示任何内容

php - laravel-chartjs 不显示任何内容

问题描述

我正在使用此处找到的包在我的 laravel 项目中使用 chartjs，我按照说明安装它并尝试将示例加载到刀片文件中。问题是，什么都没有显示。下面我附上了示例代码，有没有人有使用这个包的经验并且可以指出我正确的方向？

我按以下顺序安装它的方式是：

composer require fx3costa/laravelchartjs
added Fx3costa\LaravelChartJs\Providers\ChartjsServiceProvider::class to Providers
npm install chart.js --save

示例方法。

private function createchart(){
        $chartjs = app()->chartjs
        ->name('lineChartTest')
        ->type('line')
        ->size(['width' => 400, 'height' => 200])
        ->labels(['January', 'February', 'March', 'April', 'May', 'June', 'July'])
        ->datasets([
            [
                "label" => "My First dataset",
                'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                'borderColor' => "rgba(38, 185, 154, 0.7)",
                "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                "pointHoverBackgroundColor" => "#fff",
                "pointHoverBorderColor" => "rgba(220,220,220,1)",
                'data' => [65, 59, 80, 81, 56, 55, 40],
            ],
            [
                "label" => "My Second dataset",
                'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                'borderColor' => "rgba(38, 185, 154, 0.7)",
                "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                "pointHoverBackgroundColor" => "#fff",
                "pointHoverBorderColor" => "rgba(220,220,220,1)",
                'data' => [12, 33, 44, 44, 55, 23, 40],
            ]
        ])
        ->options([]);


        return $chartjs;

刀片文件：

<div style="width:75%;">
    {!! $chartjs->render() !!}
</div>

标签： phplaravelchart.js

解决方案

问题是该命令npm install chart.js --save仅安装 chartjs libray（在 /node_modules 目录中），您还需要将其与您的项目集成，例如将脚本标记放置在<head>：

<script src="path/to/chartjs/dist/Chart.js"></script>

推荐阅读