fnGoogleLineChart ( chtitle ; xtitle ; ytitle ; xfield ; yfield ; color )

Extremely simple line chart solution using a web viewer and Google API

  Average rating: 4.3 (38 votes) Log in to vote

Jeremy Upton DME Supply Group http://www.dmesupplygroup.com

  Function definition: (Copy & paste into FileMaker's Edit Custom Function window)

Use this function to define a custom web viewer within Filemaker Pro. The function utilizes Google API to create a simple X,Y axis line graph. The chart is limited to a single line. Basic knowledge of Google API will be needed if you intend to modify the function.

In the example above, a database with 4 records in the found set containing the following data:

[Date: 3/10, 3/11, 3/12, 3/13] & [Sales: 511, 446, 230, 667]

Would produce the following URL (copy/paste into your web browser to view the resulting chart):

http://chart.apis.google.com/chart?cht=lc&chs=737x381&chtt=Sales Chart&chxt=x,x,y,y&chxl=0:|3/10/2010|3/11/2010|3/12/2010|3/13/2010|1:|Date|2:||66.7|133.4|200.1|266.8|333.5|400.2|466.9|533.6|600.3|667|3:|Sales&chxp=1,50|3,50&chd=t:511,446,230,667&chds=0,667&chg=0,10&chco=0000FF

How to use it:

1) The web viewer object must be named “linechart.” (View -> Object Info)

2) The chart will auto-scale to the dimensions of the web viewer, however Google does not allow charts larger than 300,000 pixels. So a chart sized 500x600 pixels is fine, but 550x600 will not work.

3) You are able to provide a main title for the chart as well as titles for both the X and Y axis. If you do not want anything in those positions simply input “” for these variables.

4) The X Axis. The values for this axis are passed in the order that they are created. So if the 4 records in the example were created in reverse order starting with 3/13, the graph would read 3/13 -> 3/12 -> 3/11 -> 3/10 (left to right). Keep this in mind if you need these values to show up in a particular order.

5) The Y Axis. These values must be numerical. The graph will auto-scale using the highest value passed as the top value on the chart. The numbers that actually appear along the Y axis will be the regular intervals between 0 and the highest number passed.

6) The last variable “color” will accept the hexadecimal value for the desired color of the line.

7) In order for the chart to show multiple records it must grab the data from a related table. Otherwise it will only show data from the current record.

NOTICE: Because of chart size limitation it is possible to overcrowd the values along the X axis. It is best to try to limit the number of characters used for those values.

This is my first attempt at making an easy-to-use chart solution. I am eager for feedback on how it can be improved or simplified.

Comments

		Mike B., Columbus Ohio Oct 29, 2012
Appears to not be working now. Get the following errors from google: 400. That’s an error. Your client has issued a malformed or illegal request. •The parameter 'chd=t:?' does not match the expected format. •The parameter 'chds=0,?' does not match the expected format. •The parameter 'chs=-100x-50' does not match the expected format. •The parameter 'chs' must have a width of at least 1 pixel. That’s all we know.

Log in to post comments.

Note: these functions are not guaranteed or supported by BrianDunning.com. Please contact the individual developer with any questions or problems.

Support this website.

This library has been a free commmunity resource for FileMaker users and developers for 20 years. It receives no funding and has no advertisements. If it has helped you out, I'd really appreciate it if you could contribute whatever you think it's worth: