How to install and configure Dashboard Builder
This comprehensive document provides a step-by-step guide on installing Dashboard Builder on your server, empowering you to set up your data visualization platform effortlessly. Additionally, the document offers detailed instructions on creating charts, establishing database connections, retrieving data from various source like Excel, JSON and Google Sheets, and generating source code. Explore the full potential of Dashboard Builder with ease using this comprehensive resource.
Contents
Answer
Requirements
- PHP Version 7.1 or later
- Apache 2 or later, Nginx or any other server that supports PHP.
- Windows 7 or later /Linux 3 or later/Ubuntu or any other platforms support Apache, Nginx etc
- Firefox 52, Chrome 57, IE 8, or any other browser that supports SVG
- allow_url_fopen is enable e.g
allow_url_fopen = On
in php.ini - SimpleXML extension is installed and enabled
- OpenSSL extension is installed and enabled
- PDO drivers such as MySQL and SQLite are installed
- Read-Write permission to folders and sub-folders of dashboardbuilder i.e
chmod -R 774 dashbboardbuilder-v3-FREE
Additional
Answer
Installation
- Download from https://dashboardbuilder.net
- Place the file in a directory on the web server. e.g. “…/www/dashboardbuilder/”
- Unzip the file using Extract Here option to the root folder of "dashboardbuilder"
Answer
Create your first Dashboard
- Access the web folder in your browser. e.g. http://localhost/dashboarduiler following welcome screen will appear
Answer
Select the database as data source:
Click the database icon
Now, select the database from the data source settings..
Enter your host name, username, password and database name as mentioned in the screen
Answer
Click the database icon
Now, select upload from the data source settings. XLSX, XLS or CSV can also be used as data source
Answer
Publish to the web
Before going to the next step, make sure that your Google sheet is published to the web:
Step-1: Go to your My Driver folder and right click on the spreadsheet you want to access. Click File and click "Publish to the web" .
Step-2: Select your desired Sheet and "Comma-separated values (csv)" from the dropdown.
Hit the publish button.
Step-3: Copy the link on the following screen.
Connecting Google Shee with the Dashboard Builder
Step-1: Click the Database icon
Step-2: Now, paste the link of your Google sheet.
Answer
Click the Database icon
In the data source setting, click the File Tab and enter the full URL address of your JSON file and hit the Save button
Answer
Select the gear icon for your Chart preference. The following screen will appear
SQL statement format
Enter your SQL statement in SQL field
SELECT sum(salary) as xaxis, DATE_FORMAT(from_date, '%Y/%m') as yaxis FROM salaries GROUP BY DATE_FORMAT(from_date, '%Y/%m') LIMIT 10
Select your Trace data for X as 'xaxis' and data for Y as 'yaxis' as mentioned above.
Click the SQL sign if you want to add more SQL statement
Select your desired table and click Run Query button
Select your Chart Type, Trace and its Properties.
Click Save Changes when you finish
Answer
Preview:
In the main screen, click Save Changes , Charts will be appeared on the screen as shown below.
Answer
Adjust size and position:
To adjust the size and position of your Chart Panel by dragging it's corner
Answer
Save Data:
Click Save button. The following screen will appear. Give a name to your file and click Save button.
Answer
New Dashboard
Click New button. The following screen will appear. Now click Yes.
Answer
Open an Existing Dashboard
Click Open button. The foloowing screen will appear. Select your file from the given list
Answer
Generate a PHP Code
Click Generate button
The following screen will appear with PHP code
Click the Copy+Paste button to copy the code and paste it into your PHP application
You also need to copy the required API file/folder i.e 'inc/dashboard_dist.php' and 'assets/js/dashboard.min.js' to the folder where your application is running.
Answer
Add a dropdown filter to a chart
This feature is availalbe in 3.8 or later version of Dashboard Builder
Step -1 : Add a new Trace
Step -2 : Select your chart type and data for X and Y axis for Trace 2
Step -3 : Click “Show” button
Drop down filter will appear