Skip to content

Loading State of Charts #126

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ElcompMatt opened this issue Aug 5, 2024 · 0 comments
Open

Loading State of Charts #126

ElcompMatt opened this issue Aug 5, 2024 · 0 comments
Labels
feature-request New feature or request

Comments

@ElcompMatt
Copy link

Context: I am using Blazor Server .NET8 - VS22
Using: Currently using the IgbCategoryChartModule
Dataset Used: Contains up to 300,000 data points of DateTime/Value information.
Current Code:
<IgbCategoryChart @ref="chart" DataSource="ChartData" Height="450px" Width="95%" ChartType="CategoryChartType.Line" IncludedProperties="chartProperties" YAxisLabelLocation="YAxisLabelLocation.OutsideLeft" YAxisTitle="@yAxisTitle" XAxisTitle="Time Period" ToolTipType="ToolTipType.Data" Thickness="1.5" Brushes="@chartColours" TrendLineThickness="0.2" XAxisLabelFormat="{TimeStamp}" XAxisEnhancedIntervalPreferMoreCategoryLabels="false" MarkerAutomaticBehavior="@MarkerAutomaticBehavior.None" ShouldAutoExpandMarginForInitialLabels="false" CrosshairsDisplayMode="CrosshairsDisplayMode.Both"> </IgbCategoryChart>

Is your feature request related to a problem? Please describe.
Currently in the charting tools, dependent on size of the data set, there is a small delay from the rendering of the chart to the assembly and presentation of the data (larger data sets). I use a flag to check that the component has loaded, but it will show an empty chart (no chart) with the Axis titles, demonstrating that the component had in fact loaded but no data had been assembled and animated and the chart can remain empty for a few seconds.

The loading flag I use is a false indication that the process of loading data into the chart had completed. The issue is that with larger data sets, there is a delay between the component loading and the data being presented (I am calling it the animation). Obviously I could throw a lot of resources to our Azure instance, but this can become very expensive.

Describe the solution you'd like
What would be useful is perhaps an event callback in the chart, that shows the state of the chart as it loads (in an events args to an internal method in the razor page), this could exist as a property in the mark up for the chart called 'ComponentState' or similar, as follows:

  • Component Loading - The start of the component loading process (user loader starts).
  • Component Loaded - Shows the component has rendered.
  • Beginning Animation - (When I say animation, I mean the chart is being drawn) - This is where the users loader could end, as data begins to be presented.
  • Completed Animation - A state where the entire chart process has completed. This may useful to fire other events outside of the chart component.

Describe alternatives you've considered
I currently use a loader icon, but the delay is present as the animation begins, the capturing of the component rendering is correct and that is not an issue.
I've used the series added event, but I still see a delay.

@ElcompMatt ElcompMatt added the feature-request New feature or request label Aug 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature-request New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant