Great Looking jQuery Charts in FileMaker

For the more adventurous developers out there, Aaron Giard brings the fourth in his series on using jQuery inside a FileMaker webviewer to build and display charts.  But don’t be intimidated!  Using jQuery for charts can be broken down into a discrete set of actions:

  1. Download the Chart.js library from Github (there is a zip download button on the right about half way down)–all of the charts types are in there
  2. Open one of the sample files with a text editor like TextWrangler
  3. Put FileMaker merge fields in the proper spots of the html code
  4. Copy the html into a text field in FileMaker, put it on a layout, and give it an object name
  5. Reference the object in a webviewer on a layout

Aaron gives the details in the article:

FileMaker provides us with many great tools for reporting purposes. One of these tools is charting capabilities. FileMaker’s built in charting can be very useful for displaying a variety of analytics, but sometimes you run across a situation where you need just a bit more than what FileMaker offers. This is where using jQuery in FileMaker can be your best friend.

In this post I will illustrate a technique that will allow for much more advanced charting in FileMaker. By using the techniques I’ve outlined in past posts in this series, we will create animated jQuery charts that can display multiple data sets in the same chart as well as having a choice of various chart types.

I am a big fan of Chart.js ( It is a jQuery based charting plug-in for creating animated jQuery charts of many sorts including bar, doughnut, line, pie, polar area and radar charts. It’s extremely versatile, easy to implement and fully customizeable.

Now, let’s get into the nitty gritty…

There are others using Javascript in the FileMaker community, and most follow a series of steps similar to what is described above.  Find the already written code and integrate it into FileMaker using a series of straightforward steps.

Give it a try before the need arises and see if it works for you.

More…Using jQuery in FileMaker – Part 4 – The Scarpetta Group, Inc..

Liked Liked
Need FileMaker Development Help? Or to purchase FileMaker Software?
Contact FM Pro Gurus for help