Chart
<time datetime="2023-06-26 00:00:00 +0000 UTC">June 26 2023</time><span class="px-2 text-primary-500">·</span><time datetime="2024-02-20 16:00:25 -0600 CST">Updated: February 20 2024</time><span class="px-2 text-primary-500">·</span><span>136 words</span><span class="px-2 text-primary-500">·</span><span title="Reading time">1 min</span>
Blowfish
Shortcodes
Chart
blowfish shortcodes - This article is part of a series.
🐡 Shortcodes
badge outputs a styled badge component thematically aligned to tags
chart uses the Chart.js library to embed charts into articles using simple structured data. It supports a number of
different chart styles and everything can be configured from within the shortcode. Simply provide the chart parameters between the shortcode tags and Chart.js will do the rest.
Refer to the official Chart.js docs for details on syntax and supported chart types.
Example:
{{< chart >}}
type: 'bar',
data: {
labels: ['Tomato', 'Blueberry', 'Banana', 'Lime', 'Orange'],
datasets: [{
label: '# of votes',
data: [12, 19, 3, 5, 3],
}]
}
{{< /chart >}}
- You can see some additional Chart.js examples on the charts samples page:
-
Charts<time datetime="2023-08-19 21:44:35 -0500 CDT">Updated: August 19 2023</time><span class="px-2 text-primary-500">·</span><span>81 words</span><span class="px-2 text-primary-500">·</span><span title="Reading time">1 min</span>Chart Sample Graph Shortcodes