Hi,
I'm trying to display a tooltip with the stack bar chart but it never display
Here's the code for my chart, it's pratically identical to the one in your demo:
I'm using the version 19.3.0.44 of the Syncfusion.Blazor.Charts package
Also I would like to show a vertical scrollbar for the char when there's too many entries to show, I read the doc on the chart component and didn't find anything about vertical scrollbar
Hi Antoine,
Please find the response for chart related queries.
Query #1: I'm trying to display a tooltip with the stack bar chart but it never display
We
request you to kindly include the lodash
script in the HEAD element of
the ~/Pages/_Host.cshtml page for server side blazor
application. In case, if you are using WASM application, include it in
the HEAD element of the ~/wwwroot/index.html page
for user interaction.
|
<head> <script src=https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js></script> </head> |
We have tested the reported scenario and it is working fine in the latest version of the chart 19.3.53 with the lodash. Unfortunately we are unable to reproduce the reported scenario in the version 19.3.44 too. Please find the sample used for testing and screenshot for your reference.
Code Snippet:
|
<SfChart Title="Sales Comparison" Theme="@Theme"> <ChartArea><ChartAreaBorder Width="0"></ChartAreaBorder></ChartArea> <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category"> <ChartAxisMajorGridLines Width="0"></ChartAxisMajorGridLines> </ChartPrimaryXAxis> <ChartPrimaryYAxis EdgeLabelPlacement="EdgeLabelPlacement.Shift"> </ChartPrimaryYAxis> <ChartSeriesCollection> <ChartSeries DataSource="@ChartPoints" XName="Month" YName="AppleSales" Width="2" Name="Apple" Type="ChartSeriesType.StackingBar100"> </ChartSeries> <ChartSeries DataSource="@ChartPoints" XName="Month" YName="OrangeSales" Width="2" Name="Orange" Type="ChartSeriesType.StackingBar100"> </ChartSeries> <ChartSeries DataSource="@ChartPoints" XName="Month" YName="Wasteage" Width="2" Name="Wastage" Type="ChartSeriesType.StackingBar100"> </ChartSeries> </ChartSeriesCollection> <ChartZoomSettings EnableScrollbar="true" ></ChartZoomSettings> <ChartTooltipSettings Enable="true" Shared="true" Format="${point.x} : <b>${point.y} (${point.percentage}%)</b>"></ChartTooltipSettings> </SfChart> |
Screenshot:
If you still face this issue. kindly revert us with the following information which will be more helpful for further analysis and provide you the solution sooner.
Query #2: Also I would like to show a vertical scrollbar for the char when there's too many entries to show,
We can achieve your requirement through lazy loading concept. But as of now we are facing issue in scrolling the scrollbar. We have also logged a bug report on this and this fix will be available in our weekly patch release which is scheduled to be rolled out on or before 7th December 2021. Once the issue is fixed we will provide the sample for the mentioned scenario.
We appreciate your patience until then. You can keep track of the bug from the below feedback link.
Feedback Link : https://www.syncfusion.com/feedback/30431/console-error-thrown-while-using-lazy-loading-sample
If you have any more specification/precise replication procedure or a scenario to be tested, you can add it as a comment in the portal.
Let us know if you have any concerns.
Regards,
Srihari M
Hi, I have include the script in the head of my _host.cshtml file and the tooltips works fine now :). Also for the vertical scroll bar I was able to achieve the desire behavior by using a div with a height higher than his parent and the overflow-y property at scroll
Thank you for the quick answer
Antoine