1. Home
  2. Forum
  3. Blazor
  4. How to make the Width of a point the function of duration in Charts

How to make the Width of a point the function of duration in Charts

Hi There,

I have some events which occur in a timeline, and each event has a duration. I have plotted these events as a scatter plot (Timeline-chart1.png).

Timeline-chart1.png

Since each event has  a duration, what I really want to show is a wider or narrower point, depending on the duration.  (Timeline-chart2.png).Timeline-chart2.png

How can I achieve this?

Also, when a Zoom scrollbar is enabled 

<ChartZoomSettings EnableScrollbar="true" Mode="Syncfusion.Blazor.Charts.ZoomMode.X">/ChartZoomSettings>


The scroll bar covers the X axis. (Timeline-chart3.png). 

Timeline-chart3.png

Is it possible to reposition the scroll bar? 



Attachment: Charts_3c0c074e.zip

4 Replies
SM Srihari Muthukaruppan Syncfusion Team June 24, 2021 12:25 PM UTC

Hi Joseph, 
  
Please find the response for chart related queries. 
  
Query #1: what I really want to show is a wider or narrower point, depending on the duration. 
  
Based on your request we suggest you to use line series with width as required to achieve your requirement. Based on that we have prepared a sample for your reference. Please find the sample and screenshot below. 
  
  
Screenshot: 
 
  
Query #2: The scroll bar covers the X axis. 
  
We have tested the reported scenario and it is working fine. Unfortunately we are unable to reproduce the reported scenario in the latest version 19.1.69 of the chart too. Please find the sample used for testing and video for your reference. 
  
  
Screenshot: 
 
  
Note: We also suggest you to clear the browser cache before checking the scenario 
  
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. 
  
    1. Try to reproduce the reported scenario in the provided sample.
    2. Share the replication procedure for the reported scenario.
  
Regards, 
Srihari M 


JT Joseph Tan June 24, 2021 10:04 PM UTC

Hi There,


Thanks. I think adding Line series instead of scatter plot, with EmptyPoint=Gap is exactly what I need.


Also, the issue with the zoom scroll bar overlapping the axis can be reproduced by adding CrossesAt="0" :


    <ChartPrimaryXAxis LabelFormat="mm:ss.ff" ValueType="Syncfusion.Blazor.Charts.ValueType.DateTime" CrossesAt="0"/>






SM Srihari Muthukaruppan Syncfusion Team June 25, 2021 11:52 AM UTC

Hi Joseph, 
 
We have analyzed your query. Based on your request we have logged a bug task on this. You can keep track of it from the below feedback portal link. 
     
     
This fix will be available in our upcoming weekly patch release which is scheduled to be rolled out on or before July 6 2021. We appreciate your patience until then.  
 
Regards, 
Srihari M 


BP Baby Palanidurai Syncfusion Team July 7, 2021 10:45 AM UTC

Hi Joseph, 

Thanks for your patience. 

We have checked further on the reported scenario. When setting CrossesAt to 0, labels and line will be placed on that value. But here axis minimum is already 0, so labels and line will be placed on 0, so you don’t need to set CrossesAt for this.   

Kindly revert us, if you any concerns. 

Regards, 
Baby. 


Loader.
Up arrow icon