Updated README
This commit is contained in:
15
README.md
15
README.md
@@ -27,6 +27,8 @@ and export `livewire-charts:public`. This command will export a `vendor/livewire
|
||||
php artisan vendor:publish --tag=livewire-charts:public
|
||||
```
|
||||
|
||||
> Note: This last step can also be done using `livewire-charts:install` command in the artisan console.
|
||||
|
||||
## Requirements
|
||||
|
||||
This package requires the following packages/libraries to work:
|
||||
@@ -46,6 +48,7 @@ Livewire Charts supports out of the box the following types of charts
|
||||
- Column/Multi Line Chart (`LivewireColumnChart` component)
|
||||
- Area Chart (`LivewireAreaChart` component)
|
||||
- Radar Chart (`LivewireRadarChart` component)
|
||||
- Tree Map Chart (`LivewireTreeMapChart` component)
|
||||
|
||||
Each one comes with its own "model" class that allows you to define the chart's data and render behavior.
|
||||
- `LivewireLineChart` uses `LineChartModel` to set up data points, markers, events and other ui customizations.
|
||||
@@ -53,6 +56,7 @@ Each one comes with its own "model" class that allows you to define the chart's
|
||||
- `LivewireColumnChart` uses `ColumnChartModel` to set up data columns, events and other ui customizations.
|
||||
- `LivewireAreaChart` uses `AreaChartModel` to set up data points, events and other ui customizations.
|
||||
- `LivewireRadarChart` uses `RadarChartModel` to set up data points, events and other ui customizations.
|
||||
- `LivewireTreeMapChart` uses `TreeMapChartModel` to set up data blocks, events and other ui customizations.
|
||||
|
||||
For example, to render a column chart, we can create an instance of `ColumnChartModel` and add some data to it
|
||||
```php
|
||||
@@ -101,6 +105,7 @@ LivewireCharts::multiColumnChartModel();
|
||||
LivewireCharts::pieChartModel();
|
||||
LivewireCharts::areaChartModel();
|
||||
LivewireCharts::radarChartModel();
|
||||
LivewireCharts::treeMapChartModel();
|
||||
```
|
||||
|
||||
## Enabling Interactions
|
||||
@@ -227,6 +232,16 @@ for each type of chart.
|
||||
| addSeries(string $seriesName, string $title, double $value, array $extras = []) | |
|
||||
| withOnPointClickEvent(string $eventName) | Event Name that will be fired when a point of the chart is clicked |
|
||||
|
||||
### LivewireTreeMapChart
|
||||
|
||||
| Method | Description |
|
||||
|--------|-------------|
|
||||
| addBlock(string $title, double $value, array $extras = []) | Adds a block to the default series|
|
||||
| addSeriesBlock(string $seriesName, string $title, double $value, array $extras = []) | Adds a block to the specified series|
|
||||
| withOnBlockClickEvent(string $eventName) | Event Name that will be fired when a block of the chart is clicked |
|
||||
| setDistributed(bool $distributed) | Set whether the chart uses distribution or not |
|
||||
|
||||
|
||||
## Advanced Usage - Integrating Scripts
|
||||
|
||||
The directive `@livewireChartsScripts` adds a `script` tag that includes `public/vendor/livewire-charts/app.js`.
|
||||
|
||||
Reference in New Issue
Block a user