horizontal stacked bar with datetime scaled on x axis

6 posts, 0 answers
  1. Tomas
    Tomas avatar
    3 posts
    Member since:
    Dec 2017

    Posted 02 Jan Link to this post

    Hi,
    I'm relatively new with working of telerik wpf controls,
    I'd like to create horizontal stacked bar(on y axis) with datetime scaled on x axis,
    specially I have to deal with solutions for viewing states(every state has different colour) in one stacked bar (see enclosed pct..).

    Is it case for RadCartesianChart or radtimebar, or please can you show me some example of it ?

    Tomas

  2. Martin Ivanov
    Admin
    Martin Ivanov avatar
    1497 posts

    Posted 04 Jan Link to this post

    Hello Tomas,

    To achieve your requirement you can use the RadTimeline control. We don't have an example showing the exact same visualization, but you can check the following resources. Basically, you can populate the timeline control with items and each items can represent a different states (red, green, orange, etc.).
    • Getting Started - This will help you to get started with the timeline control.
    • Customizing Items  - This shows how to create a custom timeline items. You can use this approach to set different controls for the different items
    • RowIndexGenerator - This shows how to control the row of the draw items. By default if items are overlapping they will be placed on different rows. To draw overlapping items on a single row you can use a custom row index generator.
    • Groupung - Check this feature if you want to group different states.
    • Annotations and Conversion API - You can use those features to draw the handles that indicate the current position. You can use the mouse events with the conversion API to convert the mouse position to date and update the annotation's value based on it.
    Can you please give those resources a try and see if they help?

    Regards,
    Martin Ivanov
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
  3. Tomas
    Tomas avatar
    3 posts
    Member since:
    Dec 2017

    Posted 05 Jan in reply to Martin Ivanov Link to this post

    Thank you Martin for you response,
    it seems that would be helpful for my case use timelinecontrol, it seems really comprehensive.
    As I made some WPF user control above it I'm still struggling with showing also some minutes in timeline or some range of hours.
    Specially I need 2 views:

    1. showing 3 hours interval in header (as in my enclosed picture)

    2. showing 15 minutes interval in header - 1:15,1:30..

    Is it possible achieve it ?

    Thanks in advance

    Tomas

     

     

     

     

  4. Martin Ivanov
    Admin
    Martin Ivanov avatar
    1497 posts

    Posted 05 Jan Link to this post

    Hello Tomas,

    You can use the VisiblePeriodStart, VisiblePeriodEnd, PeriodStart and PeriodEnd properties of RadTimeline.

    The PeriodStart/End allows you to define the minimum and maximum date available in the control.

    The VisiblePeriodStart/End allows you to define what portion of the timeline should be displayed. In other words it could be said that you can control the zooming level.

    Note that in order to display the different time units you will need to define different intervals for the hours, minutes, seconds, etc. Those are defined in the Intervals collection of the control.

    You can try those properties and let me know how it goes.

    Regards,
    Martin Ivanov
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
  5. Tomas
    Tomas avatar
    3 posts
    Member since:
    Dec 2017

    Posted 08 Jan in reply to Martin Ivanov Link to this post

    Hello Martin,

    this radtimeline is working for me,

    as last thin I'd like to show 3 hours period interval with header showing only first hour from it - 3:00,6:00....

    For this I set up telerik:HourInterval  IntervalSpans="3"

    and my last question is what your advice forhandling it -

    writing class from IIntervalFormatterProvider    ?

     

    Thanks in advance

    Tomas

     

     

  6. Stefan
    Admin
    Stefan avatar
    830 posts

    Posted 11 Jan Link to this post

    Hi Tomas,

    For the purpose of formatting you can benefit from the built-in formatting capabilities that RadtimeLine provides. As you have already found, for more customized formatting you can benefit from the IInternalFormatterProvided interface. An example of its implementation is demonstrated in the Formatter Provider help article. Can you please take a look at it?

    I hope this helps.

    Regards,
    Stefan
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top