如何安装Chart.js和angular-chart.js (错误:需要包含Chart.js库)
我想使用angular-chart.js，所以我按照安装说明，首先从Charts.js https://github.com/chartjs/Chart.js的github下载了最新版本，然后从github https://github.com/jtblin/angular-chart.js下载了最新版本的angular-charts.js。
我将此文件复制并粘贴到我的项目中：
这个文件来自chart.js chart.js (我从chart.js复制了这个文件，注意第一个字母是小写的)
THis文件来自angular-chart.js angular-chart.min.js
都包含如下所示
<script src="/myApp/chart.js"></script>
<script src="/myApp/angular-chart.min.js"></script>然后我将这个指令添加到我的应用程序中
angular.module('myApp',
[
'zingchart-angularjs',
'oitozero.ngSweetAlert',
'chart.js'
])但是我得到了这个错误
chart.js:4 Uncaught ReferenceError: require is not defined(anonymous function) @ chart.js:4
angular-chart.min.js:10Uncaught Error: Chart.js library needs to be included, see http://jtblin.github.io/angular-chart.js/
angular.min.js:6 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.7/$injector/modulerr?回答 2
Stack Overflow用户
发布于 2016-10-24 22:50:38
我想你下载了错误的Chart.js，这个错误是：chart.js:4 Uncaught ReferenceError: require is not defined(anonymous function)...来自于缺少只在node.js上工作的require函数，要在浏览器上工作，它应该使用browsefy或等效的功能。因此，我假设您没有生产chart.js，正如您在代码片段中看到的那样，使用angularjs、chart.js和angular-chart的CND，它工作得很好。
https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.bundle.js
- Angular-chart
//cdn.jsdelivr.net/angular.chartjs/latest/angular-chart.min.js
的
- Chart.js
angular.module('app', ['chart.js']);
angular.module('app')
.controller('MyController', function ($scope, $timeout) {
$scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
$scope.series = ['Series A', 'Series B'];
$scope.data = [
[65, 59, 80, 81, 56, 55, 40],
[28, 48, 40, 19, 86, 27, 90]
];
$scope.onClick = function (points, evt) {
console.log(points, evt);
};
// Simulate async data update
$timeout(function () {
$scope.data = [
[28, 48, 40, 19, 86, 27, 90],
[65, 59, 80, 81, 56, 55, 40]
];
}, 3000);
});
angular.element(document).ready(function(){
angular.bootstrap(document, ['app']);
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.bundle.js"></script>
<script src="//cdn.jsdelivr.net/angular.chartjs/latest/angular-chart.min.js"></script>
<div ng-controller="MyController">
<canvas class="chart chart-line" chart-data="data" chart-labels="labels"
chart-series="series" chart-click="onClick"></canvas>
</div>
Stack Overflow用户
发布于 2018-05-05 04:08:15
要在浏览器中使用。
1就像卡斯特罗说的那样，加上cdn，这是最方便和容易的。
2您可以尝试从NPM拉取。并在模块中查找并搜索"dist“文件夹，其中有分发文件。并调用add to file to your source。我找到的版本名为"Chart.bundle.js“
>YourProjectFolder
--->index.html
--->Chart.bundle.js您的index.html文件
<head>
<script src="Chart.bundle.js"></script>
</head>https://stackoverflow.com/questions/40221103
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号