From 8bfdaa17632550dd6db8764659e3f711cdb8bddd Mon Sep 17 00:00:00 2001 From: asantibanez Date: Mon, 14 Feb 2022 15:42:57 -0500 Subject: [PATCH] Updated README --- README.md | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/README.md b/README.md index 957dfcb..4ea476b 100755 --- a/README.md +++ b/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`.