Creating a Gradient on Scatter Chart as background

3 posts, 0 answers
  1. Max
    Max avatar
    2 posts
    Member since:
    Aug 2015

    Posted 05 Aug 2015 Link to this post



    I am using a telerik scatter chart like this one my page

    I need to change the background to a gradient like this

    Is this possible? I currently have it hacked where I set the background property to transparent and put a gradient "image" in the back. 

    Is there a way to use CSS, HTML, or server side script to change the gradient? I also need it to be diagonal.


    Please help.



  2. Max
    Max avatar
    2 posts
    Member since:
    Aug 2015

    Posted 05 Aug 2015 Link to this post

    This is the only thing I have found on support but its for RadChart not HTMLRadChart


    Currently our code looks like:

    <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel2"></telerik:RadAjaxLoadingPanel> <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanelChart" LoadingPanelID="RadAjaxLoadingPanel2"> <br /> <div style=" margin-left:70px; width:800px; height:500px; background-image:url(/Content/Images/heatmap.png); background-repeat:no-repeat"> <telerik:RadHtmlChart runat="server" ID="ScatterChart" Width="800" Height="500" Transitions="true" DataSourceID="SqlDataSource1" Appearance-FillStyle-BackgroundColor="Transparent"> <PlotArea>


  3. Danail Vasilev
    Danail Vasilev avatar
    1502 posts

    Posted 10 Aug 2015 Link to this post

    Hello Max,

    The chart doesn't support gradient colors for its background. What I can suggest is that you create image with the gradient colors and use it as a background below the chart.

    Danail Vasilev
    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