ColorHandler javascript function

2 posts, 1 answers
  1. Steven
    Steven avatar
    3 posts
    Member since:
    Dec 2012

    Posted 02 Dec 2014 Link to this post

    Hi,

    I having an issue setting the chart colours using. Up to 8 seems to work fine but anything over 8 stops the colours
    being displayed in the right sequence. The first colour #008000 is displayed third.


    mvc


    .ColorHandler("setChartColour")

    javascript

    var idx = -1;

    function setChartColour()
    {
      if (idx == 9) //<------ 8 works
        idx = 0;
      else
        idx++;

      switch(idx)
      {
        case 0:
       {
         return '#008000';//<----Green
       }
       case 1:
       {
         return '#FF0000';//<---Red
       }
       case 2:
       {
         return '#0D0DFF';
       }
       case 3:
       {
         return '#993300';
       }
       case 4:
       {
         return '#9933FF';
       }
       case 5:
       {
         return '#FFCC00';
       }
       case 6:
       {
          return '#00CCFF';
       }
       case 7:
       {
         return '#5F5F5F';
       }
       case 8:
       {
         return '#FF33CC';
       }
       case 9:
       { 
         return '#FFCC00';
       }
      }//end switch
    }
  2. Answer
    T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 04 Dec 2014 Link to this post

    Hello,

    The index is available in the color function arguments.
    You can use the following simpler approach:

    var colors = ['#008000', '#FF0000', '#0D0DFF',
                  '#993300', '#9933FF', '#FFCC00',
                  '#00CCFF', '#5F5F5F', '#FF33CC'];

    function setChartColour(e) {
      return colors[e.index % colors.length];
    }


    I hope this helps.

    Regards,
    T. Tsonev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top