Sign In

@brightyard/wappler-chartjs

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@brightyard/wappler-chartjs - npm Package Compare versions

Comparing version
0.0.3
to
0.0.4
+1
-1
package.json
{
"name": "@brightyard/wappler-chartjs",
"version": "0.0.3",
"version": "0.0.4",
"type": "module",

@@ -5,0 +5,0 @@ "description": "ChartJs",

# GraphJS Extension for Wappler
# ChartJS Extension for Wappler
The GraphJS extension integrates Chart.js charts into Wappler. Use this component to display data in various chart formats, including line, bar, and pie charts. It supports dynamic data binding and customizable chart configurations.
The ChartJS extension integrates Chart.js charts into Wappler. Use this component to display data in various chart formats, including line, bar, and pie charts. It supports dynamic data binding and customizable chart configurations.

@@ -16,10 +16,10 @@ > **Note:** This extension is not ready for production and is exposed for other Wapplers to review and suggest improvements.

You can add the custom GraphJS component to your Wappler project by following these steps:
You can add the custom ChartJS component to your Wappler project by following these steps:
1. **Include the GraphJS Component:**
1. **Include the ChartJS Component:**
In Wappler's App Structure panel, add the GraphJS component to your page:
In Wappler's App Structure panel, add the ChartJS component to your page:
```html
<dmx-graphjs id="chart1" type="bar" dmx-bind:data="serverConnect1.data.chartData" dmx-bind:labels="['January', 'February', 'March']"></dmx-graphjs>
<dmx-chartjs id="chart1" type="bar" dmx-bind:data="serverConnect1.data.chartData" dmx-bind:labels="['January', 'February', 'March']"></dmx-chartjs>
```

@@ -44,3 +44,3 @@

```html
<dmx-graphjs
<dmx-chartjs
id="chart1"

@@ -51,3 +51,3 @@ type="bar"

dmx-bind:options="{ backgroundColor: [ 'rgba(255, 99, 132, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(255, 206, 86, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(153, 102, 255, 0.2)', 'rgba(255, 159, 64, 0.2)' ], borderColor: [ 'rgba(255,99,132,1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)' ], borderWidth: 1 }"
></dmx-graphjs>
></dmx-chartjs>
```

@@ -54,0 +54,0 @@