Target Chart

4 posts, 1 answers
  1. Shane
    Shane avatar
    8 posts
    Member since:
    Nov 2015

    Posted 04 Feb Link to this post

    I was wondering if this is even possible using the current set of tools.  I'm attaching an example of what our users would like to see.  This can be done in excel, but I've google searched how to do this and came up empty.  It's basically a radar chart that doesn't put the lines between plot points.  Can someone help me out on how to pull this off?
  2. T. Tsonev
    Admin
    T. Tsonev avatar
    2771 posts

    Posted 08 Feb Link to this post

    Hello,

    You can start with the radar line chart and customize it to display only markers:
                  type: "radarLine",

                  // Hide the line
                  width: 0,

                  // Show the markers
                  markers: {
                    visible: true
                  }

    See the full API reference for details.

    I hope this helps.

    Regards,
    T. Tsonev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Shane
    Shane avatar
    8 posts
    Member since:
    Nov 2015

    Posted 08 Feb in reply to T. Tsonev Link to this post

    Thanks for the API reference, that helped quite a bit.  However in it, I didn't see how to be able to color the background of the entire radarLine chart.  Is something like the attached possible?
  5. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2594 posts

    Posted 11 Feb Link to this post

    Hi Shane,

    In order to achieve this you could define multiple valueAxis.plotBands. As an example: 
    //....
    valueAxis: {
        visible: false,
        plotBands: [{             
            color: "green",
            from: 0,
            to: 50
        },{             
            color: "yellow",
            from: 51,
            to: 149
        }, {
            color: "orange",
            from: 150,
            to: 250
        }]
    },
    For your convenience here is a dojo.

    Regards,
    Iliana Nikolova
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET MVC is VS 2017 Ready