Angularjs请求数据显示的ECharts图表,火狐可以显示,Chrome无法显示

环境:Angularjs1.6.5

html代码

 <equipment-analysis ng-if="equipdata" id="equipanalysis" equipdata="equipdata"></equipment-analysis>

图表的javascript代码

app.directive('equipmentAnalysis', function() {
     return {
         scope: {
             id: "@",
             equipdata: "="
         },
         restrict: 'E',
         template: '<div class="equipment-analysis-charts"></div>',

         link: function($scope, element, attrs, controller) {
             console.log($scope.equipdata)
             var option = {
                 color: ['#9966FF', '#0099FF'],
                 // 提示框,鼠标悬浮交互时的信息提示  
                 tooltip: {
                     show: true,
                     trigger: 'item'
                 },
                 // 图例  
                 legend: {
                     data: ['在线设备', '活跃设备']
                 },
                 // 横轴坐标轴  
                 xAxis: [{
                     type: 'category',
                     data: $scope.equipdata.date
                 }],
                 // 纵轴坐标轴  
                 yAxis: [{
                     type: 'value'
                 }],
                 // 数据内容数组  
                 series: [{
                     name: '在线设备',
                     type: 'line',
                     data: $scope.equipdata.newEquip
                 }, {
                     name: '活跃设备',
                     type: 'line',
                     data: $scope.equipdata.activeEquip
                 }]
             };
             var myChart = echarts.init(document.getElementById($scope.id), 'macarons');
             myChart.setOption(option);
         }
     };
 });

请求数据的javascript代码

$scope.equipdata = {}
$scope.equipdata.newEquip = $scope.newEquip.reverse()
$scope.equipdata.date = $scope.date.reverse()
$scope.equipdata.activeEquip = $scope.activeEquip.reverse()

火狐可以正常显示

clipboard.png

Chrome不行

clipboard.png

阅读 3.6k
1 个回答

chrome 下报错没,看看echarts容器的宽高

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题