Provide multiple color to the consecutive events created in the same row

6 posts, 0 answers
  1. Nithin
    Nithin avatar
    67 posts
    Member since:
    Mar 2018

    Posted 17 Apr 2018 Link to this post

    Hi,

    I'm using vertical grouping in scheduler. One of my requirement involves giving color to the events created and each consecutive events color should be different.
    Also right now I have a list of color i need to map each color to the room color accordingly 

    My Example

  2. Tyler
    Tyler avatar
    68 posts
    Member since:
    Feb 2017

    Posted 18 Apr 2018 in reply to Nithin Link to this post

    So, you need colors mapped to the room, but each color next to each other in the same row needs to be different?
  3. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1201 posts

    Posted 19 Apr 2018 Link to this post

    Hi Nithin,

    As far as I can see from the Dojo sample sent, you have the color of each event properly mapped to the color of the Room it belongs to. In case you need to automatically generate a different color for each newly created event, I am afraid, that the Scheduler does not support such feature.

    If you think that such would add value to the widget, I would suggest you to log your idea on our Feedback portal. Based on the support it receives from the community, we will decide on whether to proceed with its implementation or not.

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  4. Nithin
    Nithin avatar
    67 posts
    Member since:
    Mar 2018

    Posted 19 Apr 2018 in reply to Tyler Link to this post

    yes that is the idea Tyler.
    Something like this(image below)
  5. Tyler
    Tyler avatar
    68 posts
    Member since:
    Feb 2017

    Posted 19 Apr 2018 in reply to Nithin Link to this post

    This may get a little complicated, but all you can do is modify the color in the dataBound event of the scheduler.

    I am thinking this will require extracting all events for a certain room from your array of events, which is easy enough with jQuery's $.grep function. 

    Then, you can loop through and apply a different color to each event associated with that room. If you need to go in a direct order, you can first sort the events by date and time.

    This will have to occur in the dataBound event of the scheduler. In here, you will have to manually change the css background-color of the events as you can't just do this with scheduler resources.

  6. Nithin
    Nithin avatar
    67 posts
    Member since:
    Mar 2018

    Posted 21 Apr 2018 in reply to Tyler Link to this post

    thanks for the insight Tyler :)
    i'll try this method 
Back to Top