HTML5 Canvas雷达图(jquery插件Chart.js)

内容介绍

1. <script> 
2.                        var radarChartData = { 
3.                            labels: ["品牌", "做工", "材质", "款式", "新旧程度"], 
4.                            datasets: [ 
5.                                { 
6.                                    label: "", 
7.                                    fillColor: "rgba(0,0,0,0)", 
8.                                    strokeColor: "rgba(0,0,0,0)", 
9.                                    pointColor: "rgba(0,0,0,0)", 
10.                                    pointStrokeColor: "rgba(0,0,0,0)", 
11.                                    pointHighlightFill: "rgba(0,0,0,0)", 
12.                                    pointHighlightStroke: "rgba(0,0,0,0)", 
13.                                    data: [5,5,5,5,5] 
14.                                }, 
15.                                { 
16.                                    label: "", 
17.                                    fillColor: "rgba(0,0,0,0)", 
18.                                    strokeColor: "rgba(0,0,0,0)", 
19.                                    pointColor: "rgba(0,0,0,0)", 
20.                                    pointStrokeColor: "rgba(0,0,0,0)", 
21.                                    pointHighlightFill: "rgba(0,0,0,0)", 
22.                                    pointHighlightStroke: "rgba(0,0,0,0)", 
23.                                    data: [null,null,null,null,true] 
24.                                }, 
25.                                { 
26.                                    label: "变形玩具金刚4", 
27.                                    fillColor: "rgba(255,239,229,0.6)", 
28.                                    strokeColor: "rgba(227,211,201,0.6)", 
29.                                    pointColor: "rgba(255,95,1,1)", 
30.                                    pointStrokeColor: "#ff5f01", 
31.                                    pointHighlightFill: "#ff5f01", 
32.                                    pointHighlightStroke: "rgba(200,76,4,0.8)", 
33.                                    data: [4,5,5,2,5] 
34.                                } 
35.                            ] 
36.                        }; 
37.                      //B5教程网b5.mxunkeji.com 
38.                        window.onload = function(){ 
39.                            window.myRadar = new Chart(document.getElementById("myChart").getContext("2d")).Radar(radarChartData, { 
40.                                responsive: true 
41.                            }); 
42.                        } 
43.                    </script>