title: Chart.js - add gradient instead of solid color - implementing solution
body: <p>I am using Chart.js and everything is ok, but I want to replace current color background <code>(fillColor : &quot;rgba(250,174,50,0.5)&quot;)</code> with a gradient.
  I have solution for replacing gradient but it's too dificult for me to implement this with my poor JS knowledge. I guess pretty easy for someone who know JS.</p>
  <p><strong>So my Chart.js code:</strong></p>
  <pre><code>        &lt;script&gt;
  
          var data = {
              labels : [&quot;02:00&quot;,&quot;04:00&quot;,&quot;06:00&quot;,&quot;08:00&quot;,&quot;10:00&quot;,&quot;12:00&quot;,&quot;14:00&quot;,&quot;16:00&quot;,&quot;18:00&quot;,&quot;20:00&quot;,&quot;22:00&quot;,&quot;00:00&quot;],
              datasets: [
                  {
                      fillColor : &quot;rgba(250,174,50,0.5)&quot;,
                      strokeColor : &quot;#ff6c23&quot;,
                      pointColor : &quot;#fff&quot;,
                      pointStrokeColor : &quot;#ff6c23&quot;,
                      pointHighlightFill: &quot;#fff&quot;,
                      pointHighlightStroke: &quot;#ff6c23&quot;,
                      data : [25.0,32.4,22.2,39.4,34.2,22.0,23.2,24.1,20.0,18.4,19.1,17.4]
                  }
              ]
          };
  
          var options = {
              responsive: true,
              datasetStrokeWidth : 3,
              pointDotStrokeWidth : 4,
              tooltipFillColor: &quot;rgba(0,0,0,0.8)&quot;,
              tooltipFontStyle: &quot;bold&quot;,
              tooltipTemplate: &quot;&lt;%if (label){%&gt;&lt;%=label + ' hod' %&gt;: &lt;%}%&gt;&lt;%= value + '°C' %&gt;&quot;,
              scaleLabel : &quot;&lt;%= Number(value).toFixed(0).replace('.', ',') + '°C'%&gt;&quot;
          };
  
          var ctx = document.getElementById(&quot;temp-chart&quot;).getContext(&quot;2d&quot;);
          var myLineChart = new Chart(ctx).Line(data, options);
  
      &lt;/script&gt;
  </code></pre>
  <p><strong>And <a href="http://jsbin.com/tayawutu/3/edit?html,css,js,output" rel="nofollow noreferrer">here is solution with gradient</a>.</strong> Can someone try implement this gradient background instead of my current solid background? Thanks for help.</p>
  <p>I tryed implement it, but then other functions don't work (like scaleLabels etc.).</p>