Author Archives: Ian Harris

  • 0

FileMaker Portland – Integrating Web Services

Tags : 

Thank you to everyone who attended the January FileMaker Portland meetup. The evening was packed with presentations about how people are leveraging FileMaker 16’s JSON support to connect to web services.

Some of the integrations we discussed were:

  • Magento – This popular e-commerce platform has REST and SOAP APIs. Use them to connect data about products, customers, and orders to FileMaker.
  • SmartyStreets – Supercharge your address entry fields with five different APIs.
  • Google Charts – A Javascript library for creating interactive HTML5/SVG charts.
  • FileMaker – Why not the other way around? Make POST, GET, PUT, and DELETE calls to FileMaker using the Data API.

Have something you’d like to share or discuss with other FileMaker developers? Consider attending the next meetup.

  • 0

Generating Google Charts in Web Viewer

Tags : 

Google deprecated Google Image Charts in 2012. While that API can still be used to create charts with a URL, Google currently recommends that people use the similarly named Google Charts. This blog post will go over how to format data for the Google Charts library and generate a chart within a Web Viewer object.

Classic vs Material

Google Charts offers two versions: Classic and Material. The two versions differ in how charts look and feel, and how customization options are defined. Material charts are redesigns of core charts that follow Material Design guidelines. They offer marked style improvements over Classic charts, and will appear familiar to users of Google products. However, they are currently in beta and do not support all of the features of Classic charts. If you are having trouble implementing a Material chart, make sure that you are not trying to include an unsupported customization option by referencing the open Feature Parity issue.


When you need to use an option that is only available for Classic charts, you can still style your chart like a Material chart by including the “theme : material” option.




Information to be charted must be sent as a DataTable. The simplest approaches to generating DataTables within Web Viewer are by combining addColumn() and addRows(), or by using arrayToDataTable().

The addColumn() method requires either a type, or an object describing the column’s type and role. You can optionally pass labels as parameters as well.

In the example below, the x and y axes of a scatter plot are defined by calling data.addColumn(‘number’, ‘Revenue’) and data.addColumn(‘number’, ‘Gross Margin’). The third column is a tooltip, which displays when a user hovers over a datapoint.

Material-Themed Scatter Chart


The addRows() method accepts a nested array as a parameter. In the above example, a FileMaker script was used to assign a list of arrays to global variable $$A. When inspected using Data Viewer, $$A looks like this:


While these two methods do the job, if you are adding more than a few columns it will likely be more helpful to use arrayToDataTable(). This method converts a nested array to a DataTable and can infer the data types of each column, meaning you do not need to manually define them using addColumn().

Material Bar Chart


The global variable $$B referenced in the above code was generated using a FileMaker script and looks like this:

Trying It Out

  1. Add a Web Viewer object to a layout and open Web Viewer Setup. Set the website to Custom Web Address and select Specify…
  2. Begin your calculation with the following line: “data:text/html;charset=UTF-8,” & “
  3. Prepare your own html code or sample code from Google’s Chart Gallery in a text editor. Specifically, replace any double quotes within the html with single quotation marks. This makes inserting FileMaker variables and fields into html code easier, since you can define a block of html between double quotes, concatenate a variable or field, then concatenate another block of html between another pair of double quotes.
  4. Following the quotation mark, paste in the prepared html code.
  5. End your calculation with a double quotation mark.


If you’re interested in integrating Google Charts within a FileMaker solution but could use some more guidance, please feel free to contact us. We have experience with various web services, and have even created a free downloadable FileMaker module, fmMapping, using the Google Maps API.

  • 0

FileMaker Portland – Holiday Potluck

Tags : 

FileMaker Portland would like to thank everyone who feasted at our Holiday Potluck. Plates were stacked high with homemade chili and cornbread, smoked salmon, and three types of sandwiches from Lardo. In between bites, revelers discussed all things FileMaker and toured our new office.

Interested in joining us at our next event? Check out the FileMaker Portland meetup page for more information.

  • 0

Have You Been Wingdinged?

Tags : 


Have your FileMaker layouts miraculously transformed into a collection of nonsensical symbols? Does your data resemble a prehistoric cave painting? If so, you’ve likely been wingdinged. Due to a known FileMaker bug affecting Windows computers running Adobe products, fonts can be replaced with a dingbat-style temporary font. Before translating your application character by character, try following these steps for a quick fix.

The Simple Solution

First close FileMaker completely, then close any open Adobe programs. Next, reopen FileMaker before reopening your Adobe programs. Your FileMaker fonts should now have returned to normal.

Other Things to Try

Keeping Adobe products up to date can potentially help mitigate font-related issues. To make sure you’re running the latest available version, open your Adobe program, choose the Help menu, then select Check for Updates.

There are a few advanced troubleshooting steps available if neither restarting your programs nor updating Adobe restored your FileMaker layouts to normal. Take care while attempting these fixes, as deleting the wrong file can lead to more headaches.

Delete the file “fntcache.dat” located within the C:\Windows\System32 folder, then restart your computer. Your operating system temporarily saves font data to this file. Deleting it and rebooting forces your computer to recreate it, hopefully clearing away any corrupt data.

Close any open Adobe programs, then delete the folder “acrord32_sbx” located within the C:\Users\\AppData\Local\Temp folder. Adobe programs save temporary files to this folder. Recreating it has been known to resolve various Adobe issues.

Hopefully these troubleshooting tips have brought your FileMaker application back from wingdingland. If you’re still running into issues, it may be time to bring in one of our experienced developers to help get things working again. We’re always happy to help, so feel free to contact us!