Laravel框架中使用Larapex Chart图表
Laravel  /  管理员 发布于 1星期前   156
什么是 Larapex Chart?
Larapex Chart是一个漂亮图表的库。它是Apex图表库的laravel包装器。Larapex 图表允许您使用 php 生成图表编写。
安装Larapex Chart
composer require arielmejiadev/larapex-charts
然后使用此命令发布配置文件
php artisan vendor:publish --tag=larapex-charts-config
至此,你就可以开始使用Larapex Chart了
创建Larapex Chart图表步骤
要创建图表,请使用以下命令:
php artisan make:chart MonthlyUsersChart
然后选择图表类型:
- [x] Pie Chart
- [ ] Donut Chart
- [ ] Radial Bar Chart
- [ ] Polar Area Chart
- [ ] Line Chart
- [ ] Area Chart
- [ ] Bar Chart
- [ ] Horizontal Bar Chart
- [ ] HeatMap Chart
- [ ] Radar Chart
现在您有了一个包含图表的新文件
app/Charts/MonthlyUsersChart.php
<?php
namespace App\Charts;
use ArielMejiaDev\LarapexCharts\LarapexChart;
class MonthlyUsersChart
{
protected $chart;
public function __construct(LarapexChart $chart)
{
$this->chart = $chart;
}
public function build()
{
return $this->chart->pieChart()
->setTitle('Top 3 scorers of the team.')
->setSubtitle('Season 2021.')
->addData([40, 50, 30])
->setLabels(['Player 7', 'Player 10', 'Player 9']);
}
}
现在在您的控制器中注入图表对象:
public function index(MonthlyUsersChart $chart)
{
return view('users.index', ['chart' => $chart->build()]);
}
并在视图中完成add $chart->container()和方法以呈现图表
$chart->cdn()
$chart->script()
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Chart Sample</title>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="h-screen bg-gray-100">
<div class="container px-4 mx-auto">
<div class="p-6 m-20 bg-white rounded shadow">
{!! $chart->container() !!}
</div>
</div>
<script src="{{ $chart->cdn() }}"></script>
{{ $chart->script() }}
</body>
</html>
larapex-charts官方手册:
https://larapex-charts.netlify.app/
nkt 在
阿里云香港服务器搭建自用vpn:Shadowsocks使用流程步骤中评论 用了三分钟就被禁了,直接阿里云服务器22端口都禁了..熊丽 在
安装docker + locust + boomer压测环境实现对接口的压测中评论 试试水..博主 在
阿里云香港服务器搭建自用vpn:Shadowsocks使用流程步骤中评论 @test 也可能是国内大环境所至,也是好事,督促你该研究学习新技术..test 在
阿里云香港服务器搭建自用vpn:Shadowsocks使用流程步骤中评论 打了一次网页,然后再也打不开了。。是阿里云的缘故吗?..博主 在
centos7中Meili Search搜索引擎安装流程步骤中评论 @鹿 执行以下命令看看你的2.27版本是否存在strin..
Copyright·© 2019 侯体宗版权所有·
粤ICP备20027696号