Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/apexcharts/Blazor-ApexCharts
A blazor wrapper for ApexCharts.js
https://github.com/apexcharts/Blazor-ApexCharts
apexcharts blazor blazor-apexcharts blazor-charts wrapper
Last synced: 10 days ago
JSON representation
A blazor wrapper for ApexCharts.js
- Host: GitHub
- URL: https://github.com/apexcharts/Blazor-ApexCharts
- Owner: apexcharts
- License: mit
- Created: 2020-04-14T19:10:26.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-04-07T11:11:41.000Z (7 months ago)
- Last Synced: 2024-04-14T11:30:06.257Z (7 months ago)
- Topics: apexcharts, blazor, blazor-apexcharts, blazor-charts, wrapper
- Language: C#
- Homepage: https://apexcharts.github.io/Blazor-ApexCharts
- Size: 358 MB
- Stars: 653
- Watchers: 13
- Forks: 76
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-blazor - Blazor-ApexCharts - ![stars](https://img.shields.io/github/stars/apexcharts/Blazor-ApexCharts?style=flat-square&cacheSeconds=604800) ![last commit](https://img.shields.io/github/last-commit/apexcharts/Blazor-ApexCharts?style=flat-square&cacheSeconds=86400) Blazor wrapper for ApexCharts. [Demo](https://joadan.github.io/Blazor-ApexCharts/basic-charts). (Libraries & Extensions / 2D/3D Rendering engines)
README
![.NET Core](https://github.com/joadan/Blazor-ApexCharts/workflows/.NET%20Core/badge.svg?branch=master)
# Blazor-ApexCharts
A blazor wrapper for [ApexCharts.js](https://apexcharts.com/)
## [Demo](https://apexcharts.github.io/Blazor-ApexCharts)## v2.0 Released to production!
It's no longer necessary to manually include javascript files.
Please **REMOVE** any references to:```html
```
---As of version 2.0 javascript interop on WASM is running synchronously for better performance.
## Installation
### NuGet
[Blazor-ApexCharts](https://www.nuget.org/packages/Blazor-ApexCharts/)```bash
dotnet add package Blazor-ApexCharts
```## Usage
### Imports
Add a reference to `Blazor-ApexCharts` in your `_Imports.razor`
```razor
@using ApexCharts
```### .NET 8
If you are on .NET 8 you need to set the rendermode to Interactive.*Interactive Server, Interactive WebAssembly or Interactive Auto*
### Your first chart
```razor
@code {
private List Data { get; set; } = new();
protected override void OnInitialized()
{
Data.Add(new MyData { Category = "Jan", NetProfit = 12, Revenue = 33 });
Data.Add(new MyData { Category = "Feb", NetProfit = 43, Revenue = 42 });
Data.Add(new MyData { Category = "Mar", NetProfit = 112, Revenue = 23 });
}public class MyData
{
public string Category { get; set; }
public int NetProfit { get; set; }
public int Revenue { get; set; }
}
}
```### Chart Options
Apex Chart options are available in the `ApexChartOptions` class that can be passed to the chart. More info in Apex documentation [ApexCharts Docs](https://apexcharts.com/docs/options/).**The chart options cannot be shared. Each chart instance must have its own ApexChartOptions instance**
## Acknowledgments
Credits to [@thirstyape](https://github.com/thirstyape) for making production release possible.[![Stargazers repo roster for @apexcharts/Blazor-ApexCharts](https://reporoster.com/stars/dark/apexcharts/Blazor-ApexCharts)](https://github.com/apexcharts/Blazor-ApexCharts/stargazers)