venca-x / nette-highcharts
Nette addon. Generator Highcharts chart
v1.0.0
2017-10-27 14:02 UTC
Requires (Dev)
- nette/tester: ^2.0
This package is auto-updated.
Last update: 2024-11-07 05:13:10 UTC
README
Simple highcharts graph generator for Nette
Installation
install with composer:
composer require venca-x/nette-highcharts:dev-master
For Nette 3.0 use (minimum version php 7.1):
composer require venca-x/nette-highcharts:dev-master
For below Nette 3.0 use:
composer require venca-x/nette-highcharts:dev-master#v1.0.0
Usage Sample
Presenter
//////////////////////////////////////////////////////////////////////// $basicColumn = new VencaX\Highchart\samples\BasicColumn(); $highcharts = new VencaX\Highchart\Highchart( $basicColumn->sample() ); $this->template->basicColumn = $highcharts->render( "basic-column" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $basicBar = new VencaX\Highchart\samples\BasicBar(); $highcharts = new VencaX\Highchart\Highchart( $basicBar->sample() ); $this->template->basicBar = $highcharts->render( "basic-bar" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $stackedBar = new VencaX\Highchart\samples\StackedBar(); $highcharts = new VencaX\Highchart\Highchart( $stackedBar->sample() ); $this->template->stackedBar = $highcharts->render( "stacked-bar" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $tempChart = new VencaX\Highchart\samples\TempChart(); $highcharts = new VencaX\Highchart\Highchart( $tempChart->sample() ); $this->template->tempChart = $highcharts->render( "temp-chart" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $trafficChart = new VencaX\Highchart\samples\TrafficChart(); $highcharts = new VencaX\Highchart\Highchart( $trafficChart->sample() ); $this->template->trafficChart = $highcharts->render( "traffic-chart" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $basicLine = new VencaX\Highchart\samples\BasicLine(); $highcharts = new VencaX\Highchart\Highchart( $basicLine->sample() ); $this->template->basicLine = $highcharts->render( "basic-line" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $pieChart = new VencaX\Highchart\samples\PieChart(); $highcharts = new VencaX\Highchart\Highchart( $pieChart->sample() ); $this->template->pieChart = $highcharts->render( "pie-chart" ); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// $columnRotatedLabelsChart = new VencaX\Highchart\samples\ColumnRotatedLabels(); $highcharts = new VencaX\Highchart\Highchart( $columnRotatedLabelsChart->sample() ); $this->template->columnRotatedLabelsChart = $highcharts->render( "column-rotated-labels" ); ////////////////////////////////////////////////////////////////////////
{block content} basic-column<br/> <div id="basic-column" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> basic-bar<br/> <div id="basic-bar" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> stacked-bar<br/> <div id="stacked-bar" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> temp-chart<br/> <div id="temp-chart" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> traffic-chart<br/> <div id="traffic-chart" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> basic-line<br/> <div id="basic-line" style="min-width: 310px; height: 400px; margin: 0 auto"></div><br/> pie-chart<br/> <div id="pie-chart" style="min-width: 310px; height: 400px; margin: 0 auto"></div> Column Rotated Labels<br/> <div id="column-rotated-labels" style="min-width: 310px; height: 400px; margin: 0 auto"></div> {/block} {#scripts} <script src="https://code.highcharts.com/highcharts.js"></script> <script type="text/javascript"> $(function () { {$basicColumn|noescape} {$basicBar|noescape} {$stackedBar|noescape} {$tempChart|noescape} {$trafficChart|noescape} {$basicLine|noescape} {$pieChart|noescape} {$columnRotatedLabelsChart|noescape} }); </script> {/#}