Charting Options in FileMaker Pro

May 08, 2021
William Miller
FileMaker Pro Charting Options

Dashboard systems to visualize your data in FileMaker Pro

It used to be that in the “old” days of FileMaker, if you want to present a chart, you only had access to FileMaker’s internal charting options. But now, you have three choices.

First, you can use FileMaker’s internal charting options

These have been around forever, but here are some of your options. You have ten choices for how to display your data: bar chart, stacked bar chart, column, stacked column, positive/negative column, line, area, scatter, and bubble chart. All quite adequate for the job. You have limited control over color palettes, and presentation of legends, and display of data on each section of the chart, as well as x-, or y-axis lines.

There are three ways to pull the data from your system:
1. Use the current found set
2. Use delimited data from a field in the current record
3. Use related records

FileMaker’s internal charts are functional, and have been serving their purpose for years. But they are pretty basic compared to other options out there today.

Second, you can use JavaScript charts in FileMaker

These are much more interesting. They are harder to set up, but the level of usefulness vastly improves, as well as client satisfaction, in our experience.

JavaScript charts use FileMaker’s web viewer to display their data. In most cases, they are not pulling data from across the web, but instead the web viewer is pointed to data within the FileMaker file itself. In order to build a JavaScript chart from within FileMaker, you will need to first find the JS library which you want to use. That is then placed inside of FileMaker into, usually, the table you wish to display from. There are often several libraries and helper files needed to display the data, such as a JavaScript library, maybe a CSS file, and an HTML file.

Then in order to display the actual data, you will need to substitute into key spots in the JavaScript pointers to the data you want to show.

The result is a dynamic, colorful, and interactive chart which beautifully displays your business data in a very visual way. Some libraries will allow you to alter the chart display on the fly. For example, if you have a bar chart showing data from four different territories, but want to exclude one to see the percentages of just three territories, you can just click on the legend to remove a desired set of data, and the pie chart will reformat into just three sections. It is a very pleasing effect, with a bit of animation to show the change.

So, for all the work involved in setting it up, JavaScript charts are the way to go with FileMaker.

And Claris corp must have thought so as well, because the third option for presenting charts from FileMaker, also involves JavaScript.

Third, you can use the new Add-ons feature available in FileMaker 19.

When in Layout Mode in FileMaker, one could choose the left panel display to show Objects and Fields. Now a third option has been added; you can choose “Add-ons”. To include an Add-on into your solution, there is a plus (+) button in the lower left corner of the Add-ons panel.

Click on that plus button, and you will be presented with a bunch of the new Add-on choices. Currently they are all listed as having been created by Claris, but I expect that will change. In fact, there is a note in the Add-ons library, which says that if you want more choices, to go to the Claris Marketplace to find more.

Add-on Library options

See the pic above. You will note that “Simple Chart” is selected. The panel on the right now shows a description of what this chart does. “Simple Chart. Quickly create a visually rich, interactive chart. Created by Claris.” Then it lists the Tables and Layouts which you receive when you add this chart to your solution.

And when you dig into the details of it, you discover that it, too, is a JavaScript chart. When you choose to add it into your solution, then after a moment, the “Simple Chart” will appear on the left-hand panel, under a heading of “JavaScript”. At this point, you can just drag it into a layout of your choice. When you do, a web viewer will appear, with all the code to point to the JavaScript libraries to display this chart.

It takes some tinkering then to set up your solution to display the data, but when you do, it is really cool!

So, you now have three options for displaying charts in FileMaker. You can use the tried and true internal FileMaker charts, which are easy to setup, but not very configurable. Or you can choose either of two options using JavaScript charts. Either you can make your own, and install your own JavaScript libraries, and go through all the work to set it up, or you can use the Add-ons Simple Chart feature in FileMaker.

Whichever you choose, know that adding a visualization of your data to a FileMaker solution, almost always enhances its appeal and usability for the average user. Your solution will be more user-friendly and visually appealing. Your users will find it more enjoyable to interact with your solution, and the world will be just a bit prettier than before!