Set the background color of a sector in a radar chart in Chart.js - Javascript Chart.js

Javascript examples for Chart.js:Chart Color

  1. HOME
  2. Javascript
  3. Chart.js
  4. Chart Color

Description

Set the background color of a sector in a radar chart in Chart.js

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.1.1/Chart.min.js"></script> 
      <script type="text/javascript">
    window.onload=function(){/*from w w w  .java  2  s .co  m*/
var radarOptions = {
   scaleLineWidth :16 ,
}
// Radar Data
var radarData = {
   labels : ["January","February","March","April","May","June","July"],
   datasets : [
      {
         fillColor : "rgba(220,220,220,0.5)",
         strokeColor : "rgba(220,220,220,1)",
         data : [65,59,90,81,56,55,40]
      },
      {
         fillColor : "rgba(151,187,205,0.5)",
         strokeColor : "rgba(151,187,205,1)",
         data : [28,48,40,19,96,27,100]
      }
   ]
}
var ctx = document.getElementById("radarChart").getContext("2d");
var myRadarChart = new Chart(ctx).Radar(radarData, radarOptions);
    }

      </script> 
   </head> 
   <body> 
      <div class="chart-demo"> 
         <h2 class="title">Radar Chart</h2> 
         <canvas id="radarChart" width="640" height="400"></canvas> 
      </div>  
   </body>
</html>

Related Tutorials