Chart.js报错

发布于 2022-09-04 21:33:54 字数 3985 浏览 16 评论 0

<canvas id="myChart" width="400" height="400"></canvas>
var ctx = $("#myChart").get(0).getContext("2d");
            var myNewChart = new Chart(ctx).Bar(data,options);
            var data = {
                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 options = {        
                //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 scale starting value
                scaleStartValue : null,
            
                //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 - Whether grid lines are shown across the chart
                scaleShowGridLines : true,
                
                //String - Colour of the grid lines
                scaleGridLineColor : "rgba(0,0,0,.05)",
                
                //Number - Width of the grid lines
                scaleGridLineWidth : 1,    
            
                //Boolean - If there is a stroke on each bar    
                barShowStroke : true,
                
                //Number - Pixel width of the bar stroke    
                barStrokeWidth : 2,
                
                //Number - Spacing between each of the X value sets
                barValueSpacing : 5,
                
                //Number - Spacing between data sets within X values
                barDatasetSpacing : 1,
                
                //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和jquery.js会抛出下面这个错误

clipboard.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

相对绾红妆 2022-09-11 21:33:54

var myNewChart = new Chart(ctx).Bar(data,options); 应该放在最后面。 变量定义后再使用

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文