Insert a Graph

June 21, 2011 ·
Knowledge Base → Reports and Templates → Reports, Graphs and Statistics → Insert a Graph

Contents

You may display a graph of the results of a form on any page, post, custom display, or form. To see what your graph options are, go into your form and click on “Reports”.

Usage

Insert the following shortcode on any page, post, custom display, or inside an HTML field in a form.

[frm-graph id=x]

‘x’ = ID of the field you would like to display in a graph

Parameters

Required

  • id – The field ID. You can put multiple field IDs in a comma separated list. This will display a separate graph for each field ID. Example: [frm-graph id=2,5,6].

Optional

  • ids – Add additional fields into the same graph. Example:[frm-graph id=20 ids=25,26,27 data_type=total]
  • type – Change the graph type to pie, bar, line, or area. The default graph will either be a pie chart or a bar graph depending on the field type used. Example: [frm-graph id=866 type=pie]
  • x_axis – Define the x-axis with the ID of a second field. The two fields MUST be in the same form. The x_axis parameter can also use “created_at” or “updated_at”. Example: [frm-graph id=20 x_axis=25 data_type=total]
    • x_start – Define the minimum value of the x-axis. When using date fields, “created_at”, or “updated_at” for the x-axis, dates and PHP word dates are also accepted, i.e. x_start=”-1 month” or x_start=”2011-11-01″. Values should coincide with the field used for the x_axis parameter. Example: [frm-graph id=866 x_axis=867 x_start=10]
    • x_end – Define the maximum value of the x-axis. When using date fields, “created_at”, or “updated_at” for the x-axis, dates and PHP word dates are also accepted, i.e. x_end=”now” or x_end=”2011-12-01″. Values should coincide with the field used for the x_axis parameter. Example: [frm-graph id=866 x_axis=867 x_end=100]
  • data_type – Specify whether to use the number of entries or total the values of those entries.
    • total: Displays the values for the specified field
    • count: Displays the number of entries for the specified field/li>
  • colors – Customize the graph colors with a comma separated list of 6-digit hex colors. Example [frm-graph id=x colors=#EF8C08,#21759B,#1C9E05]
  • bg_color – Change the background color. Example: [frm-graph id=x bg_color=#FFFFFF]
  • grid_color – Change the grid color (the lines on the graph). Example: [frm-graph id=x grid_color=#000000]
  • height – Set the graph height. If not specified, this defaults to 400. Example: [frm-graph id=x height:200]
  • width – Set the graph width to pixels or a percent. If not specified, this defaults to 400. Example: [frm-graph id=x width:25%]
  • show_key – Show the legend by using show_key=1. This is helpful if you are displaying multiple fields on the same graph. Change the legend font size by using a font size (in pixels) instead of “1″. Example: [frm-graph id=x show_key=20]
  • include_js – If you use the graph shortcode multiple times on the same page, you can prevent the javascript from loading multiple times for the graphs by adding include_js=0. Example: [frm-graph id=x include_js=0]
  • response_count – Show more responses than the default number (10). Example: [frm-graph id=x response_count=20]
  • limit – Limit the number of entries used for the graph. Example: [frm-graph id=x limit=10]
  • truncate – Change the number of characters shown in the graph title. Setting this value to 0 will completely hide the graph title. Example: [frm-graph id=x truncate=0]
  • truncate_label – Change the number of characters shown in the axis labels. Example: [frm-graph id=x truncate_label=7]
  • wrap – Set the number of characters for the axis label to show on each line before wrapping down to the next. Example: [frm-graph id=x wrap=10]
  • user_id – Show entries for a specific user with any user ID or “current”. Example: [frm-graph id=x user_id=10] or [frm-graph id=x user_id=current]
  • min – Set the minimum value of the y-axis. Example: [frm-graph id=x min=5]
  • max – Set the maximum value of the y-axis. Example: [frm-graph id=x max=10]
  • include_zero (boolean) – When using date fields, “created_at”, or “updated_at” for the x_axis parameter, you can also fill in dates with a zero value. This will also apply to dropdown, radio, and checkbox fields with no x_axis defined. Example: [frm-graph id=x include_zero=1]

    • PHP Alternative

    global $frmpro_statistics_controller;
echo $frmpro_statistics_controller->graph_shortcode(array('id' => x));

    All shortcode parameters from above can be used in this function.

Filed Under: