雷达图或蛛网图（Radar chart）
简介
A radar chart is a way of showing multiple data points and the variation between them.
They are often useful for comparing the points of two or more different data sets
使用案例
newChart(ctx).Radar(data,options);数据结构
var data ={ labels :["Eating","Drinking","Sleeping","Designing","Coding","Partying","Running"], datasets :[{ fillColor :"rgba(220,220,220,0.5)", strokeColor :"rgba(220,220,220,1)", pointColor :"rgba(220,220,220,1)", pointStrokeColor :"#fff", data :[65,59,90,81,56,55,40]},{ fillColor :"rgba(151,187,205,0.5)", strokeColor :"rgba(151,187,205,1)", pointColor :"rgba(151,187,205,1)", pointStrokeColor :"#fff", data :[28,48,40,19,96,27,100]}]}
For a radar chart, usually you will want to show a label on each point of the chart, so we include an array of strings that we show around each point in the chart. If you do not want this, you can either not include the array of labels, or choose to hide them in the chart options.
For the radar chart data, we have an array of datasets. Each of these is an object, with a fill colour, a stroke colour, a colour for the fill of each point, and a colour for the stroke of each point. We also have an array of data values.
图表
Radar.defaults ={//Boolean - If we show the scale above the chart data
scaleOverlay :false,//Boolean - If we want to override with a hard coded scale
scaleOverride :false,//** Required if scaleOverride is true **//Number - The number of steps in a hard coded scale
scaleSteps :null,//Number - The value jump in the hard coded scale
scaleStepWidth :null,//Number - The centre starting value
scaleStartValue :null,//Boolean - Whether to show lines for each scale point
scaleShowLine :true,//String - Colour of the scale line
scaleLineColor :"rgba(0,0,0,.1)",//Number - Pixel width of the scale line
scaleLineWidth :1,//Boolean - Whether to show labels on the scale
scaleShowLabels :false,//Interpolated JS string - can access value
scaleLabel :"<%=value%>",//String - Scale label font declaration for the scale label
scaleFontFamily :"'Arial'",//Number - Scale label font size in pixels
scaleFontSize :12,//String - Scale label font weight style
scaleFontStyle :"normal",//String - Scale label font colour
scaleFontColor :"#666",//Boolean - Show a backdrop to the scale label
scaleShowLabelBackdrop :true,//String - The colour of the label backdrop
scaleBackdropColor :"rgba(255,255,255,0.75)",//Number - The backdrop padding above & below the label in pixels
scaleBackdropPaddingY :2,//Number - The backdrop padding to the side of the label in pixels
scaleBackdropPaddingX :2,//Boolean - Whether we show the angle lines out of the radar
angleShowLineOut :true,//String - Colour of the angle line
angleLineColor :"rgba(0,0,0,.1)",//Number - Pixel width of the angle line
angleLineWidth :1,//String - Point label font declaration
pointLabelFontFamily :"'Arial'",//String - Point label font weight
pointLabelFontStyle :"normal",//Number - Point label font size in pixels
pointLabelFontSize :12,//String - Point label font colour
pointLabelFontColor :"#666",//Boolean - Whether to show a dot for each point
pointDot :true,//Number - Radius of each point dot in pixels
pointDotRadius :3,//Number - Pixel width of point dot stroke
pointDotStrokeWidth :1,//Boolean - Whether to show a stroke for datasets
datasetStroke :true,//Number - Pixel width of dataset stroke
datasetStrokeWidth :2,//Boolean - Whether to fill the dataset with a colour
datasetFill :true,//Boolean - Whether to animate the chart
animation :true,//Number - Number of animation steps
animationSteps :60,//String - Animation easing effect
animationEasing :"easeOutQuart",//Function - Fires when the animation is complete
onAnimationComplete :null}
Chart.js本站下载地址：
1.Chart.js