maxicharts

Create beautiful <a href="http://www.chartjs.org/" title="Chartsjs" rel="nofollow ugc">Chartsjs</a> charts from <a href="https://wordpress.org/plugins/maxicharts-gravity-forms-source-add-on/" title="Gravity Forms" rel="ugc">Gravity Forms</a> submission data or <a href="https://wordpress.org/plugins/maxicharts-csv-source-add-on/" title="CSV add-on" rel="ugc">CSV data</a> with a simple shortcode. 
Use all your past data to visualize advanced statistics in a few clics. You NEED to install at least one add-on in order to use shortcodes.
Requires Gravity Forms v2.3+
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/ZcKpVkDNYIM?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<a href="https://maxicharts.com/random-demos/" title="Demonstration" rel="nofollow ugc">>> Demonstration site <<</a>
All code has been moved to GitHub now : <a href="https://github.com/Maxicharts" rel="nofollow ugc">MaxiCharts on Github</a>
<h3>Add-ons</h3>
You NEED to install at least one of them:
<ul>
<li><a href="https://wordpress.org/plugins/maxicharts-gravity-forms-source-add-on/" title="GF Add-on" rel="ugc">Maxicharts Gravity Forms source add-on</a> : chart all Gravity Forms submission data</li>
<li><a href="https://wordpress.org/plugins/maxicharts-csv-source-add-on/" title="CSV add-on" rel="ugc">MaxiCharts CSV add-on</a> : in order to graph CSV files</li>
</ul>
Optional add-ons:
<ul>
<li><a href="https://wordpress.org/plugins/maxicharts-gravity-view-add-on/" title="Gravity View add-on" rel="ugc">MaxiCharts Gravity View add-on</a> : in order to filter entries on Gravity View “approved” ones</li>
<li><a href="https://wordpress.org/plugins/maxicharts-query-builder-add-on/" title="Query Builder add-on" rel="ugc">MaxiCharts Query Builder add-on</a> : Real time filter entries on graph using <a href="http://querybuilder.js.org/index.html" title="Query Builder" rel="nofollow ugc">Query Builder</a></li>
<li><a href="https://fr.wordpress.org/plugins/maxicharts-colors-add-on/" rel="nofollow ugc">MaxiCharts Extended Colors add-on</a> “Extended Colors”) : Extended colors sets</li>
</ul>
<h3>Usage</h3>
Use the post visual editor brand new button to add as many shortcodes as you want in a few clics ! 
You need to install the core MaxiCharts plugin in any case, then if you use, for example Gravity Forms add-on, the shortcode processed is:
<pre><code>[gfchartsreports gf_form_id="form_id" include="fieldNb1,fieldNb2,fieldNb3,.." exclude="fieldNb4,fieldNb5,..." color_set="set" type="graphType" width="width(px|%)" float="true|false" chart_js_options="options"]
</code></pre>
where all parameters are optional:
<ul>
<li>gf_form_id : expects the form ID in Gravity Forms (defaults to first form : id=1)</li>
<li>type : is <a href="https://maxicharts.com/all-graph-types/" rel="nofollow ugc">the type of graph</a>, at the moment only line,pie,doughnut,bar,horizontalBar available (defaults to pie)</li>
<li>include : expects the field ids to include (example : <code>include="1,3,4"</code>)</li>
<li>exclude : expects the field ids to exlude (example : <code>exclude="2,4,6"</code>)</li>
</ul>
see <a href="https://maxicharts.com/all-shortcode-parameters/" title="All parameters" rel="nofollow ugc">all parameters on demonstration site</a>
<h3>Examples</h3>
Display all fields of form #1 as pie charts with custom <a href="http://www.chartjs.org/docs/#chart-configuration-creating-a-chart-with-options" rel="nofollow ugc">chartjs options</a> for titles:
<pre><code>[gfchartsreports chart_js_options="title: {display: true, text: 'My Funky Chart Title', fontSize:28,fontFamily:'Arial',fontColor:'#00B88A',fontStyle:'bold',padding:20}"]
</code></pre>
Displays fields 4, 7 and 18 of gravity form #3 with bar charts. Default colors used.
<pre><code>[gfchartsreports gf_form_id="3" include="4,7,18" type="bar"]
</code></pre>
Displays field 2 of gravity form #2 with default pie chart. Use red color set, with not randomization.
<pre><code>[gfchartsreports gf_form_id="2" include="2" color_set="red"]
</code></pre>
Displays all but fields 4,7,18 of gravity form #8 with horizontalBar type charts. Use blue color set, randomized.
<pre><code>[gfchartsreports gf_form_id="8" exclude="4,7,18" color_set="blue" color_rand="true" type="horizontalBar"]
</code></pre>
More examples here : <a href="https://maxicharts.com/random-demos/" title="Demonstration" rel="nofollow ugc">>> Demonstration site <<</a>

MaxiCharts

Does the job pretty well using the excellent chartjs library!
Waiting for more charts connectors : d3js ?.... :)

Great chart hub

This plugin really transformed the way i used Gravity Forms datas, i can now create any dataviz i want in order to create complete stats on my users.
You need to install MaxiCharts as well.
Keep on going guys!

Great!

I've used this for both its Gravity Forms and CSV integration on different sites, and it's been great to use. It would be nice to have an add-on for allowing datasets to be managed directly on the site (without needing to edit/upload/replace CSV files directly) in the future. Otherwise, I think this is an absolute great start!

Wonderful integration of the great Chart.js library with tons of flexibility

Create beautiful HTML5 charts from Gravity Forms submission data with a simple shortcode. You can also visualise CSV files as graphs.

termel

Extends MaxiCharts to chart Gravity Forms data with a simple shortcode. Requires installation and activation of free <a href="https://wordpress.org/plugins/maxicharts/" title="MaxiCharts" rel="ugc">MaxiCharts</a> plugin. And of course Gravity Forms.
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/ZcKpVkDNYIM?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<a href="https://maxicharts.com/random-demos/" title="Demonstration" rel="nofollow ugc">>> Demonstration site <<</a>
All code has been moved to GitHub now : <a href="https://github.com/Maxicharts" rel="nofollow ugc">MaxiCharts on Github</a>
<h3>Usage</h3>
Use the post visual editor brand new button to add the as many shortcodes as you want in a few clics !
the shortcode is
<pre><code>[gfchartsreports gf_form_id="form_id" include="fieldNb1,fieldNb2,fieldNb3,.." exclude="fieldNb4,fieldNb5,..." color_set="set" type="graphType" width="width(px|%)" float="true|false" chart_js_options="options"]
</code></pre>
where all parameters are optional:
<ul>
<li>gf_form_id : expects the form ID in Gravity Forms (defaults to first form : id=1)</li>
<li>type : is the type of graph, at the moment only line,pie,doughnut,bar,horizontalBar available (defaults to pie)</li>
<li>include : expects the field ids to include (example : <code>include="1,3,4"</code>)</li>
<li>exclude : expects the field ids to exlude (example : <code>exclude="2,4,6"</code>)</li>
<li>colors : to use your custom colors : a list of <a href="https://maxicharts.com/custom-colors/" rel="nofollow ugc">coma separated hex colors</a></li>
<li>color_set : expects the name of the color set : blue,green,red,orange,purple (defaults to a standard color set including different colors)</li>
<li>color_rand : expects true or false and randomizes colors in color set if true (defaults to false)</li>
<li>…</li>
</ul>
see <a href="https://maxicharts.com/all-shortcode-parameters/" title="All parameters" rel="nofollow ugc">all parameters on demonstration site</a>
<h3>Examples</h3>
Display all fields of form #1 as pie charts with custom <a href="http://www.chartjs.org/docs/#chart-configuration-creating-a-chart-with-options" rel="nofollow ugc">chartjs options</a> for titles:
<pre><code>[gfchartsreports chart_js_options="title: {display: true, text: 'My Funky Chart Title', fontSize:28,fontFamily:'Arial',fontColor:'#00B88A',fontStyle:'bold',padding:20}"]
</code></pre>
Displays fields 4, 7 and 18 of gravity form #3 with bar charts. Default colors used.
<pre><code>[gfchartsreports gf_form_id="3" include="4,7,18" type="bar"]
</code></pre>
Displays field 2 of gravity form #2 with default pie chart. Use red color set, with not randomization.
<pre><code>[gfchartsreports gf_form_id="2" include="2" color_set="red"]
</code></pre>
Displays all but fields 4,7,18 of gravity form #8 with horizontalBar type charts. Use blue color set, randomized.
<pre><code>[gfchartsreports gf_form_id="8" exclude="4,7,18" color_set="blue" color_rand="true" type="horizontalBar"]
</code></pre>
Test it live here : <a href="https://maxicharts.com/random-demos/" title="Demonstration" rel="nofollow ugc">>> Demonstration site <<</a>

MaxiCharts Gravity Forms Source add-on

So cool to graph everything in Gravity Forms for free!

Great to chart all Gravity Forms datas!

Extends MaxiCharts to chart Gravity Forms data.

MaxiCharts vs MaxiCharts Gravity Forms Source add-on