PluginChartJS

Overview

PluginChartJS is a wikiplugin introduced in Tiki16 (but only started working in Tiki17 ) that can generate charts using the open-source Chart.js library.

This plugin is currently only developed to work with Doughnut- and Pie-type charts.

Please note: You should consider this plugin as experimental. Why? Because there are several charting libraries in Tiki, it is probable that some of them will be deprecated, so the community can converge on a common solution. And that solution will be deployed for all charts within Tiki, and for use with PluginList data.

Parameters

Create a JS Chart
Introduced in Tiki 16.
Go to the source code
Preferences required: wikiplugin_chartjs

Parameters Accepted Values Description Default Since
(body of plugin) JSON encoded array for data and options.
height text The height of the chart in px 200 16.0
id text A custom ID for the chart. tikiChart1, tikiChart2 etc 16.0
type text The type of chart. Currently works with pie, bar and doughnut pie 16.0
width text The width of the chart in px 200 16.0
data_colors text Colon-separated colors for the datasets in the chart. Max 10, if left empty red:blue:green:purple:grey:orange:yellow:black:brown:cyan 16.0
data_labels text Colon-separated labels for the datasets in the chart. Max 10, if left empty A:B:C:D:E:F:G:H:I:J 16.0
values text Colon-separated values for the chart (required if not using JSON encoded data in the plugin body) 16.0
data_highlights text Colon-separated color of chart section when highlighted 16.0
debug digits Uses the non-minified version of the chart.js library for easier debugging. 0 18.3




Example usage

This code:

Copy to clipboard
{CHARTJS(values="12:3:20:11")} {CHARTJS}


Would produce:


Or this other code:

Copy to clipboard
{CHARTJS(id="mychart1" type="pie" height="300" width="400" values="15:25:60" data_labels="foo:bar:wohoo" data_colors="red:pink:orange" data_highlights="snow:lightyellow:lightgrey")}{CHARTJS}


Would produce:



Related: