Initial commit

Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com>
Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com>
Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com>
Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>

library/modules/chartjs/README.md

@@ -0,0 +1,77 @@
+---
+title: Chart.js Module
+hide_title: true
+---
+
+# Chart.js Module
+
+[![GitHub](https://img.shields.io/static/v1?style=plastic&logo=github&label=GitHub&message=Source%20Code)](https://github.com/noodlapp/modules/tree/main/modules/noodl-chartjs)
+
+This module allows you to add charts to your Noodl App, using [Chart.js](https://www.chartjs.org/).
+
+![](/library/modules/chartjs/preview-bar-chart-nodes.png)
+
+Supported chart types:
+* Line and Area
+* Bar
+* Radar
+* Doughnut
+* Pie
+* Polar Area
+* Bubble
+* Scatter
+
+There are many different kinds inputs to change the style of the chart.
+Like the title, tooltip and legends.
+
+## Changing the Data
+
+To style the chart data, it should be added next to the data it want to style.
+To recreate for example this chart ([Bar Chart Border Radius](https://www.chartjs.org/docs/latest/samples/bar/border-radius.html)).
+It should send the style in the datasets to the chart.
+```js
+Outputs.Data = {
+    labels: [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July"
+    ],
+    datasets: [
+        {
+            label: "Fully Rounded",
+            data: [99, 41, 94, 1, 32, -63, 36]
+            borderColor: "rgb(255, 99, 132)",
+            backgroundColor: "rgba(255, 99, 132, 0.5)",
+            borderWidth: 2,
+            borderRadius: 1.8,
+            borderSkipped: false
+        },
+        {
+            label: "Small Radius",
+            data: [-59, -80, -62, -25, -40, 58, 95],
+            borderColor: "rgb(54, 162, 235)",
+            backgroundColor: "rgba(54, 162, 235, 0.5)",
+            borderWidth: 2,
+            borderRadius: 5,
+            borderSkipped: false
+        }
+    ]
+}
+```
+
+## Changing the Scales
+
+```js
+Outputs.Scales = {
+    x: {
+        stacked: true
+    },
+    y: {
+        stacked: true
+    }
+}
+```