通过
搜索
搜索scopdrag / laravel-google-chart
此包已被废弃且不再维护。未建议替代包。
使laravel集成Google图表变得简单且容易
v1.0.3
2016-09-08 17:35 UTC
Requires
- php: ~5.3|~7.0
- illuminate/support: ~5.0
Requires (Dev)
- phpunit/phpunit: ~4.0||~5.0
- scrutinizer/ocular: ~1.1
- squizlabs/php_codesniffer: ~2.7
This package is not auto-updated.
Last update: 2022-08-19 14:50:14 UTC
README
此包提供将Google图表与laravel简单且容易集成的功能。
特性
- 快速且简单。您还可以通过创建多维数组来提供Google图表选项，这些选项已在Google Chart API中进行了文档化。
- 可以在同一页面上加载相同类型和不同类型的多个图表。
致谢：感谢Google Chart API
图表引入
- 条形图
- 气泡图
- 蜡烛图
- 组合图
- 饼图
- 散点图
- 步进区域图
- 树形图
- 词树图
安装
通过Composer
$ composer require scopdrag/laravel-google-chart
使用此命令发布图表视图。
$ php artisan vendor:publish
注册提供者
将以下行添加到您的config/app.php的providers数组中
Scopdrag\LaravelGoogleChart\LaravelGoogleChartServiceProvider::class,
使用方法
在控制器文件中使用此代码，并将cols、rows和options传递给视图
在网页的标签中添加Google图表加载脚本文件
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
$options = [ 'title' => 'Population of Largest U.S. Cities', 'chartArea' => ['width' => '50%'], 'hAxis' => [ 'title' => 'Total Population', 'minValue' => 0 ], 'vAxis' => [ 'title' => 'City' ], 'bars' => 'horizontal', //required if using material chart 'axes' => [ 'y' => [0 => ['side' => 'right']] ] ]; $cols = ['City', '2010 Population', '2000 PopulaÎtions']; $rows = [ ['New York City, NY', 8175000, 8008000], ['Los Angeles, CA', 3792000, 3694000], ['Chicago, IL', 2695000, 2896000], ['Houston, TX', 2099000, 1953000], ['Philadelphia, PA', 1526000, 1517000] ];
在您的Views/balade文件中使用此代码
{!!ChartManager::setChartType('bar-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
或者您可以直接在视图文件中使用
在您的views/blade文件中使用此代码
$options = [ 'title' => 'Population of Largest U.S. Cities', 'chartArea' => ['width' => '50%'], 'hAxis' => [ 'title' => 'Total Population', 'minValue' => 0 ], 'vAxis' => [ 'title' => 'City' ], 'bars' => 'horizontal', //required if using material chart 'axes' => [ 'y' => [0 => ['side' => 'right']] ] ]; $cols = ['City', '2010 Population', '2000 PopulaÎtions']; $rows = [ ['New York City, NY', 8175000, 8008000], ['Los Angeles, CA', 3792000, 3694000], ['Chicago, IL', 2695000, 2896000], ['Houston, TX', 2099000, 1953000], ['Philadelphia, PA', 1526000, 1517000] ]; echo ChartManager::setChartType('bar-chart') ->setOptions($options) ->setCols($cols) ->setRows($rows) ->render();
条形图
$options = [
'title' => 'Population of Largest U.S. Cities',
'chartArea' => ['width' => '50%'],
'hAxis' => [
'title' => 'Total Population',
'minValue' => 0
],
'vAxis' => [
'title' => 'City'
],
'bars' => 'horizontal', //required if using material chart
'axes' => [
'y' => [0 => ['side' => 'right']]
]
];
$cols = ['City', '2010 Population', '2000 PopulaÎtions'];
$rows = [
['New York City, NY', 8175000, 8008000],
['Los Angeles, CA', 3792000, 3694000],
['Chicago, IL', 2695000, 2896000],
['Houston, TX', 2099000, 1953000],
['Philadelphia, PA', 1526000, 1517000]
];
blade.php文件代码
{!!ChartManager::setChartType('bar-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
彩色条形图
$options = [ 'title' => 'Population of Largest U.S. Cities', 'chartArea' => ['width' => '50%'], 'hAxis' => [ 'title' => 'Total Population', 'minValue' => 0 ], 'vAxis' => [ 'title' => 'City' ], 'bars' => 'horizontal', //required if using material chart 'axes' => [ 'y' => [0 => ['side' => 'right']] ] ]; $cols = ['City', '2010 Population', '2000 PopulaÎtions', ['role' => 'style']]; $rows = [ ['New York City, NY', 8175000, 8008000, '#b87333'], ['Los Angeles, CA', 3792000, 3694000, 'silver'], ['Chicago, IL', 2695000, 2896000, 'gold'], ['Houston, TX', 2099000, 1953000, 'color: #e5e4e2'], ['Philadelphia, PA', 1526000, 1517000, 'color: #e5e4e2'] ];
.blade.php文件代码
{!!ChartManager::setChartType('bar-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
堆叠条形图
$options = [ 'width' => 800, 'height' => 400, 'legend' => ['position' => 'top', 'maxLines' => 3], 'bars' => ['groupWidth' => '75%'], 'isStacked' => TRUE ]; $cols = ['Date', 'Fantasy & Sci Fi', 'Romance', 'Mystery/Crime', 'General', 'Western', 'Literature', ['role' => 'annotation']]; $rows = [ ['2010', 10, 24, 20, 32, 18, 5, ''], ['2020', 16, 22, 23, 30, 16, 9, ''], ['2030', 28, 19, 29, 30, 12, 13, ''] ];
.blade.php代码
{!!ChartManager::setChartType('bar-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
##气泡图
$cols = ['ID', 'Life Expectancy', 'Fertility Rate', 'Region', 'Population']; $rows = [ ['CAN', 80.66, 1.67, 'North America', 33739900], ['DEU', 79.84, 1.36, 'Europe', 81902307], ['DNK', 78.6, 1.84, 'Europe', 5523095], ['EGY', 72.73, 2.78, 'Middle East', 79716203], ['GBR', 80.05, 2.00, 'Europe', 61801570], ['IRN', 72.49, 1.7, 'Middle East', 73137148], ['IRQ', 68.09, 4.77, 'Middle East', 31090763], ['ISR', 81.55, 2.96, 'Middle East', 7485600], ['RUS', 68.6, 1.54, 'Europe', 141850000], ['USA', 78.09, 2.05, 'North America', 307007000] ]; $options = [ 'title' => 'Correlation between life expectancy, fertility rate and population of some world countries (2010)', 'hAxis' => [ 'title' => 'Life Expectancy', ], 'vAxis' => [ 'title' => 'Fertility Rate' ], 'bubble' => 'horizontal', //required if using material chart 'bubble' => [ 'textStyle' => ['fontSize' => 11] ] ];
.blade.php文件代码
{!!ChartManager::setChartType('bubble-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
蜡烛图
$rows = [ ['Mon', 20, 28, 38, 45], ['Tue', 31, 38, 55, 66], ['Wed', 50, 55, 77, 80], ['Thu', 77, 77, 66, 50], ['Fri', 68, 66, 22, 15] ]; $options = [ 'legend' => 'none' ]; $cols =[];
.blade.php文件代码
{!!ChartManager::setChartType('candlestick-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
瀑布图
$rows = [ ['Mon', 20, 28, 38, 45], ['Tue', 31, 38, 55, 66], ['Wed', 50, 55, 77, 80], ['Thu', 77, 77, 66, 50], ['Fri', 68, 66, 22, 15] ]; $options = [ 'legend' => 'none', 'bar' => [ 'groupWidth' => '100%', // Draw a trendline for data series 0. ], 'candlestick' => [ 'fallingColor' => ['strokeWidth' => 0, 'fill' => '#a52714'], 'risingColor' => ['strokeWidth' => 0, 'fill' => '#0f9d58'], ] ]; $cols=[];
.blade.php代码
{!!ChartManager::setChartType('candlestick-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
组合图
$cols = ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average']; $rows = [ ['2004/05', 165, 938, 522, 998, 450, 614.6], ['2005/06', 135, 1120, 599, 1268, 288, 682], ['2006/07', 157, 1167, 587, 807, 397, 623], ['2007/08', 139, 1110, 615, 968, 215, 609.4], ['2008/09', 136, 691, 629, 1026, 366, 569.6] ]; $options = [ 'title' => 'Monthly Coffee Production by Country', 'hAxis' => [ 'title' => 'Cups', ], 'vAxis' => [ 'title' => 'Month' ], 'seriesType' => 'bars', //required if using material chart 'series' => [ '5' => ['type' => 'line'] ] ];
.blade.php文件代码
{!!ChartManager::setChartType('combo-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
饼图
$cols = ['Major', 'Degrees']; $rows = [ ['Business', 256070], ['Education', 108034], ['Social Sciences & History', 127101], ['Health', 81863], ['Psychology', 74194] ]; $options = [ 'pieSliceText' => 'none', ]; $cols =[];
.blade.php文件代码
{!!ChartManager::setChartType('piechart-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
3D饼图
$cols = ['Major', 'Degrees']; $rows = [ ['Business', 256070], ['Education', 108034], ['Social Sciences & History', 127101], ['Health', 81863], ['Psychology', 74194] ]; $options = [ 'pieSliceText' => 'none', 'title' => 'My Daily Activities', 'is3D' => true, ];
.blade.php文件代码
{!!ChartManager::setChartType('piechart-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
散点图
$cols = ['Age', 'Weight']; $rows = [ [ 8, 12], [ 4, 5.5], [ 11, 14], [ 4, 5], [ 3, 3.5], [ 6.5, 7] ]; $options = [ 'title' => 'Age vs. Weight comparison', 'hAxis' => [ 'title' => 'Age', 'minValue' => 0, 'maxValue' => 15 ], 'vAxis' => [ 'title' => 'Weight', 'minValue' => 0, 'maxValue' => 15 ], 'legend' => 'none', ];
.blade.php文件代码
{!!ChartManager::setChartType('scatter-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
步进图
$cols = ['Director (Year)', 'Rotten Tomatoes', 'IMDB']; $rows = [ ['Alfred Hitchcock (1935)', 8.4, 7.9], ['Ralph Thomas (1959)', 6.9, 6.5], ['Don Sharp (1978)', 6.5, 6.4], ['James Hawes (2008)', 4.4, 6.2] ]; $options = [ 'title' => 'The decline of \'The 39 Steps\'', 'hAxis' => [ 'title' => 'Accumulated Rating', ], 'isStacked' => 'true', ];
.blade.php文件代码
{!!ChartManager::setChartType('steppedarea-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
树形图
$cols = ['Location', 'Parent', 'Market trade volume (size)', 'Market increase/decrease (color)']; $rows = [ ['Global', null, 0, 0], ['America', 'Global', 0, 0], ['Europe', 'Global', 0, 0], ['Asia', 'Global', 0, 0], ['Australia', 'Global', 0, 0], ['Africa', 'Global', 0, 0], ['Brazil', 'America', 11, 10], ['USA', 'America', 52, 31], ['Mexico', 'America', 24, 12], ['Canada', 'America', 16, -23], ['France', 'Europe', 42, -11], ['Germany', 'Europe', 31, -2], ['Sweden', 'Europe', 22, -13], ['Italy', 'Europe', 17, 4], ['UK', 'Europe', 21, -5], ['China', 'Asia', 36, 4], ['Japan', 'Asia', 20, -12], ['India', 'Asia', 40, 63], ['Laos', 'Asia', 4, 34], ['Mongolia', 'Asia', 1, -5], ['Israel', 'Asia', 12, 24], ['Iran', 'Asia', 18, 13], ['Pakistan', 'Asia', 11, -52], ['Egypt', 'Africa', 21, 0], ['S. Africa', 'Africa', 30, 43], ['Sudan', 'Africa', 12, 2], ['Congo', 'Africa', 10, 12], ['Zaire', 'Africa', 8, 10] ]; $options = [ 'minColor' => '#f00', 'midColor' => '#ddd', 'maxColor' => '#0d0', 'headerHeight' => 15, 'fontColor' => 'black', 'showScale' => TRUE ];
.blade.php
{!!ChartManager::setChartType('treemap-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
散点图
$cols = ['Diameter', 'Age']; $rows = [ [8, 37], [4, 19.5], [11, 52], [4, 22], [3, 16.5], [6.5, 32.8], [ 14, 72] ]; $options = [ 'title' => 'Age of sugar maples vs. trunk diameter, in inches', 'hAxis' => [ 'title' => 'Diameter', ], 'vAxis' => [ 'title' => 'Age', ], 'legend' => 'none', 'trendlines' => [ 0 => [], // Draw a trendline for data series 0. ], ];
.blade.php文件代码
{!!ChartManager::setChartType('scatter-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
词树图
$cols = ['Phrases']; $rows = [ ['cats are better than dogs'], ['cats eat kibble'], ['cats are better than hamsters'], ['cats are awesome'], ['cats are people too'], ['cats eat mice'], ['cats meowing'], ['cats in the cradle'], ['cats eat mice'], ['cats in the cradle lyrics'], ['cats eat kibble'], ['cats for adoption'], ['cats are family'], ['cats eat mice'], ['cats are better than kittens'], ['cats are evil'], ['cats are weird'], ['cats eat mice'], ]; $options = [ 'wordtree' => ['format' => 'implicit', 'word' => 'cats'] ];
.blade.php文件代码
{!!ChartManager::setChartType('wordtree-chart')
->setOptions($options)
->setCols($cols)
->setRows($rows)
->render()!!}
根据需求，'setChartType()'的参数可以是以下之一。
- 'bar-chart'
- 'bubble-chart'
- 'candlestick-chart'
- 'combo-chart'
- 'piechart-chart'
- 'scatter-chart'
- 'steppedarea-chart'
- 'treemap-chart'
- 'wordtree-chart'
变更日志
请参阅CHANGELOG了解最近发生的变更。
测试
$ ./vendor/bin/phpunit
致谢
- 感谢Google Chart API
许可证
MIT许可证（MIT）。请参阅许可证文件获取更多信息。