Question

我正在使用带有Angular js的Fusion图表，数据是使用get请求从json到达但未加载到图表。消息＆＃34;没有要显示的数据＆＃34;显示。我的控制器代码。

var myApp=angular.module('angularApp',[]);

myApp.controller('countByOperator',function($scope,$http)
{
   $http.get("angular/controllers/data/callcountbyoperator.json").success(function(response){
    $scope.dataSource=response.data;
    alert($scope.dataSource);

    FusionCharts.ready(function(){
        var countByOperator=new FusionCharts({
            type:'bar2d',
            renderAt:'countByOperator',
            width:'450',
            dataFormat:'json',
            dataSource:$scope.dataSource
        });
        countByOperator.render();
    });
   });  
});

这是我的html代码：

<div style="border:1px solid #161616; margin:25px 0;" >
<div class="alBarHead">CALL COUNT BY OPERATORS</div>
<div id="countByOperator" ng-controller="countByOperator"  ng-init="" ng-    model="dataSource"></div>
</div>

Answer 1

考虑到您使用的是fusioncharts angular-js plugin，因此无需执行此操作

FusionCharts.ready(function(){
    var countByOperator=new FusionCharts({
        type:'bar2d',
        renderAt:'countByOperator',
        width:'450',
        dataFormat:'json',
        dataSource:$scope.dataSource
    });
    countByOperator.render();
});

如果您只是通过$scope.dataSource=response.data;更改模型，angularjs（以及反过来的fusioncharts）会自动更新视图。这就是使用它的全部意义。你的html就像

一样简单

<fusioncharts 
width="60" 
height="400"
type="column2d"
datasource="{{myDataSource}}"
></fusioncharts>

在控制器内部。

如果您没有使用插件 将html更改为

<div ng-controller="countByOperator">
    <div id="countByOperator"></div>
</div>

这应该有用。

使用Angular js在Fusion Chart中使用http get请求加载数据

1 个答案: