Results 1 to 7 of 7

Thread: Applying gradients to line chart fill color

Hybrid View

Previous Post Previous Post   Next Post Next Post
    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Dec 2011
    Location
    Hyderabad, India
    Posts
    117
    Answers
    6

    Default Applying gradients to line chart fill color

    Hi,
    I am working on a mobile application that contains different charts (like line, bar, column and pie). I have been trying to apply gradient colors to a line (single) chart fill color. But unfortunately i could not.

    Is it possible to apply color gradients to a line fill color? Please help.

    Thanks in advance,
    Nag

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449
    Answers
    3997

    Default

    You should be able to style it with CSS.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Dec 2011
    Location
    Hyderabad, India
    Posts
    117
    Answers
    6

    Default

    Hi Mitchell,
    fill: true, style:{fill:'#01DF01'} in series config option is filling with single color '#01DF01'. Where and how to apply CSS3 gradients in Ext.chart.Chart.
    Can you give sample code for applying gradient colors for line chart fill.

    Thanks in advance,
    Naga

  4. #4
    Sencha Premium Member
    Join Date
    Oct 2012
    Posts
    34

    Default

    any answer to this question. i am facing the same problem

  5. #5
    Sencha User
    Join Date
    Nov 2012
    Posts
    7

    Default

    you can write render in series

    renderer : function(sprite, storeItem, barAttr, i, store) {



    barAttr.fill = '003366';

    return barAttr;
    },

    try the above code .

  6. #6
    Sencha User
    Join Date
    Jan 2013
    Posts
    18

    Default

    i have try above code but it not work for me.

  7. #7

    Default

    Quote Originally Posted by Naga View Post
    Hi,
    I am working on a mobile application that contains different charts (like line, bar, column and pie). I have been trying to apply gradient colors to a line (single) chart fill color. But unfortunately i could not.

    Is it possible to apply color gradients to a line fill color? Please help.

    Thanks in advance,
    Nag
    Naga, you can create gradient line chart using Chart.js library. It is very easy to learn and use. I wrote a detailed tutorial with lots of done examples, you can check it on my blog. Good luck!


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •