diff --git a/README.md b/README.md
index 43a7ba9..dae4844 100644
--- a/README.md
+++ b/README.md
@@ -35,12 +35,14 @@ You can change the chart settings of your app from `config/apexcharts.php` file
## Usage
-First of all, create an instance of the `Chart` class and set the data and options according to your needs.
+### Blade
+
+Create an instance of the `Chart` class and set the data and options according to your needs.
```php
use Akaunting\Apexcharts\Chart;
-...
+// ...
$chart = (new Chart)->setType('donut')
->setWidth('100%')
@@ -52,11 +54,10 @@ $chart = (new Chart)->setType('donut')
Then, include the JavaScript (on every page using charts).
```html
-...
+
-
- ...
+
@apexchartsScripts
@@ -65,11 +66,67 @@ Then, include the JavaScript (on every page using charts).
Finally, call the `container` and `script` method wherever you want to display the chart.
```php
+
+
{!! $chart->container() !!}
{!! $chart->script() !!}
```
+### Vue
+
+If you're using Vue and Inertia, create a simple `chart.vue` component:
+
+```vue
+
+
+
+
+
+
+
+```
+
+Then, create an instance of `Chart` and call `toVue()` when passing it to your page:
+
+```php
+Route::get('dashboard', function () {
+ $chart = (new Chart)->setType('...');
+
+ return inertia('dashboard', [
+ 'chart' => $chart->toVue(),
+ ]);
+});
+```
+
+Finally, render the chart:
+
+```vue
+
+
+
+
+
+
+
+```
+
## Testing
```bash