Elegantly Simple WebAssembly Blazor Charts
This is a collection of Blazor Charts that is Elegantly Simple with the following key design principles:
Using the dotnet CLI, create a new Blazor projectdotnet new blazorwasm -o BlazorProject
Clone the Blazor Charts Librarygit clone https://github.com/Misfits-Rebels-Outcasts/Blazor-Charts.git
Add a reference from the BlazorProject to the specific Blazor Charts Library. Go to the BlazorProject folder, edit the BlazorProject.csproj and add in the following:
<Project...> . . . <ItemGroup> <ProjectReference Include="../Blazor-Charts/DonutChart/DonutChart.csproj" /> </ItemGroup> </Project>
If you are using other charts such as the Pie Chart, change the above to "../Blazor-Charts/PieChart/PieChart.csproj".
Edit Index.razor in the Pages folder of the BlazorProject
@using WebAssemblyMan @page "/" <h1>Hello, world!</h1> Welcome to your new app. <DonutChart InputData="10,30,20,10,10,10,5,5" InputLabels="App Store,Website,Partners, Direct,Channels,Retail,Distributors,Affiliates"> </DonutChart> <SurveyPrompt Title="How is Blazor working for you?" />
@using enables us to use the Blazor Charts library within our project. <DonutChart> is the tag where we declare our use of the chart component. If you are using other charts such as the Pie Chart, change the above to "<PieChart InputData="50,30,20" ...><PieChart>".
Edit index.html to include the Chart Stylesheet.
<!DOCTYPE html> <html> <head> . . . <link href="_content/DonutChart/styles.css" rel="stylesheet" /> <head> <body> . . . </body> </html>
If you are using other charts such as the Pie Chart, change the above to "<link href="_content/PieChart/styles.css" rel="stylesheet" />".
Run the BlazorProjectdotnet run
You should see a web page with the Blazor chart.
Have you thought about how many times you have used, reused, written or rewritten your components and charts? Everyday, day after day, components after components and charts after charts. We definitely have. That is why we build own components and charts to be adaptable, vanilla with minimal dependencies and elegantly simple. The Elegantly Simple design ensures our components and charts are build to last. As new frameworks and libraries are released, you will be able to easily adapt the components charts to the new version. When you hire new people to maintain a project utilizing these components and charts, they will have no problems understanding how the components and charts work.
We provide good documentation on the components and charts so that you do not need to guess or figure out how we have designed and implemented them.
We also test our components and charts with different scenarios vigorously, so that you know you can be assured of its quality, robustness and reliability.
Whether you are a project manager, software developer or business executive from a Fortune 500 company, or a free-lancer, a consultant or an entrepreneur joining the business world, we hope that you will find our WebAssembly components and charts useful as we have built upon our past experiences, put in our best efforts and invest quality time to develop them to their very best.
Page Source | Issues | Content Date - 2/10/2020 | Language Vetting - "Feb 28,2020"