title: Gauge graph with gradient green-yellow-red
body: <p>I am trying to achieve a gauge graph that will have a gradient based on the percentage it is full, similar to the image below. The closest I could manage is showing all the gradient colors regardless of the value - Like <a href="http://jsfiddle.net/64mfcg3v/4/" rel="nofollow noreferrer">here</a>.</p>
  
  <pre><code>    var x = 80; // Change x to see effects.
  </code></pre>
  
  <p>Did anyone managed to get a gradient based on value?</p>
  
  <p><a href="https://i.stack.imgur.com/EWbY1.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EWbY1.jpg" alt="enter image description here"></a></p>