0

当我尝试使用角度图表框架时,我可以看到我定义的系列,但看不到标签和数据。我在 index.html 中包含了以下三个文件

<link rel="stylesheet" href="bower_components/angular-chart.js/dist/angular-chart.css">
<script src="bower_components/Chart.js/Chart.js"></script>
<script src="bower_components/angular-chart.js/dist/angular-chart.js"></script>

这些是我在 $scope 中定义的变量

$scope.series = ["First", "Second"];
$scope.labels = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"];
$scope.data = [
    [12, 13, 8, 4, 29],
    [6, 12, 9, 8, 25]
];

它只显示这个: 仅显示系列

我究竟做错了什么?

编辑:经过进一步调查,我注意到当我在页面上执行后退 -> 前进时显示图表。因此,通过刷新您会丢失图表...

通过推迟范围变量,我可以在刷新后绘制图表,如下所示:

setTimeout(function (){
        $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]
        ];
    }, 0);

这意味着时间问题,我无法解决。

4

1 回答 1

0

您的图表是否在隐藏/显示的元素/层次结构中(例如 ng-show 或被换出的类,引导面板......)?

似乎正在发生的事情是 Chart.js 将画布的高度(当它由 angular-chart 初始化时,这反过来又在范围数据更改时发生)接近 0。

出于同样的原因,延迟变量更改有效 - 因为无论父/样式导致画布具有较小的高度现在都处于其全高。

于 2015-07-16T10:17:16.153 回答