New Controllers added. Added Charts

This commit is contained in:
2017-09-19 22:01:00 +02:00
parent ccc5b07ddf
commit 930311b550
400 changed files with 30686 additions and 8 deletions

View File

@@ -0,0 +1,19 @@
; This file is for unifying the coding style for different editors and IDEs.
; More information at http://editorconfig.org
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
indent_style = space
indent_size = 4
trim_trailing_whitespace = true
[*.md]
trim_trailing_whitespace = false
[*.yml]
indent_style = space
indent_size = 2

View File

@@ -0,0 +1,17 @@
# Auto detect text files and perform LF normalization
* text=auto
# Custom for Visual Studio
*.cs diff=csharp
# Standard to msysgit
*.doc diff=astextplain
*.DOC diff=astextplain
*.docx diff=astextplain
*.DOCX diff=astextplain
*.dot diff=astextplain
*.DOT diff=astextplain
*.pdf diff=astextplain
*.PDF diff=astextplain
*.rtf diff=astextplain
*.RTF diff=astextplain

View File

@@ -0,0 +1,3 @@
preset: laravel
linting: true

View File

@@ -0,0 +1,46 @@
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment include:
* Using welcoming and inclusive language
* Being respectful of differing viewpoints and experiences
* Gracefully accepting constructive criticism
* Focusing on what is best for the community
* Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
* The use of sexualized language or imagery and unwelcome sexual attention or advances
* Trolling, insulting/derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or electronic address, without explicit permission
* Other conduct which could reasonably be considered inappropriate in a professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at soc@erik.cat. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
[homepage]: http://contributor-covenant.org
[version]: http://contributor-covenant.org/version/1/4/

View File

@@ -0,0 +1,11 @@
## Issue description
Describe your issue here
## How to reproduce it
Tell us how to reproduce the issue so we can fix it
## Libraries & types involved
Tell us the libraries and types involved in the issue

View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2016 Erik Campobadal
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View File

@@ -0,0 +1,73 @@
<p align="center"><a href="https://erik.cat/projects/Charts"><img height="250" src="http://i.imgur.com/zylVNhI.png"></a></p>
<p align="center">
<a href="https://styleci.io/repos/69124179"><img src="https://styleci.io/repos/69124179/shield?branch=master&style=flat" alt="StyleCI Status"></a>
<a href="https://styleci.io/repos/69124179"><img src="https://img.shields.io/badge/Built_for-Laravel-orange.svg" alt="Build For Laravel"></a>
<a href="https://packagist.org/packages/consoletvs/charts"><img src="https://poser.pugx.org/consoletvs/charts/d/total.svg" alt="Total Downloads"></a>
<a href="https://packagist.org/packages/consoletvs/charts"><img src="https://poser.pugx.org/consoletvs/charts/v/stable.svg" alt="Latest Stable Version"></a>
<a href="https://packagist.org/packages/consoletvs/charts"><img src="https://poser.pugx.org/consoletvs/charts/license.svg" alt="License"></a>
</p>
## What is Charts?
Charts is a multi-library chart package to create interactive charts using laravel. It Gives you access to
tons of different charts. Over +100 different charts and +13 different chart libraries to choose from. With this package
you can forget writing all the javascript manually and focus on your laravel project, while keeping an insane customizable chart coded in PHP. And last but not least, we support different types of charts, mathematical charts, multi-charts, they can even be
created using your eloquent models! And hey... We do support realtime stuff as well ;)
## Sample Chart
This chart is a multi bar chart using the material library.
![Charts Logo](https://i.gyazo.com/2f50ac060f699cc323741403174cec66.png)
```php
$chart = Charts::multi('bar', 'material')
// Setup the chart settings
->title("My Cool Chart")
// A dimension of 0 means it will take 100% of the space
->dimensions(0, 400) // Width x Height
// This defines a preset of colors already done:)
->template("material")
// You could always set them manually
// ->colors(['#2196F3', '#F44336', '#FFC107'])
// Setup the diferent datasets (this is a multi chart)
->dataset('Element 1', [5,20,100])
->dataset('Element 2', [15,30,80])
->dataset('Element 3', [25,10,40])
// Setup what the values mean
->labels(['One', 'Two', 'Three']);
```
## Documentation
<p align="center">
<a href="https://erik.cat/projects/Charts/docs"><img src="http://i.imgur.com/47WnADd.png"></a>
</p>
## License
```
MIT License
Copyright (c) 2016 Erik Campobadal
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
```

View File

@@ -0,0 +1,33 @@
{
"name": "consoletvs/charts",
"description": "Create charts for laravel using diferent charts libraries",
"license": "MIT",
"authors": [
{
"name": "Erik Campobadal",
"email": "soc@erik.cat"
}
],
"require": {
"php": ">=5.6.4",
"illuminate/support": "5.*",
"jlawrence/eos": "3.*",
"jenssegers/date": "v3.*"
},
"autoload": {
"psr-4": {
"ConsoleTVs\\Charts\\": "src/"
}
},
"extra": {
"laravel": {
"providers": [
"ConsoleTVs\\Charts\\ChartsServiceProvider"
],
"aliases": {
"Charts": "ConsoleTVs\\Charts\\Facades\\Charts"
}
}
},
"minimum-stability": "dev"
}

View File

@@ -0,0 +1,191 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Default settings for charts.
|--------------------------------------------------------------------------
*/
'default' => [
'type' => 'line', // The default chart type.
'library' => 'material', // The default chart library.
'element_label' => 'Element', // The default chart element label.
'empty_dataset_label' => 'No Data Set',
'empty_dataset_value' => 0,
'title' => 'My Cool Chart', // Default chart title.
'height' => 400, // 0 Means it will take 100% of the division height.
'width' => 0, // 0 Means it will take 100% of the division width.
'responsive' => false, // Not recommended since all libraries have diferent sizes.
'background_color' => 'inherit', // The chart division background color.
'colors' => [], // Default chart colors if using no template is set.
'one_color' => false, // Only use the first color in all values.
'template' => 'material', // The default chart color template.
'legend' => true, // Whether to enable the chart legend (where applicable).
'x_axis_title' => false, // The title of the x-axis
'y_axis_title' => null, // The title of the y-axis (When set to null will use element_label value).
'loader' => [
'active' => true, // Determines the if loader is active by default.
'duration' => 500, // In milliseconds.
'color' => '#000000', // Determines the default loader color.
],
],
/*
|--------------------------------------------------------------------------
| All the color templates available for the charts.
|--------------------------------------------------------------------------
*/
'templates' => [
'material' => [
'#2196F3', '#F44336', '#FFC107',
],
'red-material' => [
'#B71C1C', '#F44336', '#E57373',
],
'indigo-material' => [
'#1A237E', '#3F51B5', '#7986CB',
],
'blue-material' => [
'#0D47A1', '#2196F3', '#64B5F6',
],
'teal-material' => [
'#004D40', '#009688', '#4DB6AC',
],
'green-material' => [
'#1B5E20', '#4CAF50', '#81C784',
],
'yellow-material' => [
'#F57F17', '#FFEB3B', '#FFF176',
],
'orange-material' => [
'#E65100', '#FF9800', '#FFB74D',
],
],
/*
|--------------------------------------------------------------------------
| Assets required by the libraries.
|--------------------------------------------------------------------------
*/
'assets' => [
'global' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js',
],
],
'canvas-gauges' => [
'scripts' => [
'https://cdn.rawgit.com/Mikhus/canvas-gauges/gh-pages/download/2.1.2/all/gauge.min.js',
],
],
'chartist' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/chartist/0.10.1/chartist.min.js',
],
'styles' => [
'https://cdnjs.cloudflare.com/ajax/libs/chartist/0.10.1/chartist.min.css',
],
],
'chartjs' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js',
],
],
'fusioncharts' => [
'scripts' => [
'https://static.fusioncharts.com/code/latest/fusioncharts.js',
'https://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js',
],
],
'google' => [
'scripts' => [
'https://www.google.com/jsapi',
'https://www.gstatic.com/charts/loader.js',
"google.charts.load('current', {'packages':['corechart', 'gauge', 'geochart', 'bar', 'line']})",
],
],
'highcharts' => [
'styles' => [
// The following CSS is not added due to color compatibility errors.
// 'https://cdnjs.cloudflare.com/ajax/libs/highcharts/5.0.7/css/highcharts.css',
],
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/highcharts/5.0.7/highcharts.js',
'https://cdnjs.cloudflare.com/ajax/libs/highcharts/5.0.7/js/modules/offline-exporting.js',
'https://cdnjs.cloudflare.com/ajax/libs/highmaps/5.0.7/js/modules/map.js',
'https://cdnjs.cloudflare.com/ajax/libs/highmaps/5.0.7/js/modules/data.js',
'https://code.highcharts.com/mapdata/custom/world.js',
],
],
'justgage' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.6/raphael.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/justgage/1.2.2/justgage.min.js',
],
],
'morris' => [
'styles' => [
'https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css',
],
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.6/raphael.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js',
],
],
'plottablejs' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/plottable.js/2.8.0/plottable.min.js',
],
'styles' => [
'https://cdnjs.cloudflare.com/ajax/libs/plottable.js/2.2.0/plottable.css',
],
],
'progressbarjs' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/progressbar.js/1.0.1/progressbar.min.js',
],
],
'c3' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.11/c3.min.js',
],
'styles' => [
'https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.11/c3.min.css',
],
],
'echarts' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/echarts/3.6.2/echarts.min.js',
],
],
'amcharts' => [
'scripts' => [
'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.2/amcharts.js',
'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.2/serial.js',
'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.2/plugins/export/export.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.2/themes/light.js',
],
'styles' => [
'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.2/plugins/export/export.css',
],
],
],
];

View File

@@ -0,0 +1,932 @@
# Charts 2.0.2 Docs
### Charts is a multi-library chart package to create interactive charts using laravel.
[![StyleCI](https://styleci.io/repos/69124179/shield?branch=master)](https://styleci.io/repos/69124179)
![StyleCI](https://img.shields.io/badge/Built_for-Laravel-green.svg?style=flat-square)
![StyleCI](https://img.shields.io/github/license/consoletvs/charts.svg?style=flat-square)
![Charts Logo](http://i.imgur.com/zylVNhI.png)
## Important Notice
Yes, charts 3.0 is comming this week, I'm currently fixing TONS of bugs that appeared upon the recent pull requests done. While I
fix all this stuff, please avoid creating new pull requests as they will be mostly closed. Please take into consideration we're trying
to make it as stable as posible, so this might take some time for us to try all the charts.
## Table Of Contents
- [Installation](#installation)
- [Video Tutorial](#video-tutorial)
- [Default Settings](#default-settings)
- [Example Usage](#example-usage)
- [Create Charts](#create-charts)
- [Multi Datasets Chart](#multi-datasets-charts)
- [Database Charts](#database-charts)
- [Realtime Charts](#realtime-charts)
- [Math Functions Charts](#math-functions-charts)
- [Charts Functions](#charts-functions)
- [Available Chart Settings](#available-chart-settings)
- [Chart Examples](#chart-examples)
- [Extend your way](#extend-your-way)
## Installation
### Video Tutorial
[![Video Tutorial](https://img.youtube.com/vi/KrAvrU2XYuY/0.jpg)](https://www.youtube.com/watch?v=KrAvrU2XYuY)
To install charts use composer
### Download
```
composer require consoletvs/charts
```
### Add service provider & alias
Add the following service provider to the array in: ```config/app.php```
```php
ConsoleTVs\Charts\ChartsServiceProvider::class,
```
Add the following alias to the array in: ```config/app.php```
```php
'Charts' => ConsoleTVs\Charts\Charts::class,
```
### Publish the assets
```
php artisan vendor:publish --tag=charts_config
php artisan vendor:publish --tag=charts_assets --force
```
## Default Settings
The file in: ```config/charts.php``` contains an array of settings, you can find the default settings in there.
## Example Usage
Example Controller:
```php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use Charts;
class TestController extends Controller
{
public function index()
{
$chart = Charts::create('line', 'highcharts')
->setView('custom.line.chart.view') // Use this if you want to use your own template
->setTitle('My nice chart')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
return view('test', ['chart' => $chart]);
}
}
```
Example View:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>My Charts</title>
{!! Charts::assets() !!}
</head>
<body>
<center>
{!! $chart->render() !!}
</center>
</body>
</html>
```
## Create Charts
| Create Charts | line | area | bar | pie | donut | geo | gauge | temp | percentage | progressbar |
|---------------|------|------|-----|-----|-------|-----|-------|------|------------|-------------|
| chartjs | x | x | x | x | x | - | - | - | - | - |
| highcharts | x | x | x | x | x | x | - | - | - | - |
| google | x | x | x | x | x | x | x | - | - | - |
| material | x | - | x | - | - | - | - | - | - | - |
| chartist | x | x | x | x | x | - | - | - | - | - |
| fusioncharts | x | x | x | x | x | - | - | - | - | - |
| morris | x | x | x | - | x | - | - | - | - | - |
| plottablejs | x | x | x | x | x | - | - | - | - | - |
| minimalist | x | x | x | x | x | - | - | - | - | - |
| canvas-gauges | - | - | - | - | - | - | x | x | - | - |
| justgage | - | - | - | - | - | - | x | - | x | - |
| progressbarjs | - | - | - | - | - | - | - | - | x | x |
The first argument of the create method is the chart type, and the second is the library
```php
Charts::create('line', 'highcharts')
->setTitle('My nice chart')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
## Multi Datasets Charts
| Multi Dataset Charts | line | area | bar | pie | donut | geo | gauge | temp | percentage | progressbar |
|----------------------|------|------|-----|-----|-------|-----|-------|------|------------|-------------|
| chartjs | x | x | x | - | - | - | - | - | - | - |
| highcharts | x | x | x | - | - | - | - | - | - | - |
| google | x | x | x | - | - | - | - | - | - | - |
| material | x | - | x | - | - | - | - | - | - | - |
| chartist | x | x | x | - | - | - | - | - | - | - |
| fusioncharts | x | x | x | - | - | - | - | - | - | - |
| morris | x | x | x | - | - | - | - | - | - | - |
| plottablejs | x | x | x | - | - | - | - | - | - | - |
| minimalist | x | x | x | - | - | - | - | - | - | - |
| canvas-gauges | - | - | - | - | - | - | - | - | - | - |
| justgage | - | - | - | - | - | - | - | - | - | - |
| progressbarjs | - | - | - | - | - | - | - | - | - | - |
To create multi-dataset charts simply add the values using the ```setDataset()``` function!
```php
Charts::multi('line', 'highcharts')
->setColors(['#ff0000', '#00ff00', '#0000ff'])
->setLabels(['One', 'Two', 'Three'])
->setDataset('Test 1', [1,2,3])
->setDataset('Test 2', [0,6,0])
->setDataset('Test 3', [3,4,1]);
```
- setDataset(required string $element_label, required array $values)
```php
Charts::multi('bar', 'minimalist')
->setResponsive(false)
->setDimensions(0, 500)
->setColors(['#ff0000', '#00ff00', '#0000ff'])
->setLabels(['One', 'Two', 'Three'])
->setDataset('Test 1', [1,2,3])
->setDataset('Test 2', [0,6,0])
->setDataset('Test 3', [3,4,1]);
```
## Database Charts
You can also generate database charts with simple setup!
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts');
```
Example data:
![Example Data](https://i.gyazo.com/e41f0117845230edc5189cd7b5821933.png)
**Note:** You are required to use a specific group method before rendering the chart!
*Important:* To work with the *GroupByYear, GroupByMonth, GroupByDay, lastByYear, lastByMonth & lastByDay* you'll need the column ```created_at``` in the data rows.
The available methods are:
- setData(required mixed $data)
Setup the data again.
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')->setData(Role::all());
```
- setDateColumn(required string $column)
Set the column to group the data.
*Default:* ```created_at```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')->setDateColumn('my_date_column');
```
- setDateFormat(required string $format)
Set the fancy date format for `groupByDay()` and `lastByDay()` function if `$fancy` set to true, must be called before those function.
*Default:* ```l dS M, Y```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')->setDateFormat('j F y');
```
- setMonthFormat(required string $format)
Set the fancy date format for `groupByMonth()` and `lastByMonth()` function if `$fancy` set to true, must be called before those function.
*Default:* ```F, Y```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')->setDateFormat('F Y');
```
- groupBy(required string $column)
Groups the data based on a column.
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupBy('game');
```
![Example GroupBy](https://i.gyazo.com/30183fa75f6bee6848898c4dbe487491.png)
- groupByYear(optional int $years)
Groups the data based in years.
*Default:* ```$years = 4```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByYear();
// to display a number of years behind, pass a int parameter. For example to display the last 10 years:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByYear(10);
```
![Example GroupByYear](https://i.gyazo.com/5d992b6ce858fee8ed455c61e3bec546.png)
- groupByMonth(optional string $year, optional boolean $fancy)
Groups the data in months (if no year set, the current one will be used).
*Default:* ```$year = 7, $fancy = false```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByMonth();
// to display a specific year, pass the parameter. For example to display the months of 2016 and display a fancy output label:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByMonth('2016', true);
```
![Example GroupByYear](https://i.gyazo.com/8d93b2f74857047339317d54b5082868.png)
- groupByDay(optional string $month, optional string $year, optional boolean $fancy)
Groups the data in days (if no year/month set, the current one will be used).
*Default:* ```$month = date('m'), $year = date('Y'), $fancy = false```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByDay();
// to display a specific month and/or year, pass the parameters. For example to display the days of september 2016 and display a fancy output label:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->groupByDay('09', '2016', true);
```
![Example GroupByYear](https://i.gyazo.com/b461f29f41a0a5ac046f1cea79083dcc.png)
- lastByYear(optional int $number)
Alias for groupByYear() method. Does the same.
*Default:* ```$number = 4```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByYear();
// to display a number of years behind, pass a int parameter. For example to display the last 3 years:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByYear(3);
```
![Example LastByYear](https://i.gyazo.com/7f85bec0fb49f5729608aa87b8657fc1.png)
- lastByMonth(optional int $number, optional boolean $fancy)
Display the numbers of months behind (relative to the current date).
*Default:* ```$number = 6, $fancy = false```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByMonth();
// to display a number of months behind, pass a int parameter. For example to display the last 6 months and use a fancy output:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByMonth(6, true);
```
![Example LastByMonth](https://i.gyazo.com/7c7df6503749fda8d96807d6bc2861aa.png)
- lastByDay(optional int $number, optional boolean $fancy)
Display the numbers of days behind (relative to the current date).
*Default:* ```$number = 7, $fancy = false```
```php
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByDay();
// to display a number of days behind, pass a int parameter. For example to display the last 14 days and use a fancy output:
$chart = Charts::database(User::all(), 'bar', 'highcharts')
->setElementLabel("Total")
->setDimensions(1000, 500)
->setResponsive(false)
->lastByDay(14, true);
```
![Example LastByDay](https://i.gyazo.com/eeac8c7551ed681ef3728454ba4be9f0.png)
## Realtime Charts
![Realtime Chart Example](https://i.gyazo.com/77a9365e9270cb16a28c6acf11abadc3.gif)
| Realtime Charts | line | area | bar | pie | donut | geo | gauge | temp | percentage | progressbar |
|-----------------|------|------|-----|-----|-------|-----|-------|------|------------|-------------|
| chartjs | - | - | - | - | - | - | - | - | - | - |
| highcharts | x | x | x | - | - | - | - | - | - | - |
| google | - | - | - | - | - | - | x | - | - | - |
| material | - | - | - | - | - | - | - | - | - | - |
| chartist | - | - | - | - | - | - | - | - | - | - |
| fusioncharts | - | - | - | - | - | - | - | - | - | - |
| morris | - | - | - | - | - | - | - | - | - | - |
| plottablejs | - | - | - | - | - | - | - | - | - | - |
| minimalist | - | - | - | - | - | - | - | - | - | - |
| canvas-gauges | - | - | - | - | - | - | x | x | - | - |
| justgage | - | - | - | - | - | - | x | - | x | - |
| progressbarjs | - | - | - | - | - | - | - | - | x | x |
You can create realtime charts.
Example json:
```json
{"value":31}
```
'value' can be changed to different index name with ```setValueName($string)```
```php
$chart = Charts::realtime(url('/path/to/json'), 2000, 'gauge', 'google')
->setValues([65, 0, 100])
->setLabels(['First', 'Second', 'Third'])
->setResponsive(false)
->setHeight(300)
->setWidth(0)
->setTitle("Permissions Chart")
->setValueName('value'); //This determines the json index for the value
```
**Note:** The interval is set in ms
The available methods are:
- setValueName(required string $string)
Sets the value json index.
*Default:* ```value```
```php
$chart = Charts::realtime(url('/path/to/json'), 2000, 'gauge', 'google')
->setValues([65, 0, 100])
->setLabels(['First', 'Second', 'Third'])
->setResponsive(false)
->setHeight(300)
->setWidth(0)
->setTitle("Permissions Chart")
->setValueName('value'); //This determines the json index for the value
```
- setUrl(required string $url)
Sets the url after chart object creation.
```php
$chart = Charts::realtime(url('/path/to/json'), 2000, 'gauge', 'google')
->setValues([65, 0, 100])
->setLabels(['First', 'Second', 'Third'])
->setResponsive(false)
->setHeight(300)
->setWidth(0)
->setTitle("Permissions Chart")
->setUrl(url('/new/json'));
```
- setInterval(required int $interval)
Sets the interval after chart object creation (ms).
```php
$chart = Charts::realtime(url('/path/to/json'), 2000, 'gauge', 'google')
->setValues([65, 0, 100])
->setLabels(['First', 'Second', 'Third'])
->setResponsive(false)
->setHeight(300)
->setWidth(0)
->setTitle("Permissions Chart")
->setInterval(3000); // in ms
```
- setMaxValues(required int $number)
Sets the max amount of values to be seen before removing the first one.
```php
$chart = Charts::realtime(url('/path/to/json'), 1000, 'area', 'highcharts')
->setResponsive(false)
->setHeight(300)
->setWidth(0)
->setTitle("Permissions Chart")
->setMaxValues(10);
```
## Math Functions Charts
You can create math function charts.
![Math Functions Example](https://i.gyazo.com/0dc9c2bd8ce55f16ff2c217afc9614dd.png)
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts');
```
The function is ```sin(x)```, the interval is ```[0, 10]``` and the ```x``` amplitude is ```0.2```
- setFunction(required string $function)
Sets the function.
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts')->setFunction('x+1');
```
- setInterval(required array $interval)
Sets the function / chart interval.
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts')->setInterval([2, 8]);
```
- setAmplitude(required int $amplitude)
Sets the function amplitude between x points.
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts')->setAmplitude(0.5);
```
- calculate()
Calculates the values / labels for the chart.
**Note:** This function is called every time a modification is made in the chart function, interval or amplitude
so you don't need to call it every time you change the values. It's just an auxiliary function.
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts')->calculate();
```
## Charts Functions
- create(optional string $type, optional string $library)
Returns a new chart instance, if no library is specified, the default one will be used.
```php
Charts::create('line');
Charts::create('line', 'highcharts');
```
- database(required mixed $object, optional string $type, optional string $library)
Returns a new database chart instance that extends the base one.
```php
Charts::database(User::all());
Charts::create(User::all(), 'line', 'highcharts');
```
- realtime(required string $url, required int $interval, optional string $type, optional string $library)
Returns a new database chart instance that extends the base one.
```php
Charts::realtime(url('/json/data'), 2000, 'gauge', 'google')
```
- realtime(required string $function, required array $interval, required int $amplitude, optional string $type, optional string $library)
Returns a new math function chart instance that extends the base one.
```php
Charts::math('sin(x)', [0, 10], 0.2, 'line', 'highcharts');
```
- assets(optional array $libraries)
Returns all the assets to generate the graphs.
To output only certain libraries, add an array to it with the libraries you want
```php
<?php echo Charts::assets(); ?>
// Using blade
{!! Charts::assets() !!}
// Only certain libraries
{!! Charts::assets(['google', 'chartjs']) !!}
```
- libraries(optional string $type)
Returns an array of all the libraries available (can be filtered).
```php
// Return all the libraries available
print_r(Charts::libraries());
// Return all the libraries available for the line chart
print_r(Charts::libraries('line'));
```
- types(optional string $library)
Returns an array of all the chart types available (can be filtered).
```php
// Return all the chart types available
print_r(Charts::types());
// Return all the chart types available for the highcharts library
print_r(Charts::types('highcharts'));
```
## Available Chart Settings:
- setGaugeStyle(required string $style)
Set the gauge style
*Default:* ```left```
*Available options:* ```left``` ```right``` ```center```
```php
Charts::create('gauge', 'google')->setGaugeStyle('right');
```
- setType(required string $type)
Set the chart type after creation (Example: from line to pie).
```php
Charts::create('line', 'highcharts')->setType('pie');
```
- setLibrary(required string $library)
Set the chart library after creation (Example: from highcharts to google).
```php
Charts::create('line', 'highcharts')->setLibrary('google');
```
- setLabels(required array $labels)
The labels of the chart.
```php
Charts::create('line', 'highcharts')->setLabels(['First', 'Second', 'Third']);
```
- setValues(required array $values)
The values of the chart respectively.
```php
Charts::create('line', 'highcharts')->setValues([10, 50, 100]);
```
- setElementLabel(required string $element_label)
The element label for line / bar / geo charts.
```php
Charts::create('line', 'highcharts')->setElementLabel('Total Views');
```
- setTitle(required string $title)
The chart title.
```php
Charts::create('line', 'highcharts')->setTitle('My Chart');
```
- setColors(required array $colors)
The colors of the charts respectively.
```php
Charts::create('line', 'highcharts')->setColors(['#ff0000', '#00ff00', '#0000ff']);
```
- setWidth(required int $width)
The chart width if non-responsive. 0 = responsive width.
```php
Charts::create('line', 'highcharts')->setWidth(1000);
```
- setHeight(required int $height)
The chart height if non-responsive. 0 = responsive height.
```php
Charts::create('line', 'highcharts')->setHeight(500);
```
- setDimensions(required int $width, required int $height)
The chart dimensions (shortcut to set width, height with one function).
```php
Charts::create('line', 'highcharts')->setHeight(1000, 500);
```
- setResponsive(required boolean $responsive)
Set if the chart is responsive or not. If not, the chart dimensions will be used.
```php
Charts::create('line', 'highcharts')->setResponsive(false);
```
- settings()
Return the chart settings.
```php
print_r(Charts::create('line', 'highcharts')->settings());
```
- render()
Render the chart.
```php
echo Charts::create('line', 'highcharts')->setLabels(['One', 'Two'])->setValues([10, 20])->render();
```
## Chart Examples
### Pie
Note: ```highcharts``` can't change the color of this chart. Well it can but it's complicated, so I leave it here.
```php
Charts::create('pie', 'highcharts')
->setTitle('My nice chart')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Pie](https://i.gyazo.com/b61a0a5786a8f70daf61398d256366b8.png)
### Donut / Doughnut
Note: ```highcharts``` and ```chartist``` can't change the color of this chart. Well they can but it's complicated, so I leave it here.
```php
Charts::create('donut', 'highcharts')
->setTitle('My nice chart')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Donut](https://i.gyazo.com/fecef4a102cb348d0f7f3681120a600f.png)
### Line
```php
Charts::create('line', 'highcharts')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Line](https://i.gyazo.com/121736e3b8aa7f22ad17a7c0ceecac02.png)
### Area
```php
Charts::create('area', 'highcharts')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Area](https://i.gyazo.com/f6c500cf9bfc2e449d64ee19b7bb809c.png)
### Bar
Note: ```highcharts``` can't change the color of this chart. Well it can but it's complicated, so I leave it here.
```php
Charts::create('bar', 'highcharts')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setLabels(['First', 'Second', 'Third'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Bar](https://i.gyazo.com/94ada1aac091ef3cbc84433a3425a9aa.png)
### Geo
Note: The labels must have the country codes, not the name.
Note 2: To add color to the chart, you'll need to provide an array of at least 2 colors. The first is the min and the second the max.
```php
Charts::create('geo', 'highcharts')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setLabels(['ES', 'FR', 'RU'])
->setColors(['#C5CAE9', '#283593'])
->setValues([5,10,20])
->setDimensions(1000,500)
->setResponsive(false);
```
![Example Geo](https://i.gyazo.com/f7a76582e80912864c6cfb23f688e43e.png)
### Gauge
Note: You either need 1 value or 3 following this standard: ```[actualValue, minValue, maxValue]```
```php
Charts::create('gauge', 'canvas-gauges')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setValues([65,0,100])
->setResponsive(false)
->setHeight(300)
->setWidth(0);
```
![Example Gauge](https://i.gyazo.com/a9bc88c6550d39a15b5a686ea66df0ea.png)
### Temperature
Note: You either need 1 value or 3 following this standard: ```[actualValue, minValue, maxValue]```
```php
Charts::create('temp', 'canvas-gauges')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setValues([65,0,100])
->setResponsive(false)
->setHeight(300)
->setWidth(0);
```
![Example Temperature](https://i.gyazo.com/1a8f264ffd9746da06d67c3624eaac81.png)
### Percentage
Note: You either need 1 value or 3 following this standard: ```[actualValue, minValue, maxValue]```
```php
Charts::create('percentage', 'justgage')
->setTitle('My nice chart')
->setElementLabel('My nice label')
->setValues([65,0,100])
->setResponsive(false)
->setHeight(300)
->setWidth(0);
```
![Example Percentage](https://i.gyazo.com/d39af8739c12eae6558046aa2031e6c0.png)
### Progressbar
Note: You either need 1 value or 3 following this standard: ```[actualValue, minValue, maxValue]```
```php
Charts::create('progressbar', 'progressbarjs')
->setValues([65,0,100])
->setResponsive(false)
->setHeight(50)
->setWidth(0);
```
![Example Progressbar](https://i.gyazo.com/ecd6a20344939ab75767739d32780104.png)
## Extend your way!
You can create your own Charts by forking this repository. The ```src/Templates``` folder contains all the current charts, but you can
add yours like this:
### Create a new file
Create a new file, the syntax is: ```library.type.php```
if your chart library is called: ```mylib```
and your template is for the line chart: ```line```
Then you create a file like this: ```mylib.line.php```
To call it later, just use:
```php
$chart = Charts::create('line', 'mylib');
```
You will need to add the CSS / JS to the includes.php file found in the ```/src``` folder.
You have plenty of examples to see how to put the data so just take a closer look at all the included templates before doing yours!

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,7 @@
@if(!$model->container)
@include('charts::_partials.loader.container-top')
<div>
<canvas id="{{ $model->id }}"></canvas>
</div>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,7 @@
@if(!$model->container)
@include('charts::_partials.loader.container-top')
<div>
<canvas id="{{ $model->id }}" @include('charts::_partials.dimension.html')></canvas>
</div>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,6 @@
@if(!$model->container)
@include('charts::_partials.container.title')
@include('charts::_partials.loader.container-top')
<div id="{{ $model->id }}" style="@include('charts::_partials.dimension.css')" class="ct-chart ct-perfect-fourth"></div>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,8 @@
@if(!$model->container)
@include('charts::_partials.container.title')
@include('charts::_partials.loader.container-top')
<center>
<div id="{{ $model->id }}" style="@include('charts::_partials.dimension.css')"></div>
</center>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,6 @@
@if(!$model->container)
@include('charts::_partials.loader.container-top')
<div id="{{ $model->id }}" style="@include('charts::_partials.dimension.css')"></div>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,5 @@
@if(!$model->container)
@include('charts::_partials.loader.container-top')
<svg id="{{ $model->id }}" @include('charts::_partials.dimension.html')></svg>
@include('charts::_partials.loader.container-bottom')
@endif

View File

@@ -0,0 +1,9 @@
@if(!$model->container)
<div>
@if($model->title)
<center>
<strong>{{ $model->title }}</strong>
</center>
@endif
</div>
@endif

View File

@@ -0,0 +1,11 @@
@if($model->responsive)
height: 100%; width: 100%;
@else
@if($model->height)
height: {{ $model->height }}px;
@endif
@if($model->width)
width: {{ $model->width }}px;
@endif
@endif

View File

@@ -0,0 +1,11 @@
@if($model->responsive)
height="100%" width="100%"
@else
@if($model->height)
height="{{ $model->height }}"
@endif
@if($model->width)
width="{{ $model->width }}"
@endif
@endif

View File

@@ -0,0 +1,16 @@
@if($model->responsive)
height: "100%",
width: "100%",
@else
@if($model->height)
height: "{{ $model->height }}px",
@else
height: "100%",
@endif
@if($model->width)
width: "{{ $model->width }}px",
@else
width: "100%",
@endif
@endif

View File

@@ -0,0 +1,9 @@
@if(!$model->responsive)
@if($model->height)
height: {{ $model->height }},
@endif
@if($model->width)
width: {{ $model->width }},
@endif
@endif

View File

@@ -0,0 +1,5 @@
<style>
#{{ $model->id }} > svg {
@include("charts::_partials.dimension.css")
}
</style>

View File

@@ -0,0 +1,11 @@
<script>
function hex2rgba_convert(hex,opacity){
hex = hex.replace('#','');
r = parseInt(hex.substring(0,2), 16);
g = parseInt(hex.substring(2,4), 16);
b = parseInt(hex.substring(4,6), 16);
result = 'rgba('+r+','+g+','+b+','+opacity/100+')';
return result;
}
</script>

View File

@@ -0,0 +1,2 @@
</div>
</div>

View File

@@ -0,0 +1,7 @@
<div class="charts" style="background: {{ $model->background_color }};">
<div data-duration="{{ $model->loader_duration }}" class="charts-loader {{ $model->loader ? 'enabled' : '' }}" style="display: none; position: relative; top: {{ ($model->height / 2) - 30 }}px; height: 0;">
<center>
<div class="loading-spinner" style="border: 3px solid {{ $model->loader_color }}; border-right-color: transparent;"></div>
</center>
</div>
<div class="charts-chart">

View File

@@ -0,0 +1,68 @@
<style>
@-webkit-keyframes rotate-forever {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes rotate-forever {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotate-forever {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.loading-spinner {
-webkit-animation-duration: 0.75s;
-moz-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: rotate-forever;
-moz-animation-name: rotate-forever;
animation-name: rotate-forever;
-webkit-animation-timing-function: linear;
-moz-animation-timing-function: linear;
animation-timing-function: linear;
height: 60px;
width: 60px;
border-radius: 50%;
display: inline-block;
}
</style>

View File

@@ -0,0 +1,20 @@
<script>
$(function() {
$('.charts').each(function() {
var chart = $(this).find('.charts-chart');
var loader = $(this).find('.charts-loader');
var time = loader.data('duration');
if(loader.hasClass('enabled')) {
chart.css({visibility: 'hidden'});
loader.fadeIn(350);
setTimeout(function() {
loader.fadeOut(350, function() {
chart.css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 350);
});
}, time)
}
});
})
</script>

View File

@@ -0,0 +1,49 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script>
var {{ $model->id }} = AmCharts.makeChart( "{{ $model->id }}", {
"type": "serial",
"theme": "light",
"dataProvider": [
@foreach($model->values as $v)
{
"country": "{{ $model->labels[$loop->index] }}",
"visits": {{ $v }}
},
@endforeach
],
"valueAxes": [
{
"minimum": 0,
"title": "{!! $model->element_label !!}",
}
],
"gridAboveGraphs": true,
"startDuration": 1,
"graphs": [ {
"balloonText": "[[category]]: <b>[[value]]</b>",
"fillAlphas": 0.8,
"lineAlpha": 0.2,
"type": "column",
"valueField": "{!! $model->element_label !!}"
} ],
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "country",
"categoryAxis": {
"gridPosition": "start",
"gridAlpha": 0,
"tickPosition": "start",
"tickLength": 20
},
"export": {
"enabled": true
}
} );
</script>

View File

@@ -0,0 +1,30 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
["{!! $model->element_label !!}",@foreach($model->values as $value){{ $value }},@endforeach],
],
type: 'area',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,30 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
["{!! $model->element_label !!}",@foreach($model->values as $value){{ $value }},@endforeach],
],
type: 'bar',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,32 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
@for($i = 0; $i < count($model->labels); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
],
type: 'donut',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,34 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
["{!! $model->element_label !!}",{{ $model->values[0] }}],
],
type: 'gauge',
},
gauge: {
min: {{ ($model->values && count($model->values) > 1) ? $model->values[1] : '0' }},
max: {{ ($model->values && count($model->values) > 2) ? $model->values[2] : '100' }},
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,29 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
["{!! $model->element_label !!}",@foreach($model->values as $value){{ $value }},@endforeach],
]
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,32 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
@foreach($model->datasets as $ds)
["{{ $ds['label'] }}",@foreach($ds['values'] as $value){{ $value }},@endforeach],
@endforeach
],
type: 'area',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,32 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
@foreach($model->datasets as $ds)
["{{ $ds['label'] }}",@foreach($ds['values'] as $value){{ $value }},@endforeach],
@endforeach
],
type: 'bar',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,31 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
@foreach($model->datasets as $ds)
["{{ $ds['label'] }}",@foreach($ds['values'] as $value){{ $value }},@endforeach],
@endforeach
]
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,32 @@
@include('charts::_partials.container.div')
<script>
var {{ $model->id }} = c3.generate({
bindto: '#{{ $model->id }}',
data: {
columns: [
@for($i = 0; $i < count($model->labels); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
],
type: 'pie',
},
axis: {
x: {
type: 'category',
categories: [@foreach($model->labels as $label)"{!! $label !!}",@endforeach]
},
y: {
label: {
text: "{!! $model->element_label !!}",
position: 'outer-middle',
}
},
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
});
</script>

View File

@@ -0,0 +1,99 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas')
@endif
<script type="text/javascript">
$(function (){
var {{ $model->id }} = new RadialGauge({
renderTo: "{{ $model->id }}",
@if($model->colors)
colorNumbers: "{{ $model->colors[0] }}",
@endif
@include('charts::_partials.dimension.js2')
@if($model->title)
title: "{!! $model->title !!}",
@endif
value: {{ $model->values[0] }},
units: "{!! $model->element_label !!}",
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
minValue: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
maxValue: {{ $max }},
@else
@php($max = 100)
@endif
@php
$interval = 10;
$interval_adder = round($max / $interval, 2)
@endphp
majorTicks: [
@php($r = $min)
@for($i = 0; $i <= $interval; $i++)
@if($i == 0)
{{ $min }},
@elseif($i == $interval)
{{ $max }},
@else
{{ $r + $interval_adder }},
@php($r = $r + $interval_adder)
@endif
@endfor
],
animationRule: 'linear',
highlights: [
@if($model->gauge_style == 'right')
// Calculate warning area
<?php
$low_warning = round(0.40 * $max, 2);
$warning = round(0.25 * $max, 2);
$max_warning = round(0.10 * $max, 2);
?>
{ from: {{ $low_warning }}, to: {{ $max }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning }}, to: {{ $low_warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $max_warning }}, to: {{ $warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $max_warning }}, color: 'rgba(255,0,0,.5)' },
@elseif($model->gauge_style == 'center')
// Calculate warning area
<?php
$warning = round(0.10 * $max, 2);
$warning2 = round(0.25 * $max, 2);
$warning3 = round(0.40 * $max, 2);
$warning4 = round(0.60 * $max, 2);
$warning5 = round(0.75 * $max, 2);
$warning6 = round(0.90 * $max, 2);
?>
{ from: {{ $warning3 }}, to: {{ $warning4 }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning2 }}, to: {{ $warning3 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning4 }}, to: {{ $warning5 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $warning2 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $warning5 }}, to: {{ $warning6 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $warning }}, color: 'rgba(255,0,0,.5)' },
{ from: {{ $warning6 }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@else
// Calculate warning area
<?php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
?>
{ from: {{ $min }}, to: {{ $low_warning }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $low_warning }}, to: {{ $warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $max_warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $max_warning }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@endif
],
}).draw()
});
</script>

View File

@@ -0,0 +1,105 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas')
@endif
<script type="text/javascript">
$(function (){
var {{ $model->id }} = new RadialGauge({
renderTo: "{{ $model->id }}",
@if($model->colors)
colorNumbers: "{{ $model->colors[0] }}",
@endif
@include('charts::_partials.dimension.js2')
@if($model->title)
title: "{!! $model->title !!}",
@endif
value: {{ $model->values ? $model->values[0] : '0' }},
units: "{!! $model->element_label !!}",
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
minValue: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
maxValue: {{ $max }},
@else
@php($max = 100)
@endif
@php
$interval = 10;
$interval_adder = round($max / $interval, 2)
@endphp
majorTicks: [
@php($r = $min)
@for($i = 0; $i <= $interval; $i++)
@if($i == 0)
{{ $min }},
@elseif($i == $interval)
{{ $max }},
@else
{{ $r + $interval_adder }},
@php($r = $r + $interval_adder)
@endif
@endfor
],
animationRule: 'linear',
highlights: [
@if($model->gauge_style == 'right')
// Calculate warning area
@php
$low_warning = round(0.40 * $max, 2);
$warning = round(0.25 * $max, 2);
$max_warning = round(0.10 * $max, 2);
@endphp
{ from: {{ $low_warning }}, to: {{ $max }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning }}, to: {{ $low_warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $max_warning }}, to: {{ $warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $max_warning }}, color: 'rgba(255,0,0,.5)' },
@elseif($model->gauge_style == 'center') {
// Calculate warning area
@php
$warning = round(0.10 * $max, 2);
$warning2 = round(0.25 * $max, 2);
$warning3 = round(0.40 * $max, 2);
$warning4 = round(0.60 * $max, 2);
$warning5 = round(0.75 * $max, 2);
$warning6 = round(0.90 * $max, 2);
@endphp
{ from: {{ $warning3 }}, to: {{ $warning4 }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning2 }}, to: {{ $warning3 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning4 }}, to: {{ $warning5 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $warning2 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $warning5 }}, to: {{ $warning6 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $warning }}, color: 'rgba(255,0,0,.5)' },
{ from: {{ $warning6 }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@else
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
@endphp
{ from: {{ $min }}, to: {{ $low_warning }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $low_warning }}, to: {{ $warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $max_warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $max_warning }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@endif
],
}).draw()
setInterval(function(){
$.getJSON("{{ $model->url }}", function( data ) {
{{ $model->id }}.value = data["{{ $model->value_name }}"];
})
}, {{ $model->interval }})
});
</script>

View File

@@ -0,0 +1,108 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas')
@endif
<script type="text/javascript">
$(function (){
var {{ $model->id }} = new LinearGauge({
renderTo: "{{ $model->id }}",
@if($model->colors)
colorNumbers: "{{ $model->colors[0] }}",
@endif
@include('charts::_partials.dimension.js2')
@if($model->title)
title: "{!! $model->title !!}",
@endif
value: {{ $model->values ? $model->values[0] : '0' }},
units: "{!! $model->element_label !!}",
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
minValue: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
maxValue: {{ $max }},
@else
@php($max = 100)
@endif
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
$interval = 10;
$interval_adder = round($max / $interval, 2);
@endphp
majorTicks: [
@php($r = $min)
@for($i = 0; $i <= $interval; $i++)
@if($i == 0)
{{ $min }},
@elseif($i == $interval)
{{ $max }},
@else
{{ $r + $interval_adder }},
@php($r = $r + $interval_adder)
@endif
@endfor
],
highlights: [
@if($model->gauge_style == 'right')
// Calculate warning area
@php
$low_warning = round(0.40 * $max, 2);
$warning = round(0.25 * $max, 2);
$max_warning = round(0.10 * $max, 2);
@endphp
{ from: {{ $low_warning }}, to: {{ $max }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning }}, to: {{ $low_warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $max_warning }}, to: {{ $warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $max_warning }}, color: 'rgba(255,0,0,.5)' },
@elseif($model->gauge_style == 'center')
// Calculate warning area
@php
$warning = round(0.10 * $max, 2);
$warning2 = round(0.25 * $max, 2);
$warning3 = round(0.40 * $max, 2);
$warning4 = round(0.60 * $max, 2);
$warning5 = round(0.75 * $max, 2);
$warning6 = round(0.90 * $max, 2);
@endphp
{ from: {{ $warning3 }}, to: {{ $warning4 }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning2 }}, to: {{ $warning3 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning4 }}, to: {{ $warning5 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $warning2 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $warning5 }}, to: {{ $warning6 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $warning }}, color: 'rgba(255,0,0,.5)' },
{ from: {{ $warning6 }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@else
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
@endphp
{ from: {{ $min }}, to: {{ $low_warning }}, color: 'rgba(0,258,0,.15)' },
{ from: {{ $low_warning }}, to: {{ $warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $max_warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $max_warning }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@endif
],
}).draw()
setInterval(function(){
$.getJSON("{{ $model->url }}", function( data ) {
{{ $model->id }}.value = data["{{ $model->value_name }}"];
})
}, {{ $model->interval }})
});
</script>

View File

@@ -0,0 +1,102 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas')
@endif
<script type="text/javascript">
$(function (){
var {{ $model->id }} = new LinearGauge({
renderTo: "{{ $model->id }}",
@if($model->colors)
colorNumbers: "{{ $model->colors[0] }}",
@endif
@include('charts::_partials.dimension.js2')
@if($model->title)
title: "{!! $model->title !!}",
@endif
value: "{{ $model->values[0] }}",
units: "{!! $model->element_label !!}",
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
minValue: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
maxValue: {{ $max }},
@else
@php($max = 100)
@endif
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
$interval = 10;
$interval_adder = round($max / $interval, 2);
@endphp
majorTicks: [
@php($r = $min)
@for($i = 0; $i <= $interval; $i++)
@if($i == 0)
{{ $min }},
@elseif($i == $interval)
{{ $max }},
@else
{{ $r + $interval_adder }},
@php($r = $r + $interval_adder)
@endif
@endfor
],
highlights: [
@if($model->gauge_style == 'right')
// Calculate warning area
@php
$low_warning = round(0.40 * $max, 2);
$warning = round(0.25 * $max, 2);
$max_warning = round(0.10 * $max, 2);
@endphp
{ from: {{ $low_warning }}, to: {{ $max }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning }}, to: {{ $low_warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $max_warning }}, to: {{ $warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $max_warning }}, color: 'rgba(255,0,0,.5)' },
@elseif($model->gauge_style == 'center')
// Calculate warning area
@php
$warning = round(0.10 * $max, 2);
$warning2 = round(0.25 * $max, 2);
$warning3 = round(0.40 * $max, 2);
$warning4 = round(0.60 * $max, 2);
$warning5 = round(0.75 * $max, 2);
$warning6 = round(0.90 * $max, 2);
@endphp
{ from: {{ $warning3 }}, to: {{ $warning4 }}, color: 'rgba(0,258,0,.20)' },
{ from: {{ $warning2 }}, to: {{ $warning3 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning4 }}, to: {{ $warning5 }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $warning2 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $warning5 }}, to: {{ $warning6 }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $min }}, to: {{ $warning }}, color: 'rgba(255,0,0,.5)' },
{ from: {{ $warning6 }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@else
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
@endphp
{ from: {{ $min }}, to: {{ $low_warning }}, color: 'rgba(0,258,0,.15)' },
{ from: {{ $low_warning }}, to: {{ $warning }}, color: 'rgba(255,255,0,.35)' },
{ from: {{ $warning }}, to: {{ $max_warning }}, color: 'rgba(255,69,0,.40)' },
{ from: {{ $max_warning }}, to: {{ $max }}, color: 'rgba(255,0,0,.5)' },
@endif
],
}).draw()
});
</script>

View File

@@ -0,0 +1,25 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
[
@foreach($model->values as $value)
"{{ $value }}",
@endforeach
],
]
};
var options = {
showArea: true,
@include('charts::_partials.dimension.js')
};
new Chartist.Line('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,22 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
[
@foreach($model->values as $value)
"{{ $value }}",
@endforeach
],
]
};
var options = { @include('charts::_partials.dimension.js') }
new Chartist.Bar('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,26 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
@foreach($model->values as $value)
"{{ $value }}",
@endforeach
]
};
var options = {
donut: true,
labelOffset: 50,
chartPadding: 20,
labelDirection: 'explode',
@include('charts::_partials.dimension.js')
};
new Chartist.Pie('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,22 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
[
@foreach($model->values as $value)
{{ $value }},
@endforeach
],
]
};
var options = { @include('charts::_partials.dimension.js') }
new Chartist.Line('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,26 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
@foreach($model->datasets as $ds)
[
@foreach($ds['values'] as $value)
"{{ $value }}",
@endforeach
],
@endforeach
]
};
var options = {
showArea: true,
@include('charts::_partials.dimension.js')
}
new Chartist.Line('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,24 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
@foreach($model->datasets as $ds)
[
@foreach($ds['values'] as $value)
"{{ $value }}",
@endforeach
],
@endforeach
]
};
var options = { @include('charts::_partials.dimension.js') }
new Chartist.Bar('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,24 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
@foreach($model->datasets as $ds)
[
@foreach($ds['values'] as $value)
"{{ $value }}",
@endforeach
],
@endforeach
]
};
var options = { @include('charts::_partials.dimension.js') }
new Chartist.Line('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,24 @@
@include('charts::_partials.container.chartist')
<script type="text/javascript">
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
series: [
@foreach($model->values as $value)
"{{ $value }}",
@endforeach
]
};
var options = {
chartPadding: 20,
labelDirection: 'explode',
@include('charts::_partials.dimension.js')
};
new Chartist.Pie('#{{ $model->id }}', data, options);
</script>

View File

@@ -0,0 +1,49 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
@include('charts::_partials.helpers.hex2rgb')
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [{
fill: true,
@if($model->colors)
backgroundColor: hex2rgba_convert("{{ $model->colors[0] }}", 50),
@endif
label: "{!! $model->element_label !!}",
lineTension: 0.3,
@if($model->colors)
borderColor: "{{ $model->colors[0] }}",
@endif
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
}]
};
var {{ $model->id }} = new Chart(ctx, {
type: 'line',
data: data,
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,57 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var {{ $model->id }} = new Chart(ctx, {
type: 'bar',
data: {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [
{
label: "{!! $model->element_label !!}",
backgroundColor: [
@if($model->colors)
@foreach($model->colors as $color)
"{{ $color }}",
@endforeach
@else
@foreach($model->values as $dta)
"{{ sprintf('#%06X', mt_rand(0, 0xFFFFFF)) }}",
@endforeach
@endif
],
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
}
]
},
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
},
@endif
scales: {
yAxes: [{
display: true,
ticks: {
beginAtZero: true,
}
}]
}
}
});
</script>

View File

@@ -0,0 +1,47 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var {{ $model->id }} = new Chart(ctx, {
type: 'doughnut',
data: {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [{
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
backgroundColor: [
@if($model->colors)
@foreach($model->colors as $color)
"{{ $color }}",
@endforeach
@else
@foreach($model->values as $dta)
"{{ sprintf('#%06X', mt_rand(0, 0xFFFFFF)) }}",
@endforeach
@endif
],
}]
},
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,46 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [
{
fill: false,
label: "{!! $model->element_label !!}",
lineTension: 0.3,
@if($model->colors)
borderColor: "{{ $model->colors[0] }}",
backgroundColor: "{{ $model->colors[0] }}",
@endif
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
}
]
};
var {{ $model->id }} = new Chart(ctx, {
type: 'line',
data: data,
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,56 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
@include('charts::_partials.helpers.hex2rgb')
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
fill: true,
label: "{!! $model->datasets[$i]['label'] !!}",
lineTension: 0.3,
@if($model->colors and count($model->colors) > $i)
@php($c = $model->colors[$i])
@else
@php($c = sprintf('#%06X', mt_rand(0, 0xFFFFFF)))
@endif
borderColor: "{{ $c }}",
backgroundColor: hex2rgba_convert("{{ $c }}", 50),
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
],
},
@endfor
]
};
var {{ $model->id }} = new Chart(ctx, {
type: 'line',
data: data,
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,58 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var {{ $model->id }} = new Chart(ctx, {
type: 'bar',
data: {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
fill: true,
label: "{!! $model->datasets[$i]['label'] !!}",
lineTension: 0.3,
@if($model->colors and count($model->colors) > $i)
borderColor: "{{ $model->colors[$i] }}",
backgroundColor: "{{ $model->colors[$i] }}",
@else
$c = sprintf('#%06X', mt_rand(0, 0xFFFFFF))
borderColor: "{{ $c }}",
backgroundColor: "{{ $c }}",
@endif
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
],
},
@endfor
]
},
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
},
@endif
scales: {
yAxes: [{
display: true,
ticks: {
beginAtZero: true,
}
}]
}
}
});
</script>

View File

@@ -0,0 +1,51 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var data = {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
fill: false,
label: "{!! $model->datasets[$i]['label'] !!}",
lineTension: 0.3,
@if($model->colors and count($model->colors) > $i)
@php($c = $model->colors[$i])
@else
@php($c = sprintf('#%06X', mt_rand(0, 0xFFFFFF)))
@endif
borderColor: "{{ $c }}",
backgroundColor: "{{ $c }}",
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
],
},
@endfor
]
};
var myLineChart = new Chart(ctx, {
type: 'line',
data: data,
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,47 @@
@if(!$model->customId)
@include('charts::_partials.container.canvas2')
@endif
<script type="text/javascript">
var ctx = document.getElementById("{{ $model->id }}")
var {{ $model->id }} = new Chart(ctx, {
type: 'pie',
data: {
labels: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
datasets: [{
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
backgroundColor: [
@if($model->colors)
@foreach($model->colors as $color)
"{{ $color }}",
@endforeach
@else
@foreach($model->values as $dta)
"{{ sprintf('#%06X', mt_rand(0, 0xFFFFFF)) }}",
@endforeach
@endif
],
}]
},
options: {
responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
maintainAspectRatio: false,
@if($model->title)
title: {
display: true,
text: "{!! $model->title !!}",
fontSize: 20,
}
@endif
}
});
</script>

View File

@@ -0,0 +1,59 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
data:["{!! $model->element_label !!}"]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: ["{{ $model->colors[0] }}"],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->element_label !!}",
type: 'line',
areaStyle: {
normal: {
color: "{{ count($model->colors) > 0 ? $model->colors[0] : '#c23531' }}",
}
},
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,54 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
data:["{!! $model->element_label !!}"]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: ["{{ $model->colors[0] }}"],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->element_label !!}",
type: 'bar',
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,58 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
top: 50,
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->element_label !!}",
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
data: [
@for($i = 0; count($model->values) > $i; $i++)
{value: {{ $model->values[$i] }}, name: "{{ $model->labels[$i] }}" },
@endfor
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,60 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
top: 50,
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->title !!}",
type: 'gauge',
min: {{ ($model->values && count($model->values) > 1) ? $model->values[1] : '0' }},
max: {{ ($model->values && count($model->values) > 2) ? $model->values[2] : '100' }},
data: [
{
value: {{ $model->values[0] }},
name: "{!! $model->element_label !!}",
}
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,54 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
data:["{!! $model->element_label !!}"]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: ["{{ $model->colors[0] }}"],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->element_label !!}",
type: 'line',
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,72 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
left: 'left',
top: 50,
data: [
@foreach ($model->datasets as $ds)
"{!! $ds['label'] !!}",
@endforeach
]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [
@foreach ($model->datasets as $ds)
{
name: "{!! $ds['label'] !!}",
type: 'line',
areaStyle: {
normal: {
color: "{{ $model->colors[$loop->index] }}",
}
},
data: [
@foreach($ds['values'] as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
},
@endforeach
],
});
</script>

View File

@@ -0,0 +1,67 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
left: 'left',
top: 50,
data: [
@foreach ($model->datasets as $ds)
"{!! $ds['label'] !!}",
@endforeach
]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [
@foreach ($model->datasets as $ds)
{
name: "{!! $ds['label'] !!}",
type: 'bar',
data: [
@foreach($ds['values'] as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
},
@endforeach
],
});
</script>

View File

@@ -0,0 +1,67 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
left: 'left',
top: 50,
data: [
@foreach ($model->datasets as $ds)
"{!! $ds['label'] !!}",
@endforeach
]
},
xAxis: {
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [
@foreach ($model->datasets as $ds)
{
name: "{!! $ds['label'] !!}",
type: 'line',
data: [
@foreach($ds['values'] as $dta)
{{ $dta }},
@endforeach
],
animationDelay: function (idx) {
return idx * 100;
}
},
@endforeach
],
});
</script>

View File

@@ -0,0 +1,56 @@
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif
<script type="text/javascript">
var {{ $model->id }} = echarts.init(document.getElementById("{{ $model->id }}"));
{{ $model->id }}.setOption({
title: {
text: "{!! $model->title !!}"
},
tooltip: {},
toolbox: {
right: 30,
feature: {
@if ($model->export)
saveAsImage: {
title: 'Save as image',
}
@endif
}
},
legend: {
orient: 'vertical',
top: 50,
data: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
@if (count($model->colors) > 0)
color: [
@foreach ($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if ($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif
series: [{
name: "{!! $model->element_label !!}",
type: 'pie',
data: [
@for($i = 0; count($model->values) > $i; $i++)
{value: {{ $model->values[$i] }}, name: "{{ $model->labels[$i] }}" },
@endfor
],
animationDelay: function (idx) {
return idx * 100;
}
}],
});
</script>

View File

@@ -0,0 +1,48 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'area2d',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
@if($model->colors)
'paletteColors': "{{ $model->colors[0] }}",
@endif
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'rotatevalues': '0',
'showValues': '0',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'data': [
@for ($i = 0; $i < count($model->values); $i++)
{
'label': "{!! $model->labels[$i] !!}",
'value': {{ $model->values[$i] }},
},
@endfor
],
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,48 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'column2d',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'paletteColors': '#0075c2',
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'rotatevalues': '1',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'data': [
@for ($i = 0; $i < count($model->values); $i++)
{
'label': "{!! $model->labels[$i] !!}",
'value': {{ $model->values[$i] }},
@if($model->colors)
'color': "{{ $model->colors[$i] }}",
@endif
},
@endfor
],
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,59 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'doughnut2d',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'paletteColors': '#0075c2',
'bgColor': '#ffffff',
'showBorder': '0',
'use3DLighting': '0',
'showShadow': '0',
'enableSmartLabels': '1',
'startingAngle': '0',
'showPercentValues': '1',
'showPercentInTooltip': '0',
'decimals': '1',
'captionFontSize': '14',
'subcaptionFontSize': '14',
'subcaptionFontBold': '0',
'toolTipColor': '#ffffff',
'toolTipBorderThickness': '0',
'toolTipBgColor': '#000000',
'toolTipBgAlpha': '80',
'toolTipBorderRadius': '2',
'toolTipPadding': '5',
'showHoverEffect':'1',
'showLegend': '1',
'legendBgColor': '#ffffff',
'legendBorderAlpha': '0',
'legendShadow': '0',
'legendItemFontSize': '10',
'legendItemFontColor': '#666666'
},
'data': [
@for ($i = 0; $i < count($model->values); $i++)
{
'label': "{!! $model->labels[$i] !!}",
'value': {{ $model->values[$i] }},
@if($model->colors)
'color': "{{ $model->colors[$i] }}",
@endif
},
@endfor
],
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,47 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'line',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
@if($model->colors)
'paletteColors': "{{ $model->colors[0] }}",
@endif
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'rotatevalues': '1',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'data': [
@for ($i = 0; $i < count($model->values); $i++)
{
'label': "{!! $model->labels[$i] !!}",
'value': {{ $model->values[$i] }},
},
@endfor
],
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,63 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'msarea',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'showValues': '0',
'showValues': '0',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'categories': [{
'category': [
@foreach($model->labels as $l)
{
'label': "{{ $l }}",
},
@endforeach
]
}],
'dataset': [
@for ($i = 0; $i < count($model->datasets); $i++)
{
'seriesname': "{{ $model->datasets[$i]['label'] }}",
@if($model->colors and count($model->colors) > $i)
'color': "{{ $model->colors[$i] }}",
@endif
'data': [
@foreach($model->datasets[$i]['values'] as $v)
{
'value': {{ $v }}
},
@endforeach
]
},
@endfor
]
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,62 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'mscolumn2d',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'rotatevalues': '1',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'categories': [{
'category': [
@foreach($model->labels as $l)
{
'label': "{{ $l }}",
},
@endforeach
]
}],
'dataset': [
@for ($i = 0; $i < count($model->datasets); $i++)
{
'seriesname': "{{ $model->datasets[$i]['label'] }}",
@if($model->colors and count($model->colors) > $i)
'color': "{{ $model->colors[$i] }}",
@endif
'data': [
@foreach($model->datasets[$i]['values'] as $v)
{
'value': {{ $v }}
},
@endforeach
]
},
@endfor
]
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,62 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'msline',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'bgColor': '#ffffff',
'borderAlpha': '20',
'canvasBorderAlpha': '0',
'usePlotGradientColor': '0',
'plotBorderAlpha': '10',
'rotatevalues': '1',
'valueFontColor': '#ffffff',
'showXAxisLine': '1',
'xAxisLineColor': '#999999',
'divlineColor': '#999999',
'divLineIsDashed': '1',
'showAlternateHGridColor': '0',
'subcaptionFontBold': '0',
'subcaptionFontSize': '14'
},
'categories': [{
'category': [
@foreach($model->labels as $l)
{
'label': "{{ $l }}",
},
@endforeach
]
}],
'dataset': [
@for ($i = 0; $i < count($model->datasets); $i++)
{
'seriesname': "{{ $model->datasets[$i]['label'] }}",
@if($model->colors and count($model->colors) > $i)
'color': "{{ $model->colors[$i] }}",
@endif
'data': [
@foreach($model->datasets[$i]['values'] as $v)
{
'value': {{ $v }}
},
@endforeach
]
},
@endfor
]
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,59 @@
<script type="text/javascript">
FusionCharts.ready(function () {
var {{ $model->id }} = new FusionCharts({
type: 'pie2d',
renderAt: "{{ $model->id }}",
@include('charts::_partials.dimension.js')
dataFormat: 'json',
dataSource: {
'chart': {
"exportenabled": "1",
"exportatclient": "1",
@if($model->title)
'caption': "{!! $model->title !!}",
@endif
'yAxisName': "{!! $model->element_label !!}",
'paletteColors': '#0075c2',
'bgColor': '#ffffff',
'showBorder': '0',
'use3DLighting': '0',
'showShadow': '0',
'enableSmartLabels': '1',
'startingAngle': '0',
'showPercentValues': '1',
'showPercentInTooltip': '0',
'decimals': '1',
'captionFontSize': '14',
'subcaptionFontSize': '14',
'subcaptionFontBold': '0',
'toolTipColor': '#ffffff',
'toolTipBorderThickness': '0',
'toolTipBgColor': '#000000',
'toolTipBgAlpha': '80',
'toolTipBorderRadius': '2',
'toolTipPadding': '5',
'showHoverEffect':'1',
'showLegend': '1',
'legendBgColor': '#ffffff',
'legendBorderAlpha': '0',
'legendShadow': '0',
'legendItemFontSize': '10',
'legendItemFontColor': '#666666'
},
'data': [
@for($i = 0; $i < count($model->values); $i++)
{
'label': "{!! $model->labels[$i] !!}",
'value': {{ $model->values[$i] }},
@if($model->colors)
'color': "{{ $model->colors[$i] }}",
@endif
},
@endfor
],
}
}).render()
});
</script>
@include('charts::_partials.container.div')

View File

@@ -0,0 +1,28 @@
<script type="text/javascript">
chart = google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['Element', "{!! $model->element_label !!}"],
@for ($i = 0; $i < count($model->values); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
legend: { position: 'top', alignment: 'end' }
};
var {{ $model->id }} = new google.visualization.AreaChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,43 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['', "{!! $model->element_label !!}",
@if($model->colors)
{ role: 'style' }
@endif
],
@for ($i = 0; $i < count($model->values); $i++)
[
"{!! $model->labels[$i] !!}", {{ $model->values[$i] }}
@if($model->colors)
,"{{ $model->colors[$i] }}"
@endif
],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
legend: { position: 'top', alignment: 'end' },
fontSize: 12,
@include('charts::google.titles')
@if($model->colors)
colors:[
@foreach($model->colors as $color)
"{{ $color}}",
@endforeach
],
@endif
};
var {{ $model->id }} = new google.visualization.ColumnChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,10 @@
@if($model->colors)
colors:[
@foreach($model->colors as $color)
"{{ $color }}",
@endforeach
],
@endif
@if($model->background_color)
backgroundColor: "{{ $model->background_color }}",
@endif

View File

@@ -0,0 +1,27 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['Element', 'Value'],
@for ($l = 0; $l < count($model->values); $l++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
pieHole: 0.4,
@include('charts::google.titles')
@include('charts::google.colors')
};
var {{ $model->id }} = new google.visualization.PieChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,74 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['Element', 'Value'],
["{!! $model->element_label !!}", {{ $model->values[0] }}],
])
var options = {
@include('charts::_partials.dimension.js')
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
min: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
max: {{ $max }},
@else
@php($max = 100)
@endif
@if($model->gauge_style == 'right')
// Calculate warning area
@php
$low_warning = round(0.40 * $max, 2)
$warning = round(0.25 * $max, 2)
$max_warning = round(0.10 * $max, 2)
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#e57373',
greenFrom: $low_warning, greenTo: $max,
yellowFrom: $max_warning, yellowTo: $low_warning,
redFrom: $min, redTo: $max_warning,
@elseif($model->gauge_style == 'center') {
// Calculate warning area
@php
$warning = round(0.25 * $max, 2)
$warning2 = round(0.75 * $max, 2)
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#ffd54f',
greenFrom: $warning, greenTo: $warning2,
yellowFrom: $min, yellowTo: $warning,
redFrom: $warning2, redTo: $max,
@else
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2)
$warning = round(0.75 * $max, 2)
$max_warning = round(0.90 * $max, 2)
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#e57373',
greenFrom: $min, greenTo: $low_warning,
yellowFrom: $low_warning, yellowTo: $max_warning,
redFrom: $max_warning, redTo: $max,
@endif
minorTicks: 10,
};
var {{ $model->id }} = new google.visualization.Gauge(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials/container.div-titled')
@endif

View File

@@ -0,0 +1,34 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['Country', "{!! $model->element_label !!}"],
@for ($i = 0; $i < count($model->values); $i++)
["{{ $model->labels[$i] }}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
colorAxis: {
colors: [
@if($model->colors and count($model->colors >= 2))
"{{ $model->colors[0] }}", "{{ $model->colors[1] }}"
@endif
]
},
region: "{{ $model->region ? $model->region : 'world' }}",
datalessRegionColor: "#e0e0e0",
defaultColor: "#607D8",
};
var {{ $model->id }} = new google.visualization.GeoChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials/container.div-titled')
@endif

View File

@@ -0,0 +1,29 @@
<script type="text/javascript">
chart = google.charts.setOnLoadCallback(drawChart)
function drawChart() {
var data = google.visualization.arrayToDataTable([
[
'Element', "{!! $model->element_label !!}"],
@for ($i = 0; $i < count($model->values); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
legend: { position: 'top', alignment: 'end' }
};
var chart = new google.visualization.LineChart(document.getElementById("{{ $model->id }}"))
chart.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,38 @@
<script type="text/javascript">
chart = google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
[
'Element',
@for ($i = 0; $i < count($model->datasets); $i++)
"{{ $model->datasets[$i]['label'] }}",
@endfor
],
@for($l = 0; $l < count($model->labels); $l++)
[
"{{ $model->labels[$l] }}",
@for ($i = 0; $i < count($model->datasets); $i++)
{{ $model->datasets[$i]['values'][$l] }},
@endfor
],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
legend: { position: 'top', alignment: 'end' }
};
var {{ $model->id }} = new google.visualization.AreaChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,38 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
[
'Element',
@for ($i = 0; $i < count($model->datasets); $i++)
"{{ $model->datasets[$i]['label'] }}",
@endfor
],
@for ($l = 0; $l < count($model->labels); $l++)
[
"{{ $model->labels[$l] }}",
@for ($i = 0; $i < count($model->datasets); $i++)
{{ $model->datasets[$i]['values'][$l] }},
@endfor
],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
legend: { position: 'top', alignment: 'end' },
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
};
var {{ $model->id }} = new google.visualization.ColumnChart(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,38 @@
<script type="text/javascript">
chart = google.charts.setOnLoadCallback(drawChart)
function drawChart() {
var data = google.visualization.arrayToDataTable([
[
'Element',
@for ($i = 0; $i < count($model->datasets); $i++)
"{{ $model->datasets[$i]['label'] }}",
@endfor
],
@for($l = 0; $l < count($model->labels); $l++)
[
"{{ $model->labels[$l] }}",
@for ($i = 0; $i < count($model->datasets); $i++)
{{ $model->datasets[$i]['values'][$l] }},
@endfor
],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
legend: { position: 'top', alignment: 'end' }
};
var chart = new google.visualization.LineChart(document.getElementById("{{ $model->id }}"))
chart.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,26 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(drawPieChart)
function drawPieChart() {
var data = google.visualization.arrayToDataTable([
['Element', 'Value'],
@for($i = 0; $i < count($model->values); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
};
var chart = new google.visualization.PieChart(document.getElementById("{{ $model->id }}"))
chart.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,84 @@
<script type="text/javascript">
google.charts.setOnLoadCallback(draw{{ $model->id }})
function draw{{ $model->id }}() {
var data = google.visualization.arrayToDataTable([
['Element', 'Value'],
@if($model->values)
["{!! $model->element_label !!}", {{ $model->values[0] }}],
@else
["{!! $model->element_label !!}", 0],
@endif
])
var options = {
@include('charts::_partials.dimension.js')
@if(count($model->values) >= 2 and $model->values[1] <= $model->values[0])
@php($min = $model->values[1])
min: {{ $min }},
@else
@php($min = 0)
@endif
@if(count($model->values) >= 3 and $model->values[2] >= $model->values[0])
@php($max = $model->values[2])
max: {{ $max }},
@else
@php($max = 100)
@endif
@if($model->gauge_style == 'right')
// Calculate warning area
@php
$low_warning = round(0.40 * $max, 2);
$warning = round(0.25 * $max, 2);
$max_warning = round(0.10 * $max, 2);
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#e57373',
greenFrom: {{ $low_warning }}, greenTo: {{ $max }},
yellowFrom: {{ $max_warning }}, yellowTo: {{ $low_warning }},
redFrom: {{ $min }}, redTo: {{ $max_warning }},
@elseif($model->gauge_style == 'center') {
// Calculate warning area
@php
$warning = round(0.25 * $max, 2);
$warning2 = round(0.75 * $max, 2);
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#ffd54f',
greenFrom: {{ $warning }}, greenTo: {{ $warning2 }},
yellowFrom: {{ $min }}, yellowTo: {{ $warning }},
redFrom: {{ $warning2 }}, redTo: {{ $max }},
@else
// Calculate warning area
@php
$low_warning = round(0.60 * $max, 2);
$warning = round(0.75 * $max, 2);
$max_warning = round(0.90 * $max, 2);
@endphp
greenColor: '#c8e6c9', yellowColor: '#ffd54f', redColor: '#e57373',
greenFrom: {{ $min }}, greenTo: {{ $low_warning }},
yellowFrom: {{ $low_warning }}, yellowTo: {{ $max_warning }},
redFrom: {{ $max_warning }}, redTo: {{ $max }},
@endif
minorTicks: 10,
};
var {{ $model->id }} = new google.visualization.Gauge(document.getElementById("{{ $model->id }}"))
{{ $model->id }}.draw(data, options)
setInterval(function() {
$.getJSON("{{ $model->url }}", function( jdata ) {
data.setValue(0, 1, jdata["{{ $model->value_name }}"])
{{ $model->id }}.draw(data, options)
})
}, {{ $model->interval }})
}
</script>
@if(!$model->customId)
@include('charts::_partials/container.div-titled')
@endif

View File

@@ -0,0 +1,33 @@
<script type="text/javascript">
chart = google.charts.setOnLoadCallback(drawChart)
function drawChart() {
var data = google.visualization.arrayToDataTable([
[
'Element', "{!! $model->element_label !!}"],
@for ($i = 0; $i < count($model->values); $i++)
["{!! $model->labels[$i] !!}", {{ $model->values[$i] }}],
@endfor
])
var options = {
@include('charts::_partials.dimension.js')
fontSize: 12,
@include('charts::google.titles')
@include('charts::google.colors')
@if(!$model->legend)
legend: null
@else
legend: { position: 'top', alignment: 'end' }
@endif
};
var chart = new google.visualization.ScatterChart(document.getElementById("{{ $model->id }}"))
chart.draw(data, options)
}
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,10 @@
@if($model->title)
title: "{!! $model->title !!}",
@endif
@if($model->x_axis_title)
hAxis: {title: "{{ $model->x_axis_title }}"},
@endif
@if($model->y_axis_title)
vAxis: {title: "{{ $model->y_axis_title }}"},
@endif

View File

@@ -0,0 +1,67 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
type: 'area',
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
xAxis: {
title: {
text: "{!! $model->x_axis_title !!}"
},
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
plotLines: [{
value: 0,
height: 0.5,
width: 1,
color: '#808080'
}]
},
@if($model->colors)
plotOptions: {
series: {
color: "{{ $model->colors[0] }}"
}
},
@endif
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [{
name: "{!! $model->element_label !!}",
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
]
}]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,66 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
colors: [
@foreach($model->colors as $c)
"{{ $c }}",
@endforeach
],
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'column'
},
@if($model->title)
title: {
text: "{!! $model->title !!}"
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
plotOptions: {
series: {
colorByPoint: true,
},
},
xAxis: {
title: {
text: "{!! $model->x_axis_title !!}"
},
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
},
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [{
name: "{!! $model->element_label !!}",
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
]
}]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,66 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
colors: [
@foreach($model->colors as $c)
"{{ $c }}",
@endforeach
],
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'pie'
},
@if($model->title)
title: {
text: "{!! $model->title !!}"
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
tooltip: {
pointFormat: '{point.y} <b>({point.percentage:.1f}%)</strong>'
},
plotOptions: {
pie: {
innerSize: '50%',
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</strong>: {point.y} ({point.percentage:.1f}%)',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
legend: {
@if(!$model->legend)
enabled: false
@endif
},
series: [{
colorByPoint: true,
data: [
@for ($l = 0; $l < count($model->values); $l++)
{
name: "{!! $model->labels[$l] !!}",
y: {{ $model->values[$l] }}
},
@endfor
]
}]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,71 @@
@php
// Get the max / min index
$max = 0;
$min = $model->values ? $model->values[0] : 0;
@endphp
@foreach($model->values as $dta)
@if($dta > $max)
@php($max = $dta)
@elseif($dta < $min)
@php($min = $dta)
@endif
@endforeach
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Map({
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}"
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
mapNavigation: {
enabled: true,
enableDoubleClickZoomTo: true
},
colorAxis: {
min: {{ $min }},
@if($model->colors and count($model->colors) >= 2)
minColor: "{{ $model->colors[0] }}",
@endif
max: {{ $max }},
@if($model->colors and count($model->colors) >= 2)
maxColor: "{{ $model->colors[1] }}",
@endif
},
series : [{
data : [
@for ($i = 0; $i < count($model->values); $i++)
{
'code': "{{ $model->labels[$i] }}",
'value': {{ $model->values[$i] }}
},
@endfor
],
mapData: Highcharts.maps['custom/world'],
joinBy: ['iso-a2', 'code'],
name: "{!! $model->element_label !!}",
states: {
hover: {
color: '#BADA55'
}
},
}]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,66 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
xAxis: {
title: {
text: "{{ $model->x_axis_title }}"
},
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
plotLines: [{
value: 0,
height: 0.5,
width: 1,
color: '#808080'
}]
},
@if($model->colors)
plotOptions: {
series: {
color: "{{ $model->colors[0] }}"
},
},
@endif
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [{
name: "{!! $model->element_label !!}",
data: [
@foreach($model->values as $dta)
{{ $dta }},
@endforeach
]
}]
});
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,58 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
type: 'area',
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
xAxis: {
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
},
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
name: "{!! $model->datasets[$i]['label'] !!}",
@if($model->colors && count($model->colors) > $i)
color: "{{ $model->colors[$i] }}",
@endif
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
]
},
@endfor
]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,67 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
type: 'areaspline',
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
xAxis: {
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
},
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
tooltip: {
shared: true,
valueSuffix: ' units'
},
plotOptions: {
areaspline: {
fillOpacity: 0.5
}
},
series: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
name: "{!! $model->datasets[$i]['label'] !!}",
@if($model->colors && count($model->colors) > $i)
color: "{{ $model->colors[$i] }}",
@endif
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
]
},
@endfor
]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,66 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'column'
},
@if($model->title)
title: {
text: "{!! $model->title !!}"
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
xAxis: {
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
],
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
},
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
name: "{!! $model->datasets[$i]['label'] !!}",
@if($model->colors && count($model->colors) > $i)
color: "{{ $model->colors[$i] }}",
@endif
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
]
},
@endfor
]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

View File

@@ -0,0 +1,57 @@
<script type="text/javascript">
$(function () {
var {{ $model->id }} = new Highcharts.Chart({
chart: {
renderTo: "{{ $model->id }}",
@include('charts::_partials.dimension.js2')
},
@if($model->title)
title: {
text: "{!! $model->title !!}",
x: -20 //center
},
@endif
@if(!$model->credits)
credits: {
enabled: false
},
@endif
xAxis: {
categories: [
@foreach($model->labels as $label)
"{!! $label !!}",
@endforeach
]
},
yAxis: {
title: {
text: "{!! $model->y_axis_title === null ? $model->element_label : $model->y_axis_title !!}"
},
},
legend: {
@if(!$model->legend)
enabled: false,
@endif
},
series: [
@for ($i = 0; $i < count($model->datasets); $i++)
{
name: "{!! $model->datasets[$i]['label'] !!}",
@if($model->colors && count($model->colors) > $i)
color: "{{ $model->colors[$i] }}",
@endif
data: [
@foreach($model->datasets[$i]['values'] as $dta)
{{ $dta }},
@endforeach
]
},
@endfor
]
})
});
</script>
@if(!$model->customId)
@include('charts::_partials.container.div')
@endif

Some files were not shown because too many files have changed in this diff Show More