The Art of Joomla

Tutorials by Andrew Eddie for Joomla!® developers, site implementers and artisans - twittergoogle+ • facebook

Quanta uses Open Flash Charts 2 as the basic for displaying graphs and the flash object uses code to control how the charts display.  The format of the code is called JSON and there are lots of examples on the Open Flash Charts site.

Adding and Displaying the Sample Data

When you first install Quanta, there is no data to display.

We've provided some sample data just to give you a taste of the type of charts that Quanta can display before you start creating your own records and historic data.  With Charts selected in the Quanta Linkbar, click on the Add Sample Data link at the bottom of that page.

Screenshot

The page will return and you will see a few varieties of different charts.  Each chart is in the Samples category which has also been created for you.

Add the Chart List to the Menu

One of the views that you can add to the menu is the Charts view.  This will display a paginated list of the available hand-coded charts.

To do this, go to the menu that you want to add the menu item to.  Click New in the Toolbar.

 

Select Quanta from the list then Charts Default View.  Give the menu a title and adjust the other fields as desired for your site.  Save the menu item as you normally would.

Turn to the frontend of your web site and click the new menu link.

 

Add a Chart to the Menu

The other view that you can add to the menu is the Chart view.  This will display a single chart on the selected page.

To do this, go to the menu that you want to add the menu item to.  Click New in the Toolbar as before.

Select Quanta from the list then Chart Default View.  Give the menu a title and adjust the other fields as desired for your site.  In the Basic Parameters area, click the Select button.

Screenshot

This will bring up a list of the charts the you have defined.  Click on the name of one of the charts.  Save the menu item as you normally would.

Turn to the frontend of your web site and click the new menu link.

Screenshot

The chart will display providing there are no .

Adding a New Chart

To add a new hand-coded chart, click Charts in the Quanta Linkbar, then click New in the Toolbar.

Screenshot

The following fields are available:

Title Block

  • Title - The title of the chart.
  • Alias - The text to be used in the URL when SEF URL's are in use.
  • Category - An optional category for the chart.

Chart Tab

  • Flash Library Version - there are a number of version of the flash library to choose from.  Use the default unless you want to use specific features from other third-party builds of Open Flash Charts.
  • Chart Width - The width of the chart in pixels.
  • Chart Height - The height of the chart in pixels.
  • Published - The published state of the chart.
  • Access - The access level for users that can view the chart.
  • Code - The JSON code that will produce the chart.

Should you wish to learn more about the code behind the charts, refer the the examples on the Open Flash Charts web site.

Content Tab

  • Description - An optional description to display with the chart.
  • Meta Description - The description to provide in the metadata of the HTML page when the chart is displayed.
  • Meta Keywords - The comma-separated keywords or phrases to provide in the metadata of the HTML page when the chart is displayed.

Save the chart when you have completed the desired fields.

If you find any this extension useful, please consider paying us forward (not paying us back) by supporting one of our nominated charities Kiva.org or World Hope Australia and help fight world poverty! Let us know if you do.