We are happy to announce and explain you how to use Database Chart Builder in QuintaDB. You can create and integrate charts based on your online database in QuintaDB. Available chart types: Lines and Splines, Sparklines, Vertical bar and grouped vertical bar, Pie chart and Scatter plot chart, Horizontal bar and grouped horizontal bar. Also you can Print your chart and Download the chart as a PNG, JPEG image or a PDF document, even as a SVG vector image.

Below you can see several examples of charts. In this blog post we'll explain how this charts were created and you'll be able to generate the same chart in a few minutes easily!

Splines and Sparklines charts

Vertical bar and grouped vertical bar

Pie chart and Scatter plot chart

Horizontal bar and grouped horizontal bar

Lines chart - in orange you can see chart elements explanations. For example, you can see where the chart name is located, you can see X Axis and Y Axis, where X Axis was taken from QuintaDB database, as well as Income, Spent and Net lines. Clicking on the line name at the bottom will enable/disable line. And what is very important and interesting is that you can Print as well as Export (Download) your chart as a PNG or JPEG image, also as a PDF document or SVG vector image.

Create Database for Chart Demo

First of all you'll need to create and fill your database with some data in order to be able to work with Charts.

We've created the Charts database with the Income form. Our form contains a Date field, Income and Spent number fields and a Net Formula field. Net is Income minus Spent. We've added five records. Once you've built your database and filled it you can click on the Charts menu.  

On the charts page you can add unlimited number of charts for all account types.  Clicking on the chart name will actually open the Edit Chart form.

 Click on the Edit Chart in order to start editing your chart. You can always delete your chart using a delete icon at the right.  

If you open the chart page, by clicking on Edit Chart link you'll see all available chart settings. See below how you can change the chart name and select different available chart types, such as Lines and Splines, Sparklines, Vertical bar and grouped vertical bar, Pie chart and Scatter plot chart, Horizontal bar and grouped horizontal bar. When you hover on the chart image you can see this chart name and clicking on this image will actually update the chart type. The page will be refreshed and you'll see your chart at the bottom of the page.  

The next important step is to add data source. You can select only one data set for pie charts and as many as you need for all other chart types. First of all you should select Table or View as a data source. Please, notice that you can select from all database tables and this tables views. Once you've made your choice you need to select this table column. Select the Number or Formula column. The line label will be a Table column name, but you can always change it using a Label text field. Also, please, make sure to select Line color using Color control. Click on 'Save' to add a data set, click on 'Add another data source' to add another database column to the chart.  

You can also update Y axis label and set Y axis min and max values.

For X Axis you can select a Default range, - from 0 to 100; auto range - from min to max. You can set From and To values with any interval. You may want to just enter the list of values using a pipe as a delimeter. But most probably you'll want to use your database column for fetching X axis values. You can do it in the same way you did it while selecting data sources for Y axis. Click on Update to save your X asix settings.  

 At the bottom you can change the chart sizes by setting width and height in pixels. And finally you can find an iframe code for your chart and direct link. Use the iframe code if you want to integrate the chart directly to your web page. Or just use a direct link if you want to email this link or show it to your friends.

Hope you'll find the Database Charts Builder useful, enjoy!