Charts


Add beautifully rendered line, bar, pie, radial, etc. charts to any slideshow presentation. Support for charts within GitPitch slideshow presentations is powered by the the reveal.js plugin for Chart.js.

By default, this plugin is disabled. To enable this plugin for your presentation, see charts plugin activation.


Learn By Example

This PITCHME.md markdown snippet:

---

<canvas data-chart="line">
<!-- 
{
 "data": {
  "labels": ["January"," February"," March"," April"," May"," June"," July"],
  "datasets": [
   {
    "data":[65,59,80,81,56,55,40],
    "label":"My first dataset","backgroundColor":"rgba(20,220,220,.8)"
   },
   {
    "data":[28,48,40,19,86,27,90],
    "label":"My second dataset","backgroundColor":"rgba(220,120,120,.8)"
   }
  ]
 }, 
 "options": { "responsive": "true" }
}
-->
</canvas>

Results in the rendering of the following slide:

CHARTS


Charts Plugin Activation

To enable the charts plugin for your presentation add the following property to your PITCHME.yaml file:

charts : true

Once this property has been enabled, a chart can be included on any slide by adding a canvas element with the data-chart attribute set to the desired chart type. The chart can be configured within the canvas body by a JSON string embedded into an HTML comment.

For further details, please see the documentation for the reveal.js plugin for Chart.js.

Note, if your chart is driven by an external csv data file you must specify an absolute URL to that file. If your csv data file lives in your GitHub repo then you will need to use the absolute URL to the raw file. Relative paths are not supported.