在angularjs里面用echart，路由切换之后，图表会变形，如何处理？

Question

具体可以看图片，我路由切换后，图表就变形了，请问是为什么，怎么处理呢？谢谢！
这些表都是一个个指令，
指令代码:

'use strict';
angular.module('aicrm')
.directive('chart4', function($timeout) {
    return {
        restrict: 'E',
        templateUrl: 'app/components/chart4/chart4.html',
        link: function() {
            var option = '一个option对象...';
            echarts.init(document.getElementById('chart4')).setOption(option);
        }
    };
});

目前解决方法是用$timeout封装一下初始化方法放到任务最后执行。。。

Answer 1

我这边图表不多都是放在controller里面。
directive设置$timeout是方法之一
另一个方法参考戳我，仅供参考，本人是没有实践过0.0.

Answer 2

单从图上看，不太好判断是什么问题，不确定因素太多了。
如果图表是死的，那就是数据不一样了。跟踪下数据的变化。
可能存在异步的因素。页面加载了，数据没加载过来呢。可以在路由用resolve属性预加载数据。也可以先加个loading，等数据加载过来之后强制刷新一下。
具体啥问题判断不出来，简单猜测一下。建议你试试。