select & chart opacity

4 posts, 0 answers
  1. Sagi
    Sagi avatar
    61 posts
    Member since:
    Sep 2008

    Posted 13 Aug 2013 Link to this post

    I'm using the "select" configuration of the chart (like showed in http://demos.kendoui.com/dataviz/api/selection.html) 
    However , I need to change the opacity of the non selected areas.
    Currently , the non selected areas are hardly shown due to very low opacity levels.
    What is the way to change this setting ?
    In addition , how can I control the zoom slider style itself ?
    Thx
    Sagi Karni 
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 14 Aug 2013 Link to this post

    Hello Sagi,

    Up to your questions:

    • The opacity of non selected areas is applied to elements with .k-mask class. Hence is order to change it you could use custom CSS rule. For example: 
      <style>
      .k-mask{
          opacity: 0.2;
      }
      </style>
    • You could customize the appearance of zoom slider using custom CSS too. For example: 
      <style>
      .k-selection{
          background: pink;
          border-color: green;
          /*............*/
      }
      </style>


    Regards,
    Iliana Nikolova
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Gary
    Gary avatar
    10 posts
    Member since:
    Feb 2013

    Posted 10 Sep 2013 Link to this post

    I would like to use the select feature with vertical CategoryAxes. Further, I would like to programatically control the selection. Neither of these seem possible, currently.
  4. T. Tsonev
    Admin
    T. Tsonev avatar
    2831 posts

    Posted 11 Sep 2013 Link to this post

    Hello,

    I can confirm that the selection is horizontal-only currently. Please feel free to cast your voice for vertical mode on UserVoice.

    The lack of a public API for the selection is indeed a pain point and we'll try to address this in future releases.
    Currently you can use setOptions for setting it:

    var chart = $("#chart").data("kendoChart");
    chart.setOptions({
        categoryAxis: {
            select: {
               from: 0,
               to: 5
            }
        }
    });
    // No need for calling redraw in future releases and latest internal builds
    chart.redraw();

    Apologies for the caused inconvenience.

    Regards,
    T. Tsonev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top