| {% extends sonata_block.templates.block_base %} | |
| {% block block %} | |
| <script src="//code.highcharts.com/4.0.1/highcharts.js"></script> | |
| <script src="//code.highcharts.com/4.0.1/modules/exporting.js"></script> | |
| <div class="box box-primary"> | |
| <div class="box-body with-border" style="height: 410px"> | |
| <div class="col-md-10 chart"> | |
| <script type="text/javascript">{{ chart(chart.chart) }}</script> | |
| <div id="{{ chart.div }}" style="min-width: 400px; height: 400px; margin: 0 auto"></div> | |
| </div> | |
| </div> | |
| </div> | |
| {% endblock %} |
| sonata_block: | |
| default_contexts: [cms] | |
| blocks: | |
| #other blocks | |
| admin.block.service.registrations_chart: #This is the chart block - RegistrationsChartBlockService (below) | |
| contexts: [admin] | |
| sonata_admin: | |
| #other config | |
| blocks: #config for a statistics block (this is included in Sonata Admin 2.4) | |
| - | |
| class: col-lg-3 col-xs-6 | |
| position: top | |
| type: sonata.admin.block.stats | |
| settings: | |
| code: admin.admin.incident | |
| icon: fa-exclamation-triangle | |
| text: Open Incidents | |
| color: bg-red | |
| filters: | |
| open: { value: true } | |
| #Other stats blocks... | |
SonataAdminBundle with charts and statistics blocks
Here's a quick overview of how we built the chart blocks for the [Hilenium] (http://hilenium.com) admin backend dashboard.
Requirements
| namespace AdminBundle\Block\Service; | |
| use Sonata\BlockBundle\Block\BlockContextInterface; | |
| use Symfony\Component\HttpFoundation\Response; | |
| use Sonata\AdminBundle\Form\FormMapper; | |
| use Sonata\CoreBundle\Validator\ErrorElement; | |
| use Sonata\BlockBundle\Model\BlockInterface; | |
| use Sonata\BlockBundle\Block\BaseBlockService; | |
| use Symfony\Component\OptionsResolver\OptionsResolverInterface; | |
| class RegistrationsChartBlockService extends AbstractChartService | |
| { | |
| //Services are injected in the abstract class | |
| //Register class as a service in the container e.g. admin.block.service.registrations_chart | |
| //$chartbuilder is a service that has our default chart configuration, which in turn uses the ObHighCharts bundle to render the charts. | |
| /** | |
| * {@inheritdoc} | |
| */ | |
| public function execute(BlockContextInterface $blockContext, Response $response = null) | |
| { | |
| $end = new \DateTime(); | |
| $start = new \DateTime('7 days ago'); | |
| $chart = $this->chartBuilder->getRegistrationsChart($start, $end); | |
| return $this->renderResponse($blockContext->getTemplate(), array( | |
| 'chart' => $chart, | |
| 'block' => $blockContext->getBlock(), | |
| 'settings' => $blockContext->getSettings(), | |
| ), $response); | |
| } | |
| /** | |
| * {@inheritdoc} | |
| */ | |
| public function getName() | |
| { | |
| return 'Registration Chart'; | |
| } | |
| /** | |
| * {@inheritdoc} | |
| */ | |
| public function setDefaultSettings(OptionsResolverInterface $resolver) | |
| { | |
| $resolver->setDefaults(array( | |
| 'title' => 'Registrations', | |
| 'summaries' => false, | |
| 'template' => 'AdminBundle:Block:chart_block_single.html.twig', | |
| )); | |
| } | |
| } |