This topic is locked

AnyChart, an extraordinary plugin from PHPRunner

12/2/2020 5:53:11 AM
PHPRunner Tips and Tricks
fhumanes author


I have already commented on it on other occasions. I think that in general, we do not exploit the capacity that PHPRunner offers us with AnyChart, especially when the AnyChart license that enables us to acquire PHPRunner is complete, including support from the manufacturer.
Also, as I mentioned, the AnyChart PHPRunner integration is very easy to use, I think it is made so that beginners of the product are able to exploit several of its features, but that there is a "world to inspect and show" using this product.
To expand the ability to use AnyChart by PHPRunner I have made a plugin and defined a working method that makes, from my point of view, very easy to use and above all, to be able to use very easily, all the documentation available AnyChart on your portal and apply it directly to our projects.
So, this project that I show you and provide you with, aims to:

  • Create multiple charts, all of them done with the new plugin.
  • Create charts that would have been impossible with the standard PHPRunner integration.
  • Combine the graphics in "Dashboard" pages, to show the potential of PHPRunner to make "Dashboards".
  • Use a thematic map, AnyMap product, which also offers us the product license.


To do the example I have used the data that I have from the Elections of the Community of Madrid. For non-Spanish. Spain is divided into 17 Autonomous Communities and these have one or more provinces. The provinces are divided into administrative units that are the Municipalities. These Municipalities are in turn divided into Districts.
The objective of the example is not to show the Elections data, but to have a series of (real) examples that serve to analyze and learn how to exploit the potential of AnyChart. Election results are public and more or less, everyone understands them, and, in one way or another, we have all participated in electoral processes.
The interface and data is in Spanish, but I insist that the objective is not the data, but how the graphs are built and have examples for when we make ours.
DEMO: https://fhumanes.com/elecciones/
Technical aspects
I show one of the pages of the application. It will help me to explain some characteristics that you will be able to see in code.


(1) and (2) .- We see that the data is dependent on 2 filter panels. As you know, in PHPRunner it can only be made dependent on a filter panel, then. How has it been resolved?
What I have done is that the panel (2) depends on (1), but in the panel (2) I have made a "JOIN" between the tables of the panel (1) and the panel (2). As it is filtered, the data in the panel table only appears once (2). This helps me so that the rest of the information is dependent on the filter of (2) that already has the key of (1) and that of (2).
(3) .- As this set of pages shows the data of the selection and compares it with the previous call, the SQL of this table is built dynamically.
(4) .- The panel names can be customized using the {% master.field} syntax, referring to the fields of the filter or master table.
(5) .- The graph does not report all the applications, it only informs us of the 6 main ones (the number is defined in an application parameter set in the "After application initialized" event). The rest of the applications that are not shown are grouped into an item called "Rest".
(6) .- This panel has special aspects. I want to highlight how, part of the header of the "grid" is variable depending on the call. In the event "Before SQL Query" these values ​​are calculated and stored in session variables to be used in both "snnipet" to create the header of the "grid"
Another aspect that I have also changed is the operation of the general search box. In this case I have made that in the event that the conditions do not give any record, the conditions are not taken into account and all are displayed. It is important because if there is no information in the filters, the rest of the panels come out empty or give an error.


This page shows a "semidonut" chart that does not actually exist in AnyChart. AnyChart support staff helped me create it using a "donut" graphic and shift it 50%, so that it does not appear on the screen, generating this graphic that is used to represent the deputies' hemicycles.


This is the result of using an "AnyMap" extension. You can see that the panel with the legend of the candidacies and their colors is a PHPRunner panel, it is to facilitate the reading of the map.
The map of the Municipalities of the Community of Madrid has been obtained by following the explanations on the AnyChart website and it is the hardest thing to find. In Europe, lately it is very common for governments to provide this type of information on their "Open Data" or Open Data pages. If your companies have a GIS Unit "Geographic Information System" they will give it to you without problem, because the format (GEO-JSON) is one of the most widely used standards.


The main entities of the model are these. The Database has more information, much of it is not used in this example.
All the graphics in the example are equally important, therefore, I am not going to review any in the article and to see them you will have to download the project.
I hope you like it and that ALL your applications are designed and have a dashboard with graphs and indicators of the evolution of your systems.
As always, you can ask me what you need in my email account [email="fernandohumanes@gmail.com"]fernandohumanes@gmail.comEmail me[/email]
I leave you, in my portal, in attached files, the project and the backup of the Database, so that you can install it on your computers.
You need the plugins of:

  • Anychart
  • Colors